@rolster/forms 2.6.4 → 2.7.0

package/dist/cjs/arguments.js

@@ -2,48 +2,50 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-function itIsFormControlOptions(props) {
-    return (typeof props === 'object' && ('value' in props || 'validators' in props));
+function itIsControlOptions(options) {
+    return (typeof options === 'object' &&
+        ('value' in options || 'validators' in options));
 }
-function itIsFormGroupOptions(props) {
-    return typeof props === 'object' && 'controls' in props;
+function itIsGroupOptions(options) {
+    return typeof options === 'object' && 'controls' in options;
 }
-function itIsFormArrayOptions(props) {
-    return (typeof props === 'object' && ('groups' in props || 'validators' in props));
+function itIsArrayOptions(options) {
+    return (typeof options === 'object' &&
+        ('groups' in options || 'validators' in options));
 }
-function createFormControlOptions(...argsProps) {
-    const [props, validators] = argsProps;
-    if (!props) {
-        return { value: props, validators };
+function createFormControlOptions(...controlOptions) {
+    const [options, validators] = controlOptions;
+    if (!options) {
+        return { value: options, validators };
     }
-    if (!validators && itIsFormControlOptions(props)) {
-        return props;
+    if (!validators && itIsControlOptions(options)) {
+        return options;
     }
     return {
-        value: props,
+        value: options,
         validators
     };
 }
-function createFormGroupOptions(...argsProps) {
-    const [props, validators] = argsProps;
-    if (!validators && itIsFormGroupOptions(props)) {
-        return props;
+function createFormGroupOptions(...groupOptions) {
+    const [options, validators] = groupOptions;
+    if (!validators && itIsGroupOptions(options)) {
+        return options;
     }
     return {
-        controls: props,
+        controls: options,
         validators
     };
 }
-function createFormArrayOptions(...argsProps) {
-    const [props, validators] = argsProps;
-    if (!props) {
-        return { groups: props, validators };
+function createFormArrayOptions(...arrayOptions) {
+    const [options, validators] = arrayOptions;
+    if (!options) {
+        return { groups: options, validators };
     }
-    if (!validators && itIsFormArrayOptions(props)) {
-        return props;
+    if (!validators && itIsArrayOptions(options)) {
+        return options;
     }
     return {
-        groups: props,
+        groups: options,
         validators
     };
 }

package/dist/cjs/arguments.js.map

@@ -1 +1 @@
-{"version":3,"file":"arguments.js","sources":["../esm/arguments.js"],"sourcesContent":["function itIsFormControlOptions(props) {\r\n    return (typeof props === 'object' && ('value' in props || 'validators' in props));\r\n}\r\nfunction itIsFormGroupOptions(props) {\r\n    return typeof props === 'object' && 'controls' in props;\r\n}\r\nfunction itIsFormArrayOptions(props) {\r\n    return (typeof props === 'object' && ('groups' in props || 'validators' in props));\r\n}\r\nexport function createFormControlOptions(...argsProps) {\r\n    const [props, validators] = argsProps;\r\n    if (!props) {\r\n        return { value: props, validators };\r\n    }\r\n    if (!validators && itIsFormControlOptions(props)) {\r\n        return props;\r\n    }\r\n    return {\r\n        value: props,\r\n        validators\r\n    };\r\n}\r\nexport function createFormGroupOptions(...argsProps) {\r\n    const [props, validators] = argsProps;\r\n    if (!validators && itIsFormGroupOptions(props)) {\r\n        return props;\r\n    }\r\n    return {\r\n        controls: props,\r\n        validators\r\n    };\r\n}\r\nexport function createFormArrayOptions(...argsProps) {\r\n    const [props, validators] = argsProps;\r\n    if (!props) {\r\n        return { groups: props, validators };\r\n    }\r\n    if (!validators && itIsFormArrayOptions(props)) {\r\n        return props;\r\n    }\r\n    return {\r\n        groups: props,\r\n        validators\r\n    };\r\n}\r\n//# sourceMappingURL=arguments.js.map"],"names":[],"mappings":";;;;AAAA,SAAS,sBAAsB,CAAC,KAAK,EAAE;AACvC,IAAI,QAAQ,OAAO,KAAK,KAAK,QAAQ,KAAK,OAAO,IAAI,KAAK,IAAI,YAAY,IAAI,KAAK,CAAC,EAAE;AACtF,CAAC;AACD,SAAS,oBAAoB,CAAC,KAAK,EAAE;AACrC,IAAI,OAAO,OAAO,KAAK,KAAK,QAAQ,IAAI,UAAU,IAAI,KAAK,CAAC;AAC5D,CAAC;AACD,SAAS,oBAAoB,CAAC,KAAK,EAAE;AACrC,IAAI,QAAQ,OAAO,KAAK,KAAK,QAAQ,KAAK,QAAQ,IAAI,KAAK,IAAI,YAAY,IAAI,KAAK,CAAC,EAAE;AACvF,CAAC;AACM,SAAS,wBAAwB,CAAC,GAAG,SAAS,EAAE;AACvD,IAAI,MAAM,CAAC,KAAK,EAAE,UAAU,CAAC,GAAG,SAAS,CAAC;AAC1C,IAAI,IAAI,CAAC,KAAK,EAAE;AAChB,QAAQ,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,UAAU,EAAE,CAAC;AAC5C,KAAK;AACL,IAAI,IAAI,CAAC,UAAU,IAAI,sBAAsB,CAAC,KAAK,CAAC,EAAE;AACtD,QAAQ,OAAO,KAAK,CAAC;AACrB,KAAK;AACL,IAAI,OAAO;AACX,QAAQ,KAAK,EAAE,KAAK;AACpB,QAAQ,UAAU;AAClB,KAAK,CAAC;AACN,CAAC;AACM,SAAS,sBAAsB,CAAC,GAAG,SAAS,EAAE;AACrD,IAAI,MAAM,CAAC,KAAK,EAAE,UAAU,CAAC,GAAG,SAAS,CAAC;AAC1C,IAAI,IAAI,CAAC,UAAU,IAAI,oBAAoB,CAAC,KAAK,CAAC,EAAE;AACpD,QAAQ,OAAO,KAAK,CAAC;AACrB,KAAK;AACL,IAAI,OAAO;AACX,QAAQ,QAAQ,EAAE,KAAK;AACvB,QAAQ,UAAU;AAClB,KAAK,CAAC;AACN,CAAC;AACM,SAAS,sBAAsB,CAAC,GAAG,SAAS,EAAE;AACrD,IAAI,MAAM,CAAC,KAAK,EAAE,UAAU,CAAC,GAAG,SAAS,CAAC;AAC1C,IAAI,IAAI,CAAC,KAAK,EAAE;AAChB,QAAQ,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,CAAC;AAC7C,KAAK;AACL,IAAI,IAAI,CAAC,UAAU,IAAI,oBAAoB,CAAC,KAAK,CAAC,EAAE;AACpD,QAAQ,OAAO,KAAK,CAAC;AACrB,KAAK;AACL,IAAI,OAAO;AACX,QAAQ,MAAM,EAAE,KAAK;AACrB,QAAQ,UAAU;AAClB,KAAK,CAAC;AACN;;;;;;"}
+{"version":3,"file":"arguments.js","sources":["../esm/arguments.js"],"sourcesContent":["function itIsControlOptions(options) {\r\n    return (typeof options === 'object' &&\r\n        ('value' in options || 'validators' in options));\r\n}\r\nfunction itIsGroupOptions(options) {\r\n    return typeof options === 'object' && 'controls' in options;\r\n}\r\nfunction itIsArrayOptions(options) {\r\n    return (typeof options === 'object' &&\r\n        ('groups' in options || 'validators' in options));\r\n}\r\nexport function createFormControlOptions(...controlOptions) {\r\n    const [options, validators] = controlOptions;\r\n    if (!options) {\r\n        return { value: options, validators };\r\n    }\r\n    if (!validators && itIsControlOptions(options)) {\r\n        return options;\r\n    }\r\n    return {\r\n        value: options,\r\n        validators\r\n    };\r\n}\r\nexport function createFormGroupOptions(...groupOptions) {\r\n    const [options, validators] = groupOptions;\r\n    if (!validators && itIsGroupOptions(options)) {\r\n        return options;\r\n    }\r\n    return {\r\n        controls: options,\r\n        validators\r\n    };\r\n}\r\nexport function createFormArrayOptions(...arrayOptions) {\r\n    const [options, validators] = arrayOptions;\r\n    if (!options) {\r\n        return { groups: options, validators };\r\n    }\r\n    if (!validators && itIsArrayOptions(options)) {\r\n        return options;\r\n    }\r\n    return {\r\n        groups: options,\r\n        validators\r\n    };\r\n}\r\n//# sourceMappingURL=arguments.js.map"],"names":[],"mappings":";;;;AAAA,SAAS,kBAAkB,CAAC,OAAO,EAAE;AACrC,IAAI,QAAQ,OAAO,OAAO,KAAK,QAAQ;AACvC,SAAS,OAAO,IAAI,OAAO,IAAI,YAAY,IAAI,OAAO,CAAC,EAAE;AACzD,CAAC;AACD,SAAS,gBAAgB,CAAC,OAAO,EAAE;AACnC,IAAI,OAAO,OAAO,OAAO,KAAK,QAAQ,IAAI,UAAU,IAAI,OAAO,CAAC;AAChE,CAAC;AACD,SAAS,gBAAgB,CAAC,OAAO,EAAE;AACnC,IAAI,QAAQ,OAAO,OAAO,KAAK,QAAQ;AACvC,SAAS,QAAQ,IAAI,OAAO,IAAI,YAAY,IAAI,OAAO,CAAC,EAAE;AAC1D,CAAC;AACM,SAAS,wBAAwB,CAAC,GAAG,cAAc,EAAE;AAC5D,IAAI,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,cAAc,CAAC;AACjD,IAAI,IAAI,CAAC,OAAO,EAAE;AAClB,QAAQ,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,UAAU,EAAE,CAAC;AAC9C,KAAK;AACL,IAAI,IAAI,CAAC,UAAU,IAAI,kBAAkB,CAAC,OAAO,CAAC,EAAE;AACpD,QAAQ,OAAO,OAAO,CAAC;AACvB,KAAK;AACL,IAAI,OAAO;AACX,QAAQ,KAAK,EAAE,OAAO;AACtB,QAAQ,UAAU;AAClB,KAAK,CAAC;AACN,CAAC;AACM,SAAS,sBAAsB,CAAC,GAAG,YAAY,EAAE;AACxD,IAAI,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,YAAY,CAAC;AAC/C,IAAI,IAAI,CAAC,UAAU,IAAI,gBAAgB,CAAC,OAAO,CAAC,EAAE;AAClD,QAAQ,OAAO,OAAO,CAAC;AACvB,KAAK;AACL,IAAI,OAAO;AACX,QAAQ,QAAQ,EAAE,OAAO;AACzB,QAAQ,UAAU;AAClB,KAAK,CAAC;AACN,CAAC;AACM,SAAS,sBAAsB,CAAC,GAAG,YAAY,EAAE;AACxD,IAAI,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,YAAY,CAAC;AAC/C,IAAI,IAAI,CAAC,OAAO,EAAE;AAClB,QAAQ,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,UAAU,EAAE,CAAC;AAC/C,KAAK;AACL,IAAI,IAAI,CAAC,UAAU,IAAI,gBAAgB,CAAC,OAAO,CAAC,EAAE;AAClD,QAAQ,OAAO,OAAO,CAAC;AACvB,KAAK;AACL,IAAI,OAAO;AACX,QAAQ,MAAM,EAAE,OAAO;AACvB,QAAQ,UAAU;AAClB,KAAK,CAAC;AACN;;;;;;"}

package/dist/cjs/index.js

@@ -2,51 +2,53 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var commons = require('@rolster/commons');
 var uuid = require('uuid');
+var commons = require('@rolster/commons');
 
-function itIsFormControlOptions(props) {
-    return (typeof props === 'object' && ('value' in props || 'validators' in props));
+function itIsControlOptions(options) {
+    return (typeof options === 'object' &&
+        ('value' in options || 'validators' in options));
 }
-function itIsFormGroupOptions(props) {
-    return typeof props === 'object' && 'controls' in props;
+function itIsGroupOptions(options) {
+    return typeof options === 'object' && 'controls' in options;
 }
-function itIsFormArrayOptions(props) {
-    return (typeof props === 'object' && ('groups' in props || 'validators' in props));
+function itIsArrayOptions(options) {
+    return (typeof options === 'object' &&
+        ('groups' in options || 'validators' in options));
 }
-function createFormControlOptions(...argsProps) {
-    const [props, validators] = argsProps;
-    if (!props) {
-        return { value: props, validators };
+function createFormControlOptions(...controlOptions) {
+    const [options, validators] = controlOptions;
+    if (!options) {
+        return { value: options, validators };
     }
-    if (!validators && itIsFormControlOptions(props)) {
-        return props;
+    if (!validators && itIsControlOptions(options)) {
+        return options;
     }
     return {
-        value: props,
+        value: options,
         validators
     };
 }
-function createFormGroupOptions(...argsProps) {
-    const [props, validators] = argsProps;
-    if (!validators && itIsFormGroupOptions(props)) {
-        return props;
+function createFormGroupOptions(...groupOptions) {
+    const [options, validators] = groupOptions;
+    if (!validators && itIsGroupOptions(options)) {
+        return options;
     }
     return {
-        controls: props,
+        controls: options,
         validators
     };
 }
-function createFormArrayOptions(...argsProps) {
-    const [props, validators] = argsProps;
-    if (!props) {
-        return { groups: props, validators };
+function createFormArrayOptions(...arrayOptions) {
+    const [options, validators] = arrayOptions;
+    if (!options) {
+        return { groups: options, validators };
     }
-    if (!validators && itIsFormArrayOptions(props)) {
-        return props;
+    if (!validators && itIsArrayOptions(options)) {
+        return options;
     }
     return {
-        groups: props,
+        groups: options,
         validators
     };
 }
@@ -106,158 +108,15 @@ function someErrors(errors, keys) {
     return reduceErrors(errors).some((key) => keys.includes(key));
 }
 
-class FormArray {
-    constructor(arrayOptions, arrayValidators) {
-        this.currentGroups = [];
-        this.currentValid = true;
-        this.currentDisabled = false;
-        this.currentErrors = [];
-        const { groups, validators } = createFormArrayOptions(arrayOptions, arrayValidators);
-        this.unsusbcriptions = new Map();
-        this.initialState = groups;
-        this.validators = validators;
-        this.refresh(this.initialState);
-        this.observable = commons.observable(this.value);
-        groups?.forEach((group) => {
-            this.subscription(group);
-        });
-    }
-    get groups() {
-        return this.currentGroups;
-    }
-    get controls() {
-        return this.groups.map(({ controls }) => controls);
-    }
-    get touched() {
-        return groupPartialChecked(this.groups, 'touched');
-    }
-    get touchedAll() {
-        return groupAllChecked(this.groups, 'touchedAll');
-    }
-    get untouched() {
-        return !this.touched;
-    }
-    get untouchedAll() {
-        return !this.touchedAll;
-    }
-    get dirty() {
-        return groupPartialChecked(this.groups, 'dirty');
-    }
-    get dirtyAll() {
-        return groupAllChecked(this.groups, 'dirtyAll');
-    }
-    get pristine() {
-        return !this.dirty;
-    }
-    get pristineAll() {
-        return !this.dirtyAll;
-    }
-    get disabled() {
-        return this.currentDisabled;
-    }
-    get enabled() {
-        return !this.currentDisabled;
-    }
-    get valid() {
-        return this.currentValid && groupAllChecked(this.groups, 'valid');
-    }
-    get invalid() {
-        return !this.currentValid;
-    }
-    get value() {
-        return this.groups.map(({ value: state }) => state);
-    }
-    get error() {
-        return this.currentError;
-    }
-    get errors() {
-        return this.currentErrors;
-    }
-    get wrong() {
-        return this.touched && this.invalid;
-    }
-    hasError(key) {
-        return hasError(this.errors, key);
-    }
-    someErrors(keys) {
-        return someErrors(this.errors, keys);
-    }
-    reset() {
-        this.refresh(this.initialState);
-    }
-    disable() {
-        this.currentDisabled = true;
-    }
-    enable() {
-        this.currentDisabled = false;
-    }
-    push(group) {
-        this.subscription(group);
-        this.refresh([...this.groups, group]);
-    }
-    merge(groups) {
-        groups.forEach((group) => {
-            this.subscription(group);
-        });
-        this.refresh([...this.groups, ...groups]);
-    }
-    set(groups) {
-        this.currentGroups.forEach(({ uuid }) => {
-            this.unsusbcriptions.delete(uuid);
-        });
-        groups.forEach((group) => {
-            this.subscription(group);
-        });
-        this.refresh(groups); // Update groups
-    }
-    remove({ uuid }) {
-        this.refresh(this.groups.filter((group) => group.uuid !== uuid));
-    }
-    setValidators(validators) {
-        this.validators = validators;
-        this.updateValidityStatus(this.groups, validators);
-    }
-    subscribe(subscriber) {
-        return this.observable.subscribe(subscriber);
-    }
-    subscription(group) {
-        const unsusbcription = group.subscribe(() => {
-            this.updateValidityStatus(this.groups, this.validators);
-        });
-        this.unsusbcriptions.set(group.uuid, unsusbcription);
-    }
-    updateValidityStatus(groups, validators) {
-        if (validators) {
-            const errors = arrayIsValid({ groups, validators });
-            this.currentErrors = errors;
-            this.currentError = errors[0];
-            this.currentValid = errors.length === 0;
-        }
-        else {
-            this.currentValid = true;
-            this.currentErrors = [];
-            this.currentError = undefined;
-        }
-    }
-    refresh(newGroups) {
-        const groups = newGroups || [];
-        this.currentGroups = groups;
-        this.updateValidityStatus(groups, this.validators);
-    }
-}
-function formArray(options, validators) {
-    return new FormArray(createFormArrayOptions(options, validators));
-}
-
 class FormControl {
-    constructor(controlProps, controlValidators) {
+    constructor(controlOptions, controlValidators) {
         this.currentFocused = false;
         this.currentTouched = false;
         this.currentDirty = false;
         this.currentDisabled = false;
         this.currentValid = true;
         this.currentErrors = [];
-        const { value, validators } = createFormControlOptions(controlProps, controlValidators);
+        const { value, validators } = createFormControlOptions(controlOptions, controlValidators);
         this.observable = commons.observable(value);
         this.initialValue = value;
         this.validators = validators;
@@ -480,14 +339,189 @@ function formArrayGroup(options, validators) {
     return new FormArrayGroup(createFormGroupOptions(options, validators));
 }
 
+class FormArrayList extends FormControl {
+    constructor(valueToControls, value, validators) {
+        super(value || [], validators);
+        this.valueToControls = valueToControls;
+        this.currentControls = (value || []).map((value) => this.createControls(value));
+        this.uuid = uuid.v4();
+    }
+    get controls() {
+        return this.currentControls;
+    }
+    setValue(values) {
+        this.currentControls = values.map((value) => this.createControls(value));
+        super.setValue(values);
+    }
+    createControls(value) {
+        const controls = this.valueToControls(value);
+        Object.values(controls).forEach((control) => {
+            control.subscribe(() => {
+                const { value, validators } = this;
+                this.updateValueAndValidity(value, validators);
+                this.observable.next(value);
+            });
+        });
+        return controls;
+    }
+}
+function formArrayList(valueToControl, value, validators) {
+    return new FormArrayList(valueToControl, value, validators);
+}
+
+class FormArray {
+    constructor(arrayOptions, arrayValidators) {
+        this.currentGroups = [];
+        this.currentValid = true;
+        this.currentDisabled = false;
+        this.currentErrors = [];
+        const { groups, validators } = createFormArrayOptions(arrayOptions, arrayValidators);
+        this.unsusbcriptions = new Map();
+        this.initialState = groups;
+        this.validators = validators;
+        this.refresh(this.initialState);
+        this.observable = commons.observable(this.value);
+        groups?.forEach((group) => {
+            this.subscription(group);
+        });
+    }
+    get groups() {
+        return this.currentGroups;
+    }
+    get controls() {
+        return this.groups.map(({ controls }) => controls);
+    }
+    get touched() {
+        return groupPartialChecked(this.groups, 'touched');
+    }
+    get touchedAll() {
+        return groupAllChecked(this.groups, 'touchedAll');
+    }
+    get untouched() {
+        return !this.touched;
+    }
+    get untouchedAll() {
+        return !this.touchedAll;
+    }
+    get dirty() {
+        return groupPartialChecked(this.groups, 'dirty');
+    }
+    get dirtyAll() {
+        return groupAllChecked(this.groups, 'dirtyAll');
+    }
+    get pristine() {
+        return !this.dirty;
+    }
+    get pristineAll() {
+        return !this.dirtyAll;
+    }
+    get disabled() {
+        return this.currentDisabled;
+    }
+    get enabled() {
+        return !this.currentDisabled;
+    }
+    get valid() {
+        return this.currentValid && groupAllChecked(this.groups, 'valid');
+    }
+    get invalid() {
+        return !this.currentValid;
+    }
+    get value() {
+        return this.groups.map(({ value: state }) => state);
+    }
+    get error() {
+        return this.currentError;
+    }
+    get errors() {
+        return this.currentErrors;
+    }
+    get wrong() {
+        return this.touched && this.invalid;
+    }
+    hasError(key) {
+        return hasError(this.errors, key);
+    }
+    someErrors(keys) {
+        return someErrors(this.errors, keys);
+    }
+    reset() {
+        this.refresh(this.initialState);
+    }
+    disable() {
+        this.currentDisabled = true;
+    }
+    enable() {
+        this.currentDisabled = false;
+    }
+    push(group) {
+        this.subscription(group);
+        this.refresh([...this.groups, group]);
+    }
+    merge(groups) {
+        groups.forEach((group) => {
+            this.subscription(group);
+        });
+        this.refresh([...this.groups, ...groups]);
+    }
+    set(groups) {
+        this.currentGroups.forEach(({ uuid }) => {
+            this.unsusbcriptions.delete(uuid);
+        });
+        groups.forEach((group) => {
+            this.subscription(group);
+        });
+        this.refresh(groups); // Update groups
+    }
+    remove({ uuid }) {
+        this.refresh(this.groups.filter((group) => group.uuid !== uuid));
+    }
+    setValidators(validators) {
+        this.validators = validators;
+        this.updateValidityStatus(this.groups, validators);
+    }
+    subscribe(subscriber) {
+        return this.observable.subscribe(subscriber);
+    }
+    subscription(group) {
+        const unsusbcription = group.subscribe(() => {
+            this.updateValidityStatus(this.groups, this.validators);
+        });
+        this.unsusbcriptions.set(group.uuid, unsusbcription);
+    }
+    updateValidityStatus(groups, validators) {
+        if (validators) {
+            const errors = arrayIsValid({ groups, validators });
+            this.currentErrors = errors;
+            this.currentError = errors[0];
+            this.currentValid = errors.length === 0;
+        }
+        else {
+            this.currentValid = true;
+            this.currentErrors = [];
+            this.currentError = undefined;
+        }
+    }
+    refresh(newGroups) {
+        const groups = newGroups || [];
+        this.currentGroups = groups;
+        this.updateValidityStatus(groups, this.validators);
+    }
+}
+function formArray(options, validators) {
+    return new FormArray(createFormArrayOptions(options, validators));
+}
+
 exports.FormArray = FormArray;
 exports.FormArrayControl = FormArrayControl;
 exports.FormArrayGroup = FormArrayGroup;
+exports.FormArrayList = FormArrayList;
 exports.FormControl = FormControl;
 exports.FormGroup = FormGroup;
 exports.formArray = formArray;
 exports.formArrayControl = formArrayControl;
 exports.formArrayGroup = formArrayGroup;
+exports.formArrayList = formArrayList;
 exports.formControl = formControl;
 exports.formGroup = formGroup;
 //# sourceMappingURL=index.js.map