@aemforms/af-core 0.22.19 → 0.22.20

package/lib/esm/Fieldset.js

@@ -0,0 +1,45 @@
+import Container from './Container.js';
+import { ExecuteRule, Initialize } from './controller/Events.js';
+const defaults = {
+    visible: true
+};
+export class Fieldset extends Container {
+    constructor(params, _options) {
+        super(params, _options);
+        this._applyDefaults();
+        this.queueEvent(new Initialize());
+        this.queueEvent(new ExecuteRule());
+    }
+    _applyDefaults() {
+        Object.entries(defaults).map(([key, value]) => {
+            if (this._jsonModel[key] === undefined) {
+                this._jsonModel[key] = value;
+            }
+        });
+        if (this._jsonModel.dataRef && this._jsonModel.type === undefined) {
+            this._jsonModel.type = 'object';
+        }
+    }
+    get type() {
+        const ret = super.type;
+        if (ret === 'array' || ret === 'object') {
+            return ret;
+        }
+        return undefined;
+    }
+    get items() {
+        return super.items;
+    }
+    get value() {
+        return null;
+    }
+    get fieldType() {
+        return 'panel';
+    }
+    get enabled() {
+        return this._jsonModel.enabled;
+    }
+    set enabled(e) {
+        this._setProperty('enabled', e);
+    }
+}

package/lib/{FileObject.d.ts → esm/FileObject.d.ts}

