ywana-core8 0.1.44 → 0.1.46

package/dist/index.umd.js

@@ -483,65 +483,34 @@
     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", {
@@ -4153,8 +4122,11 @@
      * Upload Area
      */
     var UploadArea = function UploadArea(props) {
-      var _props$label = props.label,
-        label = _props$label === void 0 ? 'Add file or drop file here...' : _props$label;
+      var icon = props.icon,
+        _props$label = props.label,
+        label = _props$label === void 0 ? 'Add file or drop file here...' : _props$label,
+        _props$disabled = props.disabled,
+        disabled = _props$disabled === void 0 ? false : _props$disabled;
       var areaElement = React.useRef();
       var _useState = React.useState(false),
         drag = _useState[0],
@@ -4166,19 +4138,24 @@
         }
       }, []);
       var onDragOver = function onDragOver() {
+        if (disabled) return;
         setDrag(true);
       };
       var onDragLeave = function onDragLeave() {
+        if (disabled) return;
         setDrag(false);
       };
       var dragging = drag === true ? 'drag-over' : '';
+      var disabledStyle = disabled === true ? 'disabled' : '';
       return /*#__PURE__*/React__default["default"].createElement("div", {
-        className: "upload-area6 " + dragging,
+        className: "upload-area6 " + dragging + " " + disabledStyle,
         onDragOver: onDragOver,
         onDragLeave: onDragLeave,
         ref: areaElement
       }, /*#__PURE__*/React__default["default"].createElement(UploadIcon, {
-        resumable: resumable
+        icon: icon,
+        resumable: resumable,
+        disabled: disabled
       }), /*#__PURE__*/React__default["default"].createElement("label", null, label));
     };
 
@@ -4188,7 +4165,9 @@
     var UploadIcon = function UploadIcon(_ref) {
       var _ref$icon = _ref.icon,
         icon = _ref$icon === void 0 ? "folder_open" : _ref$icon,
-        resumable = _ref.resumable;
+        resumable = _ref.resumable,
+        _ref$disabled = _ref.disabled,
+        disabled = _ref$disabled === void 0 ? false : _ref$disabled;
       var iconElement = React.useRef();
       React.useEffect(function () {
         if (resumable && iconElement.current) {
@@ -4200,7 +4179,8 @@
         ref: iconElement
       }, /*#__PURE__*/React__default["default"].createElement(Icon, {
         icon: icon,
-        clickable: true
+        clickable: true,
+        disabled: disabled
       }));
     };
 
@@ -4274,7 +4254,9 @@
         onProgress = _ref.onProgress,
         onSuccess = _ref.onSuccess,
         onError = _ref.onError,
-        onComplete = _ref.onComplete;
+        onComplete = _ref.onComplete,
+        _ref$disabled = _ref.disabled,
+        disabled = _ref$disabled === void 0 ? false : _ref$disabled;
       var resumable = React.useMemo(function () {
         var config = {
           target: target,
@@ -4331,18 +4313,21 @@
             return /*#__PURE__*/React__default["default"].createElement(UploadArea, {
               resumable: resumable,
               icon: icon,
-              label: label
+              label: label,
+              disabled: disabled
             });
           case "icon":
             return /*#__PURE__*/React__default["default"].createElement(UploadIcon, {
               resumable: resumable,
-              icon: icon
+              icon: icon,
+              disabled: disabled
             });
           default:
             return /*#__PURE__*/React__default["default"].createElement(UploadArea, {
               resumable: resumable,
               icon: icon,
-              label: label
+              label: label,
+              disabled: disabled
             });
         }
       }
@@ -4365,7 +4350,8 @@
         onClose = _ref.onClose,
         children = _ref.children,
         className = _ref.className,
-        disabled = _ref.disabled,
+        _ref$disabled = _ref.disabled,
+        disabled = _ref$disabled === void 0 ? false : _ref$disabled,
         onCanClose = _ref.onCanClose,
         _ref$overlayCanClose = _ref.overlayCanClose,
         overlayCanClose = _ref$overlayCanClose === void 0 ? true : _ref$overlayCanClose;
@@ -4402,12 +4388,13 @@
         actions: actions,
         className: className,
         overlayCanClose: overlayCanClose
-      }, disabled ? "" : /*#__PURE__*/React__default["default"].createElement(Uploader, {
+      }, /*#__PURE__*/React__default["default"].createElement(Uploader, {
         label: label,
         accept: accept,
         target: target,
         onSuccess: success,
-        onComplete: complete
+        onComplete: complete,
+        disabled: disabled
       }), children);
     };