native-document 1.0.176 → 1.0.178

package/docs/components/form/form-control.md

@@ -41,7 +41,6 @@ FormControl.use(FormControlRender);
 .dispatchErrors(mapper?)
 .summarizeErrors()
 .dispatchAndSummarize(mapper?)
-.dispatchServerErrors(error)
 
 // State
 .disable(fieldName?)    // disable all or specific field
@@ -69,19 +68,5 @@ FormControl.use(FormControlRender);
 ## Example
 
 ```javascript
-const control = FormControl()
-    .fields((group) => {
-        group.add(StringField('name').label('Name').required())
-        group.add(EmailField('email').label('Email').required())
-        group.add(PasswordField('password').label('Password').required().minLength(8))
-    })
-    .onSubmit(async (values) => {
-        const valid = await control.validate();
-        if (valid) {
-            await createUser(values);
-        }
-    })
-    .onError((error) => {
-        control.dispatchErrors(error);
-    })
+
 ```

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "native-document",
-  "version": "1.0.176",
+  "version": "1.0.178",
   "description": "A reactive JavaScript framework that preserves native DOM simplicity without sacrificing modern features",
   "author": "AfroCodeur <https://github.com/afrocodeur>",
   "license": "MIT",

package/router.d.ts

@@ -2,6 +2,7 @@
 import {RouteParams, Router, Link} from "./types/router";
 
 export {
+    RouteParams,
     Router,
     Link
 }

package/src/components/form/FormControl.js

@@ -51,6 +51,7 @@ export default function FormControl(props) {
 }
 
 FormControl.defaultTemplate = null;
+FormControl.defaultErrorsMapper = null;
 
 /**
  * Registers the render template for FormControl.
@@ -73,6 +74,10 @@ FormControl.use = function(template) {
     FormControl.defaultTemplate = template;
 };
 
+FormControl.setDefaultErrorsMapper = function(mapper) {
+    FormControl.defaultErrorsMapper = mapper;
+};
+
 /**
  * @param {GlobalAttributes} [props]
  * @returns {FormControl}
@@ -235,9 +240,8 @@ FormControl.prototype.renderErrors = function(renderFn) {
 
 FormControl.prototype.$dispatchServerErrors = function(error) {
     const serverErrors = error.fields;
-    const mapped = this.$description.errorsMapper
-        ? this.$description.errorsMapper(serverErrors)
-        : serverErrors;
+    const errorsMapper = this.$description.errorsMapper || FormControl.defaultErrorsMapper;
+    const mapped = errorsMapper ? errorsMapper(error) : serverErrors;
 
     if(!mapped) {
         return;

package/src/core/data/Observable.js

@@ -216,8 +216,8 @@ Observable.json = Observable.init;
 
 Observable.resource = function(fn, deps = [], options = false) {
     const config = (typeof options === 'boolean')
-        ? { auto: options, debounce: 0, lazy: false }
-        : { auto: false, debounce: 0, lazy: false, ...options };
+        ? { auto: options, debounce: 0, lazy: false, throw: true }
+        : { auto: false, debounce: 0, lazy: false, ...options, throw: true };
 
     return new ObservableResource(fn, deps, config);
 };

package/src/core/data/ObservableResource.js

@@ -22,6 +22,7 @@ const STATE = {
  * @param {boolean} [config.lazy=false] - If true with deps, does not fetch immediately — waits for first dep change
  * @param {number} [config.debounce=0] - Debounce delay in ms for dependency-triggered re-fetches
  * @param {ObservableItem} [config.into] - Observable to write results into instead of creating a new one
+ * @param {boolean} [config.throw] - Catch abd throw the error
  * @param {Function} [config.apply] - Custom function to apply the result to this.data
  * @example
  * const userId = Observable(1);
@@ -86,7 +87,7 @@ ObservableResource.prototype.$runWithAbortController = function(isRefetch = fals
     const depValues = this.$dependencies.map(dep => dep.val());
     const args = [...depValues, signal];
 
-    Promise.resolve(this.$fn(...args))
+    return Promise.resolve(this.$fn(...args))
         .then(result => {
             if (signal.aborted) {
                 return;
@@ -98,11 +99,17 @@ ObservableResource.prototype.$runWithAbortController = function(isRefetch = fals
         })
         .catch(err => {
             if (signal.aborted) {
+                if(this.$config.throw) {
+                    throw err;
+                }
                 return;
             }
             this.error.set(err);
             this.state.set(STATE.ERRORED);
             this.$controller = null;
+            if(this.$config.throw) {
+                throw err;
+            }
         });
 };
 ObservableResource.prototype.$runWithoutAbortController = function(isRefetch = false) {
@@ -114,7 +121,7 @@ ObservableResource.prototype.$runWithoutAbortController = function(isRefetch = f
 
     const args = this.$dependencies.map(dep => dep.val());
 
-    Promise.resolve(this.$fn(...args))
+    return Promise.resolve(this.$fn(...args))
         .then(result => {
             this.$applyResult(result);
             this.error.set(null);
@@ -123,6 +130,9 @@ ObservableResource.prototype.$runWithoutAbortController = function(isRefetch = f
         .catch(err => {
             this.error.set(err);
             this.state.set(STATE.ERRORED);
+            if(this.$config.throw) {
+                throw err;
+            }
         });
 };
 
@@ -193,8 +203,7 @@ ObservableResource.prototype.into = function($observable) {
  * @returns {this}
  */
 ObservableResource.prototype.fetch = function() {
-    this.$run(false);
-    return this;
+    return this.$run(false);
 };
 
 /**
@@ -204,8 +213,7 @@ ObservableResource.prototype.fetch = function() {
  * @returns {this}
  */
 ObservableResource.prototype.refetch = function() {
-    this.$run(true);
-    return this;
+    return this.$run(true);
 };
 
 /**

package/src/core/utils/HasEventEmitter.js

@@ -78,7 +78,7 @@ HasEventEmitter.prototype.trigger = async function(eventName, ...args) {
 
     let result = null;
     for(let i = 0, length = callbacks.length; i < length; i++) {
-        result = await Promise.resolve(await callbacks[i].apply(this, args));
+        result = await Promise.resolve(callbacks[i].apply(this, args));
     }
     return result;
 };

package/src/ui/components/form/fields/PasswordFieldRender.js

@@ -8,7 +8,7 @@ export default function PasswordFieldRender($desc, instance) {
         const $visible = $(false);
         const icons    = $desc.visibilityIcons || {show: '👁', hide: '🙈'};
 
-        const toggleBtn = Button({class: 'field-visibility-toggle'},
+        const toggleBtn = Button({ type: 'button', class: 'field-visibility-toggle'},
             $visible.transform(v => v ? icons.hide : icons.show),
         );
 

package/types/observable.d.ts

@@ -267,6 +267,7 @@ export interface ObservableResourceConfig<T = any> {
     debounce?: number;
     into?: ObservableItem<T>;
     apply?: (result: any, data: ObservableItem<T>) => void;
+    throw: boolean;
 }
 
 export interface ObservableResource<T = any> {