@@ -1,7 +1,4 @@
-import { IFileObject } from './types';
-/**
- * Defines a file object which implements the {@link IFileObject | file object interface}
- */
+import { IFileObject } from './types/index.js';
 export declare class FileObject implements IFileObject {
     data: any;
     mediaType: string;

package/lib/esm/FileObject.js

@@ -0,0 +1,26 @@
+export class FileObject {
+    data;
+    mediaType = 'application/octet-stream';
+    name = 'unknown';
+    size = 0;
+    constructor(init) {
+        Object.assign(this, init);
+    }
+    get type() {
+        return this.mediaType;
+    }
+    toJSON() {
+        return {
+            'name': this.name,
+            'size': this.size,
+            'mediaType': this.mediaType,
+            'data': this.data.toString()
+        };
+    }
+    equals(obj) {
+        return (this.data === obj.data &&
+            this.mediaType === obj.mediaType &&
+            this.name === obj.name &&
+            this.size === obj.size);
+    }
+}

package/lib/{FileUpload.d.ts → esm/FileUpload.d.ts}

@@ -1,9 +1,6 @@
-import Field from './Field';
-import { FieldModel } from './types';
-import DataGroup from './data/DataGroup';
-/**
- * Implementation of FileUpload runtime model which extends from {@link Field | field}
- */
+import Field from './Field.js';
+import { FieldModel } from './types/index.js';
+import DataGroup from './data/DataGroup.js';
 declare class FileUpload extends Field implements FieldModel {
     protected _getDefaults(): {
         accept: string[];
@@ -14,20 +11,8 @@ declare class FileUpload extends Field implements FieldModel {
         type: string | undefined;
     };
     protected _getFallbackType(): string | undefined;
-    /**
-     * Returns the max file size in bytes as per IEC specification
-     */
     get maxFileSize(): number;
-    /**
-     * Returns the list of mime types which file attachment can accept
-     */
     get accept(): string[] | undefined;
-    /**
-     * Checks whether there are any updates in the properties
-     * @param propNames
-     * @param updates
-     * @private
-     */
     protected _applyUpdates(propNames: string[], updates: any): any;
     protected getInternalType(): "file" | "file[]";
     protected getDataNodeValue(typedValue: any): any;

package/lib/esm/FileUpload.js

@@ -0,0 +1,108 @@
+import { propertyChange } from './controller/Events.js';
+import Field from './Field.js';
+import { getFileSizeInBytes } from './utils/FormUtils.js';
+import { FileObject } from './FileObject.js';
+import { Constraints } from './utils/ValidationUtils.js';
+function addNameToDataURL(dataURL, name) {
+    return dataURL.replace(';base64', `;name=${encodeURIComponent(name)};base64`);
+}
+function processFiles(files) {
+    return Promise.all([].map.call(files, processFile));
+}
+async function processFile(file) {
+    const { name, size, type } = file;
+    const fileObj = await new Promise((resolve, reject) => {
+        const reader = new FileReader();
+        reader.onload = event => {
+            resolve(new FileObject({
+                data: addNameToDataURL(event.target.result, name),
+                type,
+                name,
+                size
+            }));
+        };
+        reader.readAsDataURL(file.data);
+    });
+    return fileObj;
+}
+class FileUpload extends Field {
+    _getDefaults() {
+        return {
+            ...super._getDefaults(),
+            accept: ['audio/*', 'video/*', 'image/*', 'text/*', 'application/pdf'],
+            maxFileSize: '2MB'
+        };
+    }
+    _getFallbackType() {
+        return 'file';
+    }
+    get maxFileSize() {
+        return getFileSizeInBytes(this._jsonModel.maxFileSize);
+    }
+    get accept() {
+        return this._jsonModel.accept;
+    }
+    _applyUpdates(propNames, updates) {
+        return propNames.reduce((acc, propertyName) => {
+            const prevValue = this._jsonModel[propertyName];
+            const currentValue = updates[propertyName];
+            if (currentValue !== prevValue) {
+                acc[propertyName] = {
+                    propertyName,
+                    currentValue,
+                    prevValue
+                };
+                if (prevValue instanceof FileObject && typeof currentValue === 'object' && propertyName === 'value') {
+                    this._jsonModel[propertyName] = new FileObject({ ...prevValue, ...{ 'data': currentValue.data } });
+                }
+                else {
+                    this._jsonModel[propertyName] = currentValue;
+                }
+            }
+            return acc;
+        }, {});
+    }
+    getInternalType() {
+        return this.type?.endsWith('[]') ? 'file[]' : 'file';
+    }
+    getDataNodeValue(typedValue) {
+        let dataNodeValue = typedValue;
+        if (dataNodeValue != null) {
+            if (this.type === 'string') {
+                dataNodeValue = dataNodeValue.data?.toString();
+            }
+            else if (this.type === 'string[]') {
+                dataNodeValue = dataNodeValue instanceof Array ? dataNodeValue : [dataNodeValue];
+                dataNodeValue = dataNodeValue.map((_) => _?.data?.toString());
+            }
+        }
+        return dataNodeValue;
+    }
+    async _serialize() {
+        const val = this._jsonModel.value;
+        if (val === undefined) {
+            return null;
+        }
+        const filesInfo = await processFiles(val instanceof Array ? val : [val]);
+        return filesInfo;
+    }
+    importData(dataModel) {
+        this._bindToDataModel(dataModel);
+        const dataNode = this.getDataNode();
+        if (dataNode !== undefined) {
+            const value = dataNode?.$value;
+            if (value != null) {
+                const res = Constraints.type(this.getInternalType(), value);
+                if (!res.valid) {
+                    this.form.logger.error(`unable to bind ${this.name} to data`);
+                }
+                this.form.getEventQueue().queue(this, propertyChange('value', res.value, this._jsonModel.value));
+                this._jsonModel.value = res.value;
+            }
+            else {
+                this._jsonModel.value = null;
+            }
+        }
+    }
+}
+export default FileUpload;

package/lib/{Form.d.ts → esm/Form.d.ts}

@@ -1,57 +1,28 @@
-import Container from './Container';
-import { Action, BaseModel, FieldJson, FieldModel, FieldsetJson, FieldsetModel, FormJson, FormModel } from './types';
-import FormMetaData from './FormMetaData';
-import EventQueue from './controller/EventQueue';
-import { Logger, LogLevel } from './controller/Logger';
-import RuleEngine from './rules/RuleEngine';
-/**
- * Defines `form model` which implements {@link FormModel | form model}
- */
+import Container from './Container.js';
+import { Action, BaseModel, FieldModel, FieldsetModel, FormJson, FormModel, IFormFieldFactory } from './types/index.js';
+import FormMetaData from './FormMetaData.js';
+import EventQueue from './controller/EventQueue.js';
+import { Logger, LogLevel } from './controller/Logger.js';
+import RuleEngine from './rules/RuleEngine.js';
 declare class Form extends Container<FormJson> implements FormModel {
     private _ruleEngine;
     private _eventQueue;
-    /**
-     * @private
-     */
     private _fields;
-    /**
-     * @private
-     */
     _ids: Generator<string, void, string>;
-    /**
-     * @private
-     */
     private _invalidFields;
     private _logger;
-    /**
-     * @param n
-     * @param _ruleEngine
-     * @param _eventQueue
-     * @param logLevel
-     * @private
-     */
-    constructor(n: FormJson, _ruleEngine: RuleEngine, _eventQueue?: EventQueue, logLevel?: LogLevel);
+    constructor(n: FormJson, fieldFactory: IFormFieldFactory, _ruleEngine: RuleEngine, _eventQueue?: EventQueue, logLevel?: LogLevel);
     get logger(): Logger;
     private dataRefRegex;
     get metaData(): FormMetaData;
     get action(): string | undefined;
-    protected _createChild(child: FieldsetJson | FieldJson): FieldModel | FieldsetModel;
+    get lang(): string;
     importData(dataModel: any): void;
     exportData(): any;
     setFocus(field: BaseModel): void;
-    /**
-     * Returns the current state of the form
-     *
-     * To access the form data and attachments, one needs to use the `data` and `attachments` property.
-     * For example,
-     * ```
-     * const data = form.getState().data
-     * const attachments = form.getState().attachments
-     * ```
-     */
     getState(): {
         description?: string | undefined;
-    } & import("./types").RulesJson & {
+    } & import("./types/Json.js").RulesJson & {
         enumNames?: string[] | undefined;
         enum?: any[] | undefined;
     } & {
@@ -63,9 +34,7 @@ declare class Form extends Container<FormJson> implements FormModel {
         maxFileSize?: string | number | undefined;
         maxLength?: number | undefined;
         maximum?: number | undefined;
-        maxItems?: number | undefined; /**
-         * @private
-         */
+        maxItems?: number | undefined;
         minOccur?: number | undefined;
         maxOccur?: number | undefined;
         minLength?: number | undefined;
@@ -80,11 +49,11 @@ declare class Form extends Container<FormJson> implements FormModel {
     } & {
         dataRef?: string | null | undefined;
         ':type'?: string | undefined;
-        label?: import("./types").Label | undefined;
+        label?: import("./types/Json.js").Label | undefined;
         enabled?: boolean | undefined;
         visible?: boolean | undefined;
         name?: string | undefined;
-        constraintMessages?: import("./types").ConstraintsMessages | undefined;
+        constraintMessages?: import("./types/Json.js").ConstraintsMessages | undefined;
         fieldType?: string | undefined;
         errorMessage?: string | undefined;
         properties?: {
@@ -94,19 +63,18 @@ declare class Form extends Container<FormJson> implements FormModel {
         screenReaderText?: string | undefined;
         tooltip?: string | undefined;
         altText?: string | undefined;
+        viewType?: string | undefined;
     } & {
-        items: (FieldJson | import("./types").ContainerJson)[];
+        items: (import("./types/Json.js").FieldJson | import("./types/Json.js").ContainerJson)[];
         initialItems?: number | undefined;
         activeChild?: string | undefined;
     } & {
-        metadata?: import("./types").MetaDataJson | undefined;
+        metadata?: import("./types/Json.js").MetaDataJson | undefined;
         data?: any;
         title?: string | undefined;
         action?: string | undefined;
-        adaptiveForm?: string | undefined; /**
-         * @param field
-         * @private
-         */
+        adaptiveForm?: string | undefined;
+        lang?: string | undefined;
     } & {
         items: any[];
         properties: {
@@ -117,6 +85,7 @@ declare class Form extends Container<FormJson> implements FormModel {
         qualifiedName: any;
         events: {};
         rules: {};
+        repeatable: boolean | undefined;
         ':type': string;
         id: string;
     };
@@ -125,51 +94,16 @@ declare class Form extends Container<FormJson> implements FormModel {
     get form(): FormModel;
     get ruleEngine(): RuleEngine;
     getUniqueId(): string;
-    /**
-     * @param field
-     * @private
-     */
     fieldAdded(field: FieldModel | FieldsetModel): void;
-    /**
-     * visits each element in the form
-     * @param callBack a function which is invoked on each form element
-     * (including container type elements) visited
-     */
     visit(callBack: (field: FieldModel | FieldsetModel) => void): void;
-    /**
-     *
-     * @param container
-     * @param callBack
-     * @private
-     */
     traverseChild(container: Container<any>, callBack: (field: FieldModel | FieldsetModel) => void): void;
-    validate(): import("./types").ValidationError[];
-    /**
-     * Checks if the given form is valid or not
-     * @returns `true`, if form is valid, `false` otherwise
-     */
+    validate(): import("./types/Model.js").ValidationError[];
     isValid(): boolean;
-    /**
-     * @param field
-     * @private
-     */
     dispatch(action: Action): void;
-    /**
-     * @param action
-     * @private
-     */
     executeAction(action: Action): void;
-    /**
-     * @param action
-     * @param context
-     * @private
-     */
     submit(action: Action, context: any): void;
     getElement(id: string): FieldModel | FieldsetModel | this;
     get qualifiedName(): string;
-    /**
-     * @private
-     */
     getEventQueue(): EventQueue;
     get name(): string;
     get value(): null;

package/lib/esm/Form.js

@@ -0,0 +1,176 @@
+import Container from './Container.js';
+import FormMetaData from './FormMetaData.js';
+import EventQueue from './controller/EventQueue.js';
+import { Logger } from './controller/Logger.js';
+import { getAttachments, IdGenerator } from './utils/FormUtils.js';
+import DataGroup from './data/DataGroup.js';
+import { submit } from './rules/FunctionRuntime.js';
+import { ExecuteRule, FieldChanged, FormLoad, Initialize, ValidationComplete } from './controller/Events.js';
+class Form extends Container {
+    _ruleEngine;
+    _eventQueue;
+    _fields = {};
+    _ids;
+    _invalidFields = [];
+    _logger;
+    constructor(n, fieldFactory, _ruleEngine, _eventQueue = new EventQueue(), logLevel = 'off') {
+        super(n, { fieldFactory: fieldFactory });
+        this._ruleEngine = _ruleEngine;
+        this._eventQueue = _eventQueue;
+        this._logger = new Logger(logLevel);
+        this.queueEvent(new Initialize());
+        this.queueEvent(new ExecuteRule());
+        this._ids = IdGenerator();
+        this._bindToDataModel(new DataGroup('$form', {}));
+        this._initialize();
+        this.queueEvent(new FormLoad());
+    }
+    get logger() {
+        return this._logger;
+    }
+    dataRefRegex = /("[^"]+?"|[^.]+?)(?:\.|$)/g;
+    get metaData() {
+        const metaData = this._jsonModel.metadata || {};
+        return new FormMetaData(metaData);
+    }
+    get action() {
+        return this._jsonModel.action;
+    }
+    get lang() {
+        return this._jsonModel.lang || 'en';
+    }
+    importData(dataModel) {
+        this._bindToDataModel(new DataGroup('$form', dataModel));
+        this.syncDataAndFormModel(this.getDataNode());
+        this._eventQueue.runPendingQueue();
+    }
+    exportData() {
+        return this.getDataNode()?.$value;
+    }
+    setFocus(field) {
+        const parent = field.parent;
+        const currentField = field;
+        while (parent != null && parent.activeChild != currentField) {
+            parent.activeChild = currentField;
+        }
+    }
+    getState() {
+        const self = this;
+        const res = super.getState();
+        res.id = '$form';
+        Object.defineProperty(res, 'data', {
+            get: function () {
+                return self.exportData();
+            }
+        });
+        Object.defineProperty(res, 'attachments', {
+            get: function () {
+                return getAttachments(self);
+            }
+        });
+        return res;
+    }
+    get type() {
+        return 'object';
+    }
+    isTransparent() {
+        return false;
+    }
+    get form() {
+        return this;
+    }
+    get ruleEngine() {
+        return this._ruleEngine;
+    }
+    getUniqueId() {
+        if (this._ids == null) {
+            return '';
+        }
+        return this._ids.next().value;
+    }
+    fieldAdded(field) {
+        this._fields[field.id] = field;
+        field.subscribe((action) => {
+            if (this._invalidFields.indexOf(action.target.id) === -1) {
+                this._invalidFields.push(action.target.id);
+            }
+        }, 'invalid');
+        field.subscribe((action) => {
+            const index = this._invalidFields.indexOf(action.target.id);
+            if (index > -1) {
+                this._invalidFields.splice(index, 1);
+            }
+        }, 'valid');
+        field.subscribe((action) => {
+            const field = action.target.getState();
+            if (field) {
+                const fieldChangedAction = new FieldChanged(action.payload.changes, field);
+                this.dispatch(fieldChangedAction);
+            }
+        });
+    }
+    visit(callBack) {
+        this.traverseChild(this, callBack);
+    }
+    traverseChild(container, callBack) {
+        container.items.forEach((field) => {
+            if (field.isContainer) {
+                this.traverseChild(field, callBack);
+            }
+            callBack(field);
+        });
+    }
+    validate() {
+        const validationErrors = super.validate();
+        this.dispatch(new ValidationComplete(validationErrors));
+        return validationErrors;
+    }
+    isValid() {
+        return this._invalidFields.length === 0;
+    }
+    dispatch(action) {
+        if (action.type === 'submit') {
+            super.queueEvent(action);
+            this._eventQueue.runPendingQueue();
+        }
+        else {
+            super.dispatch(action);
+        }
+    }
+    executeAction(action) {
+        if ((action.type !== 'submit') || this._invalidFields.length === 0) {
+            super.executeAction(action);
+        }
+    }
+    submit(action, context) {
+        if (this.validate().length === 0) {
+            const payload = action?.payload || {};
+            submit(context, payload?.success, payload?.error, payload?.submit_as, payload?.data);
+        }
+    }
+    getElement(id) {
+        if (id == this.id) {
+            return this;
+        }
+        return this._fields[id];
+    }
+    get qualifiedName() {
+        return '$form';
+    }
+    getEventQueue() {
+        return this._eventQueue;
+    }
+    get name() {
+        return '$form';
+    }
+    get value() {
+        return null;
+    }
+    get id() {
+        return '$form';
+    }
+    get title() {
+        return this._jsonModel.title || '';
+    }
+}
+export default Form;

package/lib/esm/FormInstance.d.ts

@@ -0,0 +1,13 @@
+import { FormModel } from './types/index.js';
+import { LogLevel } from './controller/Logger.js';
+import { CustomFunction, FunctionDefinition } from './rules/FunctionRuntime.js';
+export declare const createFormInstance: (formModel: any, callback?: ((f: FormModel) => any) | undefined, logLevel?: LogLevel, fModel?: any) => FormModel;
+export declare const validateFormInstance: (formModel: any, data: any) => boolean;
+export declare const validateFormData: (formModel: any, data: any) => {
+    messages: any[];
+    valid: boolean;
+};
+export declare const fetchForm: (url: string, headers?: any) => Promise<string>;
+export declare const registerFunctions: (functions: {
+    [key: string]: Function | FunctionDefinition;
+}) => void;

package/lib/esm/FormInstance.js

@@ -0,0 +1,81 @@
+import Form from './Form.js';
+import { jsonString } from './utils/JsonUtils.js';
+import { request } from './utils/Fetch.js';
+import RuleEngine from './rules/RuleEngine.js';
+import EventQueue from './controller/EventQueue.js';
+import { Logger } from './controller/Logger.js';
+import { FormFieldFactory } from './utils/FormCreationUtils.js';
+import { FunctionRuntime } from './rules/FunctionRuntime.js';
+export const createFormInstance = (formModel, callback, logLevel = 'error', fModel = undefined) => {
+    try {
+        let f = fModel;
+        if (f == null) {
+            f = new Form({ ...formModel }, FormFieldFactory, new RuleEngine(), new EventQueue(new Logger(logLevel)), logLevel);
+        }
+        const formData = formModel?.data;
+        if (formData) {
+            f.importData(formData);
+        }
+        if (typeof callback === 'function') {
+            callback(f);
+        }
+        f.getEventQueue().runPendingQueue();
+        return f;
+    }
+    catch (e) {
+        console.error(`Unable to create an instance of the Form ${e}`);
+        throw new Error(e);
+    }
+};
+export const validateFormInstance = (formModel, data) => {
+    try {
+        const f = new Form({ ...formModel }, FormFieldFactory, new RuleEngine());
+        if (data) {
+            f.importData(data);
+        }
+        return f.validate().length === 0;
+    }
+    catch (e) {
+        throw new Error(e);
+    }
+};
+export const validateFormData = (formModel, data) => {
+    try {
+        const f = new Form({ ...formModel }, FormFieldFactory, new RuleEngine());
+        if (data) {
+            f.importData(data);
+        }
+        const res = f.validate();
+        return {
+            messages: res,
+            valid: res.length === 0
+        };
+    }
+    catch (e) {
+        throw new Error(e);
+    }
+};
+export const fetchForm = (url, headers = {}) => {
+    const headerObj = new Headers();
+    Object.entries(headers).forEach(([key, value]) => {
+        headerObj.append(key, value);
+    });
+    return new Promise((resolve, reject) => {
+        request(`${url}.model.json`, null, { headers }).then((response) => {
+            if (response.status !== 200) {
+                reject('Not Found');
+            }
+            else {
+                let formObj = response.body;
+                if ('model' in formObj) {
+                    const { model } = formObj;
+                    formObj = model;
+                }
+                resolve(jsonString(formObj));
+            }
+        });
+    });
+};
+export const registerFunctions = (functions) => {
+    FunctionRuntime.registerFunctions(functions);
+};

package/lib/esm/FormMetaData.d.ts

@@ -0,0 +1,7 @@
+import { FormMetaDataModel, MetaDataJson } from './types/index.js';
+import Node from './Node.js';
+declare class FormMetaData extends Node<MetaDataJson> implements FormMetaDataModel {
+    get version(): string;
+    get grammar(): string;
+}
+export default FormMetaData;

package/lib/esm/FormMetaData.js

@@ -0,0 +1,10 @@
+import Node from './Node.js';
+class FormMetaData extends Node {
+    get version() {
+        return this.getP('version', '');
+    }
+    get grammar() {
+        return this.getP('grammar', '');
+    }
+}
+export default FormMetaData;