ywana-core8 0.0.326 → 0.0.329

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ywana-core8",
-  "version": "0.0.326",
+  "version": "0.0.329",
   "description": "ywana-core8",
   "author": "Ernesto Roldan Garcia",
   "license": "MIT",

package/src/html/icon.js

@@ -4,11 +4,13 @@ import './icon.css'
 /**
  * Icon 
  */
-export const Icon = ({ icon, size = "normal", clickable = false, action }) => {
+export const Icon = ({ icon, size = "normal", clickable = false, action, eventPropagation = false }) => {
 
     function click (event) {
-        event.stopPropagation()
-        event.preventDefault();
+        if (!eventPropagation) {
+            event.stopPropagation()
+            event.preventDefault();
+        }
         if (action) action(event)
     }
 

package/src/site/dialog.js

@@ -10,15 +10,17 @@ import './dialog.css'
  */
 export const Dialog = (props) => {
     const site = useContext(SiteContext)
-    const { icon, title = "Dialog", children, onAction, actions, className } = props
+    const { icon, title = "Dialog", children, onAction, actions, className, eventPropagation = false } = props
     
     function close() {
         site.closeDialog()
     }
     
     function prevent(e) {
-        e.preventDefault()
-        e.stopPropagation()
+        if (!eventPropagation) {
+            e.preventDefault()
+            e.stopPropagation()
+        }
     }
     
     return (

package/src/widgets/upload/Upload.test.js

@@ -26,7 +26,7 @@ const UploadProgressTest = (prop) => {
 const UploaderTest = (prop) => {
     return (
         <div style={{ padding: "1rem" }}>
-            <Uploader target="https://maso.developxp.com/kiosk/api/upload" />
+            <Uploader icon="cloud_upload" target="https://maso.developxp.com/kiosk/api/upload" />
         </div>
     )
 }

package/src/widgets/upload/UploadArea.js

@@ -12,7 +12,10 @@ export const UploadArea = (props) => {
 
     useEffect(() => {
         const { resumable } = props
-        if (resumable && areaElement) resumable.assignDrop(areaElement.current)
+        if (resumable && areaElement) {
+            resumable.assignDrop(areaElement.current)
+            resumable.assignBrowse(areaElement.current)
+        }
     }, [])
 
     const onDragOver = () => {
@@ -31,7 +34,7 @@ export const UploadArea = (props) => {
             onDragLeave={onDragLeave}
             ref={areaElement}
         >
-            <UploadIcon icon={icon} resumable={props.resumable} />
+            <Icon icon={icon} clickable eventPropagation={false}/>
             <label>{label}</label>
         </div>
     )
@@ -40,14 +43,14 @@ export const UploadArea = (props) => {
 /**
  * Upload Icon
  */
-const UploadIcon = ({ icon = "folder_open", resumable }) => {
+export const UploadIcon = ({ icon = "folder_open", resumable }) => {
 
     const iconElement = useRef()
 
     useEffect(() => {
         if (resumable && iconElement.current) {
-            console.log('UploadIcon.effect', resumable, iconElement.current)
             resumable.assignBrowse(iconElement.current)
+            console.log('uploadicon')
         }
     }, [iconElement])
 

package/src/widgets/upload/UploadDialog.js

@@ -29,7 +29,7 @@ export const UploadDialog = ({ label, target, accept, onSuccess, onClose }) => {
 
     const title = <Text use="headline6">{label}</Text>
     return (
-        <Dialog title={title} open={true} onAction={onAction} actions={actions}>
+        <Dialog title={title} open={true} onAction={onAction} actions={actions} eventPropagation={true}>
             <Uploader label={label} accept={accept} target={target} onComplete={onComplete} />
         </Dialog>
     )

package/src/widgets/upload/Uploader.js

@@ -9,7 +9,7 @@ import './Uploader.css'
 /**
  * Uploader
  */
-export const Uploader = ({ label, target, accept, simultaneousUploads = 1, className, onProgress, onSuccess, onError, onComplete }) => {
+export const Uploader = ({ icon, label, target, accept, simultaneousUploads = 1, className, onProgress, onSuccess, onError, onComplete }) => {
 
         const resumable = useMemo(() => {
             const config = {
@@ -65,7 +65,7 @@ export const Uploader = ({ label, target, accept, simultaneousUploads = 1, class
 
         return (
             <div className={`uploader ${className}`}>
-                {state === UPLOAD_STATES.IDLE ? <UploadArea resumable={resumable} label={label}  /> : <UploadProgress files={files} /> }
+                {state === UPLOAD_STATES.IDLE ? <UploadArea resumable={resumable} icon={icon} label={label}  /> : <UploadProgress files={files} /> }
             </div>
         )
     }