peryl 1.5.6 → 1.5.8

package/demo/hsml-app-form_demo.ts

@@ -145,6 +145,16 @@ const view: HView<State, Actions> = function (state) {
                                 ]
                             ]
                         ]],
+                        ["p", [
+                            ["label", ["Data",
+                                ["input.w3-input", {
+                                    type: "file",
+                                    name: "file",
+                                    accept: "application/json,.json",
+                                    multiple: false
+                                }]
+                            ]]
+                        ]],
                         ["button.w3-btn.w3-blue", "Submit"]
                     ]
                 ]
@@ -163,7 +173,18 @@ const dispatcher: HDispatcher<State, Actions> = async function (action, state) {
             break;
 
         case Actions.change:
-            console.log("FormActions.change", JSON.stringify(action.data, null, 4));
+            console.log("FormActions.change", action.data);
+            if (action.data.file) {
+                const file = action.data.file as File;
+                // Read the file as text
+                console.log("FormActions.change file text:", await file.text());
+                // Abuse response to read json data
+                console.log("FormActions.change file json:", JSON.stringify(await new Response(file).json(), null, 4));
+                // Read the file as ArrayBuffer to handle binary data
+                console.log("FormActions.change file ArrayBuffer:", new Uint8Array(await file.arrayBuffer()));
+                // Read large data chunk by chunk
+                console.log("FormActions.change file stream:", file.stream());
+            }
             break;
 
         case Actions.submit:

package/demo/hsml-app-test_demo.ts

@@ -28,9 +28,11 @@ const counterDispatcher: HDispatcher<CounterState, CounterActions> = async funct
     // console.log("happ counter:", this);
 
     switch (action.type) {
+
         case HAppActions.mount:
             this.windowDispatchOn();
             break;
+
         case HAppActions.umount:
             this.windowDispatchOff();
             break;
@@ -48,6 +50,7 @@ const counterDispatcher: HDispatcher<CounterState, CounterActions> = async funct
             state.count = state.count + action.data as number;
             setTimeout(() => dispatch(CounterActions.dec, 1), 1e3); // async call
             break;
+
         case CounterActions.dec:
             state.count = state.count - action.data as number;
             break;

package/dist/browser-esmodule/hsml-app.js

@@ -981,7 +981,6 @@ var $9adf8bc2f1ba310f$export$3dcd9fad60135c2c;
     HAppActions["init"] = "happ-init";
     HAppActions["mount"] = "happ-mount";
     HAppActions["umount"] = "happ-umount";
-    HAppActions["update"] = "happ-update";
     HAppActions["action"] = "happ-action";
     HAppActions["attribute"] = "happ-attribute";
 })($9adf8bc2f1ba310f$export$3dcd9fad60135c2c || ($9adf8bc2f1ba310f$export$3dcd9fad60135c2c = {}));
@@ -1069,6 +1068,28 @@ class $9adf8bc2f1ba310f$export$8cfef5dc37c46888 {
             }
         });
     }
+    _dispatchElement(type, data) {
+        return $9adf8bc2f1ba310f$var$__awaiter(this, void 0, void 0, function*() {
+            this.customElement && $9adf8bc2f1ba310f$var$elementDispatchCustomEvent(this.customElement, $9adf8bc2f1ba310f$export$3dcd9fad60135c2c.action, {
+                type: type,
+                data: data
+            });
+            !this.customElement && this.element && $9adf8bc2f1ba310f$var$elementDispatchCustomEvent(this.element, $9adf8bc2f1ba310f$export$3dcd9fad60135c2c.action, {
+                type: type,
+                data: data
+            });
+        });
+    }
+    _dispatchWindow(type, data) {
+        return $9adf8bc2f1ba310f$var$__awaiter(this, void 0, void 0, function*() {
+            window.dispatchEvent(new CustomEvent($9adf8bc2f1ba310f$export$3dcd9fad60135c2c.action, {
+                detail: {
+                    type: type,
+                    data: data
+                }
+            }));
+        });
+    }
     windowDispatchOn() {
         if (!this._windowEventListener) {
             this._windowEventListener = (event)=>{
@@ -1094,24 +1115,6 @@ class $9adf8bc2f1ba310f$export$8cfef5dc37c46888 {
         this.dispatch = (type, data, scope)=>$9adf8bc2f1ba310f$var$__awaiter(this, void 0, void 0, function*() {
                 return this._dispatchAction(type, data, undefined, scope);
             });
-        this._dispatchElement = (type, data)=>$9adf8bc2f1ba310f$var$__awaiter(this, void 0, void 0, function*() {
-                this.customElement && $9adf8bc2f1ba310f$var$elementDispatchCustomEvent(this.customElement, $9adf8bc2f1ba310f$export$3dcd9fad60135c2c.action, {
-                    type: type,
-                    data: data
-                });
-                !this.customElement && this.element && $9adf8bc2f1ba310f$var$elementDispatchCustomEvent(this.element, $9adf8bc2f1ba310f$export$3dcd9fad60135c2c.action, {
-                    type: type,
-                    data: data
-                });
-            });
-        this._dispatchWindow = (type, data)=>$9adf8bc2f1ba310f$var$__awaiter(this, void 0, void 0, function*() {
-                window.dispatchEvent(new CustomEvent($9adf8bc2f1ba310f$export$3dcd9fad60135c2c.action, {
-                    detail: {
-                        type: type,
-                        data: data
-                    }
-                }));
-            });
         this.render = ()=>{
             if (this.debug) {
                 const t0 = performance.now();
@@ -1322,6 +1325,14 @@ function $9adf8bc2f1ba310f$var$formInputData(el) {
                     };
                     else data = iel.checked ? String(iel.value) : null;
                     break;
+                case "file":
+                    const files = iel.files;
+                    const value = files.length === 1 ? files[0] : files;
+                    if (iel.name) data = {
+                        [iel.name]: value
+                    };
+                    else data = value;
+                    break;
             }
             break;
         case "SELECT":