@prolibu-suite/cobalt-form 0.1.0

package/dist/collection/components/co-form/co-form.js

@@ -0,0 +1,750 @@
+import { h } from "@stencil/core";
+import { createForm, createInlineValidator, describeFields, normalizeForValidation, } from "@prolibu-suite/cobalt-form-core";
+const PAGE_SIZE = 20;
+const blankRefState = () => ({
+    options: [],
+    selectedDisplay: [],
+    loading: false,
+    total: 0,
+    hasMore: false,
+    page: 1,
+    query: '',
+});
+/**
+ * Schema-driven form. Renders Cobalt input components from an inline
+ * Prolibu/Mongoose-style JSON schema and emits the validated payload on submit.
+ *
+ * Validation: bundled AJV (via `createInlineValidator` in form-core) handles
+ * required, format, min/max, minLength/maxLength, enum, regex out of the box.
+ * Hosts wanting full Prolibu FormSchemaWeb behavior can assign a pre-built
+ * `FormSchemaLike` to the `schemaInstance` element property.
+ *
+ * Ref fields: assign a `refResolver` function to the element to enable
+ * search + pagination + label hydration against your backend. See
+ * {@link RefResolver}.
+ *
+ * @slot header - Content above the fields.
+ * @slot footer - Content below the fields (default: a primary submit button).
+ * @slot field:<name> - Override the rendering of a specific field by name.
+ */
+export class CoForm {
+    constructor() {
+        /** Locale for labels and AJV error messages. */
+        this.locale = 'es';
+        /** Layout strategy for the field grid. */
+        this.layout = 'grid';
+        /** Disable all fields. */
+        this.disabled = false;
+        /** Read-only mode for all fields. */
+        this.readOnly = false;
+        this.snapshot = {
+            values: {},
+            errors: {},
+            touched: {},
+            isValid: true,
+            isDirty: false,
+            isSubmitting: false,
+        };
+        this.refStates = {};
+        this.controller = null;
+        this.fields = [];
+        this.unsubscribe = null;
+        // ── Form actions ──────────────────────────────────────────────────────────
+        this.handleFieldChange = (name, value) => {
+            var _a;
+            (_a = this.controller) === null || _a === void 0 ? void 0 : _a.setValue(name, value);
+            this.coChange.emit({ name, value });
+        };
+        this.handleSubmit = (e) => {
+            e.preventDefault();
+            if (!this.controller || !this.controller)
+                return;
+            const isValid = this.controller.validate();
+            if (!isValid) {
+                this.controller.touchAll();
+                return;
+            }
+            const properties = this.controller.fields.reduce((acc, f) => {
+                acc[f.name] = f.ajvProperty;
+                return acc;
+            }, {});
+            const values = normalizeForValidation(this.controller.state.values, properties);
+            this.coSubmit.emit({ values });
+        };
+        this.handleRefSearch = (f, query) => {
+            if (!this.refResolver)
+                return;
+            this.fetchRefPage(f, query, 1, /* append */ false);
+        };
+        this.handleRefLoadMore = (f) => {
+            var _a;
+            if (!this.refResolver)
+                return;
+            const prev = (_a = this.refStates[f.name]) !== null && _a !== void 0 ? _a : blankRefState();
+            if (prev.loading || !prev.hasMore)
+                return;
+            this.fetchRefPage(f, prev.query, prev.page + 1, /* append */ true);
+        };
+        this.handleRefSelect = (f, ev) => {
+            var _a, _b;
+            const detail = (_a = ev.detail) !== null && _a !== void 0 ? _a : {};
+            const value = detail.value;
+            const item = detail.item;
+            // Keep display labels in sync: add the picked option to selectedDisplay
+            // so chips render with the right text without re-fetching.
+            if (item) {
+                const prev = (_b = this.refStates[f.name]) !== null && _b !== void 0 ? _b : blankRefState();
+                const ids = Array.isArray(value) ? value : value ? [value] : [];
+                const display = [];
+                for (const id of ids) {
+                    const known = prev.selectedDisplay.find((d) => d.value === id) ||
+                        prev.options.find((o) => o.value === id) ||
+                        (item.value === id ? item : null);
+                    if (known)
+                        display.push(known);
+                    else
+                        display.push({ value: id, label: id });
+                }
+                this.patchRefState(f.name, { selectedDisplay: display });
+            }
+            this.handleFieldChange(f.name, value);
+        };
+    }
+    componentWillLoad() {
+        this.rebuildController();
+    }
+    onSchemaChange() {
+        this.rebuildController();
+    }
+    disconnectedCallback() {
+        var _a;
+        (_a = this.unsubscribe) === null || _a === void 0 ? void 0 : _a.call(this);
+        this.unsubscribe = null;
+    }
+    // ── Controller wiring ─────────────────────────────────────────────────────
+    rebuildController() {
+        var _a;
+        (_a = this.unsubscribe) === null || _a === void 0 ? void 0 : _a.call(this);
+        const instance = this.resolveSchemaInstance();
+        if (!instance) {
+            this.fields = [];
+            return;
+        }
+        const initialValues = this.parseInitialValues();
+        this.controller = createForm({
+            schema: { instance },
+            initialValues,
+        });
+        this.fields = describeFields(instance.formSchema.properties);
+        this.snapshot = this.controller.state;
+        this.unsubscribe = this.controller.subscribe((s) => {
+            this.snapshot = s;
+            this.coValidate.emit({ isValid: s.isValid, errors: s.errors });
+        });
+        this.initRefStates();
+    }
+    resolveSchemaInstance() {
+        var _a;
+        if (this.schemaInstance)
+            return this.schemaInstance;
+        if (!this.schema) {
+            console.warn('[co-form] no `schema` attribute provided');
+            return null;
+        }
+        try {
+            const parsed = JSON.parse(this.schema);
+            if (parsed && typeof parsed === 'object' && ((_a = parsed.formSchema) === null || _a === void 0 ? void 0 : _a.properties)) {
+                return parsed;
+            }
+            return createInlineValidator(parsed, this.locale);
+        }
+        catch (err) {
+            console.error('[co-form] failed to parse `schema` JSON:', err);
+            return null;
+        }
+    }
+    parseInitialValues() {
+        if (!this.initialValues)
+            return {};
+        try {
+            return JSON.parse(this.initialValues) || {};
+        }
+        catch (err) {
+            console.error('[co-form] failed to parse `initialValues` JSON:', err);
+            return {};
+        }
+    }
+    get excludedSet() {
+        if (!this.excludeFields)
+            return new Set();
+        return new Set(this.excludeFields
+            .split(',')
+            .map((n) => n.trim())
+            .filter(Boolean));
+    }
+    // ── Public methods (for slot content) ─────────────────────────────────────
+    /** Push a value into the controller from outside (e.g. from slot content). */
+    async setValue(name, value) {
+        this.handleFieldChange(name, value);
+    }
+    /** Read the current value of a field. */
+    async getValue(name) {
+        var _a;
+        return (_a = this.controller) === null || _a === void 0 ? void 0 : _a.getValue(name);
+    }
+    /** Mark a field as touched (forces its errors to be visible). */
+    async touch(name) {
+        var _a;
+        (_a = this.controller) === null || _a === void 0 ? void 0 : _a.touch(name);
+    }
+    hasSlotContent(slotName) {
+        return !!this.host.querySelector(`[slot="${slotName}"]`);
+    }
+    // ── Ref-field state ───────────────────────────────────────────────────────
+    initRefStates() {
+        const next = {};
+        const toHydrate = [];
+        for (const f of this.fields) {
+            if (f.kind !== 'ref')
+                continue;
+            const v = this.snapshot.values[f.name];
+            const state = blankRefState();
+            const { ids, display } = this.normalizeRefValue(f, v);
+            state.selectedDisplay = display;
+            next[f.name] = state;
+            // If we have ids but no labels (raw _id form), defer hydration.
+            const idsMissingLabel = ids.filter((id) => !display.some((d) => d.value === id));
+            if (idsMissingLabel.length > 0) {
+                toHydrate.push({ field: f, ids: idsMissingLabel });
+            }
+        }
+        this.refStates = next;
+        for (const { field, ids } of toHydrate) {
+            this.hydrateRefFieldLabels(field, ids);
+        }
+    }
+    /** Given a raw value, return the canonical {ids, display} pair. */
+    normalizeRefValue(f, v) {
+        const displayKey = f.originalAttrs.displayName || 'name';
+        const ids = [];
+        const display = [];
+        const intake = (item) => {
+            var _a, _b;
+            if (!item)
+                return;
+            if (typeof item === 'string') {
+                ids.push(item);
+            }
+            else if (typeof item === 'object' && item._id) {
+                ids.push(item._id);
+                display.push({
+                    value: item._id,
+                    label: String((_b = (_a = item[displayKey]) !== null && _a !== void 0 ? _a : item.name) !== null && _b !== void 0 ? _b : item._id),
+                    meta: item,
+                });
+            }
+        };
+        if (Array.isArray(v))
+            v.forEach(intake);
+        else
+            intake(v);
+        return { ids, display };
+    }
+    async hydrateRefFieldLabels(f, ids) {
+        var _a;
+        if (!this.refResolver) {
+            // No resolver registered — leave selectedDisplay empty; the field will
+            // render with the raw _id which is ugly but predictable.
+            console.warn(`[co-form] field "${f.name}" has unpopulated values but no refResolver is set; labels will fall back to raw ids.`);
+            return;
+        }
+        this.patchRefState(f.name, { loading: true });
+        try {
+            const result = await this.refResolver({
+                model: f.originalAttrs.ref,
+                ids,
+            });
+            const prev = (_a = this.refStates[f.name]) !== null && _a !== void 0 ? _a : blankRefState();
+            const seen = new Set(prev.selectedDisplay.map((d) => d.value));
+            const merged = [...prev.selectedDisplay];
+            for (const opt of result.options) {
+                if (!seen.has(opt.value))
+                    merged.push(opt);
+            }
+            this.patchRefState(f.name, { selectedDisplay: merged, loading: false });
+        }
+        catch (err) {
+            console.error(`[co-form] refResolver failed to hydrate "${f.name}":`, err);
+            this.patchRefState(f.name, { loading: false });
+        }
+    }
+    patchRefState(name, patch) {
+        var _a;
+        const prev = (_a = this.refStates[name]) !== null && _a !== void 0 ? _a : blankRefState();
+        this.refStates = Object.assign(Object.assign({}, this.refStates), { [name]: Object.assign(Object.assign({}, prev), patch) });
+    }
+    async fetchRefPage(f, query, page, append) {
+        var _a, _b, _c;
+        if (!this.refResolver)
+            return;
+        this.patchRefState(f.name, { loading: true, query });
+        try {
+            const result = await this.refResolver({
+                model: f.originalAttrs.ref,
+                query,
+                page,
+                pageSize: PAGE_SIZE,
+            });
+            const prev = (_a = this.refStates[f.name]) !== null && _a !== void 0 ? _a : blankRefState();
+            const options = append ? [...prev.options, ...result.options] : result.options;
+            const total = (_b = result.total) !== null && _b !== void 0 ? _b : options.length;
+            const hasMore = (_c = result.hasMore) !== null && _c !== void 0 ? _c : page * PAGE_SIZE < total;
+            this.patchRefState(f.name, {
+                options,
+                total,
+                hasMore,
+                page,
+                loading: false,
+            });
+        }
+        catch (err) {
+            console.error(`[co-form] refResolver failed:`, err);
+            this.patchRefState(f.name, { loading: false });
+        }
+    }
+    refValueAsString(f, raw) {
+        if (raw === undefined || raw === null)
+            return '';
+        const isMultiple = !!f.originalAttrs.multiple || f.originalAttrs.type === 'array';
+        if (Array.isArray(raw)) {
+            const ids = raw.map((x) => (typeof x === 'string' ? x : (x === null || x === void 0 ? void 0 : x._id) || ''));
+            return JSON.stringify(ids);
+        }
+        if (typeof raw === 'string')
+            return isMultiple ? JSON.stringify([raw]) : raw;
+        if (typeof raw === 'object' && raw._id) {
+            return isMultiple ? JSON.stringify([raw._id]) : String(raw._id);
+        }
+        return '';
+    }
+    // ── Render ────────────────────────────────────────────────────────────────
+    render() {
+        const excluded = this.excludedSet;
+        const visible = this.fields.filter((f) => !f.hidden && !excluded.has(f.name));
+        return (h("form", { key: '6cd71dc417b9a74b5131e9fe34955b4f4cced8a4', onSubmit: this.handleSubmit }, h("slot", { key: 'ef994d53f763fbe954f104a880bc675d60db8b79', name: "header" }), h("div", { key: '930d1f56c0f66e42441ffa57d71bcfdcd94d4677', class: `co-form-layout co-form-layout--${this.layout}` }, visible.map((f) => this.renderField(f))), h("div", { key: '2680a1eb2ddfc67773f247e226c1e8710514550f', class: "co-form-footer" }, h("slot", { key: '0c8adac9743830a4f990a5dfb3d0927ad5185d5f', name: "footer" }, h("co-button", { key: 'a092584e93fb6dd7623f537a4f9792f368454d45', type: "submit", label: "Enviar", variant: "primary" })))));
+    }
+    renderField(f) {
+        var _a;
+        // If the consumer provided a slot for this field, let it take over
+        // regardless of the kind. Lets external HTML replace any field rendering.
+        const slotName = `field:${f.name}`;
+        if (this.hasSlotContent(slotName)) {
+            return h("slot", { name: slotName });
+        }
+        const isTouched = !!this.snapshot.touched[f.name];
+        const errors = isTouched ? this.snapshot.errors[f.name] || [] : [];
+        const status = errors.length > 0 ? 'error' : 'default';
+        const helperText = errors[0] || f.helperText;
+        const value = this.snapshot.values[f.name];
+        const disabled = this.disabled || f.disabled;
+        const common = {
+            key: f.name,
+            label: f.label,
+            placeholder: f.placeholder,
+            required: f.required,
+            disabled,
+            status: status,
+            helperText: helperText,
+        };
+        switch (f.kind) {
+            case 'text':
+                return (h("co-input", Object.assign({}, common, { value: value !== null && value !== void 0 ? value : '', onCoInput: (e) => this.handleFieldChange(f.name, e.detail) })));
+            case 'textarea':
+                return (h("co-input", Object.assign({}, common, { multiline: true, value: value !== null && value !== void 0 ? value : '', onCoInput: (e) => this.handleFieldChange(f.name, e.detail) })));
+            case 'html':
+                return (h("co-input", Object.assign({}, common, { multiline: true, value: value !== null && value !== void 0 ? value : '', onCoInput: (e) => this.handleFieldChange(f.name, e.detail) })));
+            case 'date':
+                return (h("co-input", Object.assign({}, common, { type: "date", value: value !== null && value !== void 0 ? value : '', onCoInput: (e) => this.handleFieldChange(f.name, e.detail) })));
+            case 'number':
+                return (h("co-number-field", Object.assign({}, common, { value: typeof value === 'number' ? value : undefined, onCoChange: (e) => this.handleFieldChange(f.name, e.detail) })));
+            case 'boolean':
+                return (h("co-switch", Object.assign({}, common, { checked: !!value, onCoChange: (e) => this.handleFieldChange(f.name, e.detail) })));
+            case 'select':
+                return (h("co-select", Object.assign({}, common, { options: JSON.stringify(this.optionsFor(f)), value: String(value !== null && value !== void 0 ? value : ''), onCoChange: (e) => this.handleFieldChange(f.name, e.detail) })));
+            case 'ref': {
+                const refState = (_a = this.refStates[f.name]) !== null && _a !== void 0 ? _a : blankRefState();
+                const isMultiple = !!f.originalAttrs.multiple || f.originalAttrs.type === 'array';
+                return (h("co-ref-field", Object.assign({}, common, { model: f.originalAttrs.ref, multiple: isMultiple, value: this.refValueAsString(f, value), options: JSON.stringify(refState.options), selectedDisplay: JSON.stringify(refState.selectedDisplay), loading: refState.loading, total: refState.total, onCoOpen: () => {
+                        // Lazy-load on first open if we haven't fetched yet.
+                        if (this.refResolver && refState.options.length === 0 && !refState.loading) {
+                            this.fetchRefPage(f, '', 1, false);
+                        }
+                    }, onCoSearch: (e) => this.handleRefSearch(f, e.detail), onCoLoadMore: () => this.handleRefLoadMore(f), onCoChange: (e) => this.handleRefSelect(f, e) })));
+            }
+            case 'custom':
+            default:
+                return h("slot", { name: `field:${f.name}` });
+        }
+    }
+    optionsFor(f) {
+        const raw = f.originalAttrs.enum;
+        if (!Array.isArray(raw))
+            return [];
+        return raw.map((v) => ({ label: String(v), value: String(v) }));
+    }
+    static get is() { return "co-form"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["co-form.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["co-form.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "schema": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": true,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Raw Mongoose-style schema as a JSON string."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "schema"
+            },
+            "initialValues": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Initial field values as a JSON string."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "initial-values"
+            },
+            "schemaInstance": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "FormSchemaLike",
+                    "resolved": "FormSchemaLike | undefined",
+                    "references": {
+                        "FormSchemaLike": {
+                            "location": "import",
+                            "path": "@prolibu-suite/cobalt-form-core",
+                            "id": "../form-core/dist/index.d.ts::FormSchemaLike",
+                            "referenceLocation": "FormSchemaLike"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Pre-built FormSchemaLike \u2014 assigned as a JS property, bypasses parsing."
+                },
+                "getter": false,
+                "setter": false
+            },
+            "refResolver": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "RefResolver",
+                    "resolved": "((args: RefResolverArgs) => Promise<RefResolverResult>) | undefined",
+                    "references": {
+                        "RefResolver": {
+                            "location": "import",
+                            "path": "@prolibu-suite/cobalt-form-core",
+                            "id": "../form-core/dist/index.d.ts::RefResolver",
+                            "referenceLocation": "RefResolver"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Host-provided resolver for ref fields. Set as a JS property."
+                },
+                "getter": false,
+                "setter": false
+            },
+            "locale": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "Locale",
+                    "resolved": "\"en\" | \"es\" | \"pt\"",
+                    "references": {
+                        "Locale": {
+                            "location": "import",
+                            "path": "@prolibu-suite/cobalt-form-core",
+                            "id": "../form-core/dist/index.d.ts::Locale",
+                            "referenceLocation": "Locale"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Locale for labels and AJV error messages."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "locale",
+                "defaultValue": "'es'"
+            },
+            "layout": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'grid' | 'stack'",
+                    "resolved": "\"grid\" | \"stack\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Layout strategy for the field grid."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "layout",
+                "defaultValue": "'grid'"
+            },
+            "excludeFields": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Comma-separated list of field names to exclude from rendering."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "exclude-fields"
+            },
+            "disabled": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Disable all fields."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "disabled",
+                "defaultValue": "false"
+            },
+            "readOnly": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Read-only mode for all fields."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "read-only",
+                "defaultValue": "false"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "snapshot": {},
+            "refStates": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "coSubmit",
+                "name": "coSubmit",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Emits the payload (refs normalized to `_id`) after a successful submit."
+                },
+                "complexType": {
+                    "original": "{ values: Record<string, any> }",
+                    "resolved": "{ values: Record<string, any>; }",
+                    "references": {
+                        "Record": {
+                            "location": "global",
+                            "id": "global::Record"
+                        }
+                    }
+                }
+            }, {
+                "method": "coChange",
+                "name": "coChange",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Emits whenever a field changes."
+                },
+                "complexType": {
+                    "original": "{ name: string; value: any }",
+                    "resolved": "{ name: string; value: any; }",
+                    "references": {}
+                }
+            }, {
+                "method": "coValidate",
+                "name": "coValidate",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Emits validation state changes."
+                },
+                "complexType": {
+                    "original": "{ isValid: boolean; errors: Record<string, string[]> }",
+                    "resolved": "{ isValid: boolean; errors: Record<string, string[]>; }",
+                    "references": {
+                        "Record": {
+                            "location": "global",
+                            "id": "global::Record"
+                        }
+                    }
+                }
+            }];
+    }
+    static get methods() {
+        return {
+            "setValue": {
+                "complexType": {
+                    "signature": "(name: string, value: any) => Promise<void>",
+                    "parameters": [{
+                            "name": "name",
+                            "type": "string",
+                            "docs": ""
+                        }, {
+                            "name": "value",
+                            "type": "any",
+                            "docs": ""
+                        }],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "Push a value into the controller from outside (e.g. from slot content).",
+                    "tags": []
+                }
+            },
+            "getValue": {
+                "complexType": {
+                    "signature": "(name: string) => Promise<any>",
+                    "parameters": [{
+                            "name": "name",
+                            "type": "string",
+                            "docs": ""
+                        }],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<any>"
+                },
+                "docs": {
+                    "text": "Read the current value of a field.",
+                    "tags": []
+                }
+            },
+            "touch": {
+                "complexType": {
+                    "signature": "(name: string) => Promise<void>",
+                    "parameters": [{
+                            "name": "name",
+                            "type": "string",
+                            "docs": ""
+                        }],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "Mark a field as touched (forces its errors to be visible).",
+                    "tags": []
+                }
+            }
+        };
+    }
+    static get elementRef() { return "host"; }
+    static get watchers() {
+        return [{
+                "propName": "schema",
+                "methodName": "onSchemaChange"
+            }, {
+                "propName": "schemaInstance",
+                "methodName": "onSchemaChange"
+            }, {
+                "propName": "locale",
+                "methodName": "onSchemaChange"
+            }];
+    }
+}