@icure/form 3.0.39 → 3.0.42

package/components/icure-form/renderer/form/form.js

@@ -7,31 +7,6 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-var __await = (this && this.__await) || function (v) { return this instanceof __await ? (this.v = v, this) : new __await(v); }
-var __asyncGenerator = (this && this.__asyncGenerator) || function (thisArg, _arguments, generator) {
-    if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined.");
-    var g = generator.apply(thisArg, _arguments || []), i, q = [];
-    return i = Object.create((typeof AsyncIterator === "function" ? AsyncIterator : Object).prototype), verb("next"), verb("throw"), verb("return", awaitReturn), i[Symbol.asyncIterator] = function () { return this; }, i;
-    function awaitReturn(f) { return function (v) { return Promise.resolve(v).then(f, reject); }; }
-    function verb(n, f) { if (g[n]) { i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; if (f) i[n] = f(i[n]); } }
-    function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }
-    function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }
-    function fulfill(value) { resume("next", value); }
-    function reject(value) { resume("throw", value); }
-    function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }
-};
-var __asyncValues = (this && this.__asyncValues) || function (o) {
-    if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined.");
-    var m = o[Symbol.asyncIterator], i;
-    return m ? m.call(o) : (o = typeof __values === "function" ? __values(o) : o[Symbol.iterator](), i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i);
-    function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }
-    function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }
-};
-var __asyncDelegator = (this && this.__asyncDelegator) || function (o) {
-    var i, p;
-    return i = {}, verb("next"), verb("throw", function (e) { throw e; }), verb("return"), i[Symbol.iterator] = function () { return this; }, i;
-    function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: false } : f ? f(v) : v; } : f; }
-};
 import { html, nothing } from 'lit';
 import { fieldValuesProvider, getValidationErrorProvider, handleMetadataChangedProvider, handleValueChangedProvider } from '../../../../utils/fields-values-provider';
 import { defaultTranslationProvider } from '../../../../utils/languages';
@@ -39,604 +14,465 @@ import { getLabels } from '../../../common/utils';
 import { filterAndSortOptionsFromFieldDefinition, sortSuggestions } from '../../../../utils/code-utils';
 import './form-selection-button';
 import { currentDate, currentDateTime, currentTime } from '../../../../utils/dates';
-function allNext(subGenerators, cache) {
-    return __awaiter(this, void 0, void 0, function* () {
-        let done = true;
-        const subElements = yield Promise.all(subGenerators.map((sg, idx) => __awaiter(this, void 0, void 0, function* () {
-            if (!sg) {
-                return nothing;
-            }
-            if (cache[idx]) {
-                return cache[idx];
+export const render = (form_1, props_1, formsValueContainer_1, translationProvider_1, ...args_1) => __awaiter(void 0, [form_1, props_1, formsValueContainer_1, translationProvider_1, ...args_1], void 0, function* (form, props, formsValueContainer, translationProvider, ownersProvider = () => __awaiter(void 0, void 0, void 0, function* () { return []; }), optionsProvider, actionListener = () => undefined, languages, readonly, displayMetadata, sectionWrapper) {
+    const composedOptionsProvider = optionsProvider && form.codifications
+        ? (language, codifications, terms, sortOptions) => __awaiter(void 0, void 0, void 0, function* () {
+            var _a, _b, _c;
+            const originalOptions = optionsProvider ? yield optionsProvider(language, codifications, terms) : [];
+            return sortSuggestions(originalOptions.concat((_c = (_b = (_a = form.codifications) === null || _a === void 0 ? void 0 : _a.filter((c) => codifications.includes(c.type))) === null || _b === void 0 ? void 0 : _b.flatMap((c) => c.codes
+                .filter((c) => (terms !== null && terms !== void 0 ? terms : []).map((st) => st.toLowerCase()).every((st) => c.label[language].toLowerCase().includes(st)))
+                .map((c) => ({ id: c.id, label: c.label, text: c.label[language], terms: terms !== null && terms !== void 0 ? terms : [] })))) !== null && _c !== void 0 ? _c : []), language, sortOptions);
+        })
+        : optionsProvider
+            ? (language, codifications, terms, sortOptions) => {
+                var _a;
+                return (_a = optionsProvider === null || optionsProvider === void 0 ? void 0 : optionsProvider(language, codifications, terms).then((codes) => sortSuggestions(codes, language, sortOptions))) !== null && _a !== void 0 ? _a : Promise.resolve([]);
             }
-            const itv = yield sg.next();
-            if (itv.value) {
-                const [value, isStale] = itv.value;
-                if (isStale) {
-                    cache[idx] = value;
+            : undefined;
+    const h = function (level, className = '', content) {
+        return level === 1
+            ? html `<h1 class="${className}">${content}</h1>`
+            : level === 2
+                ? html `<h2 class="${className}">${content}</h2>`
+                : level === 3
+                    ? html `<h3 class="${className}">${content}</h3>`
+                    : level === 4
+                        ? html `<h4 class="${className}">${content}</h4>`
+                        : level === 5
+                            ? html `<h5 class="${className}">${content}</h5>`
+                            : html `<h6 class="${className}">${content}</h6>`;
+    };
+    function renderGroup(fg, fgSpan, level) {
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a;
+            const subElements = (yield Promise.all(((_a = fg.fields) !== null && _a !== void 0 ? _a : []).map((fieldOrGroup) => renderFieldGroupOrSubform(fieldOrGroup, level + 1)))).filter((x) => !!x && x !== nothing);
+            return subElements.length
+                ? html `<div class="${['group', fg.borderless ? undefined : 'bordered'].filter((x) => !!x).join(' ')}" style="${calculateFieldOrGroupSize(fgSpan, 1)}">
+					${fg.borderless ? nothing : html `<div>${h(level, '', html `${fg.group}`)}</div>`}
+					<div class="icure-form">${subElements}</div>
+			  </div>`
+                : nothing;
+        });
+    }
+    function renderSubform(fg, fgSpan, level) {
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a, _b, _c;
+            const children = (_a = (yield (formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.getChildren()))) === null || _a === void 0 ? void 0 : _a.filter((c) => c.getLabel() === fg.id);
+            const tp = translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations));
+            return html `<div class="subform" style="${calculateFieldOrGroupSize(fgSpan, 1)}">
+			<div class="subform__heading">
+				${h(level, 'subform__heading__title', html `${(_b = (props.language && fg.shortLabel ? tp === null || tp === void 0 ? void 0 : tp(props.language, fg.shortLabel) : fg.shortLabel)) !== null && _b !== void 0 ? _b : ''}`)}
+				${readonly
+                ? nothing
+                : html `<form-selection-button
+							.label="${(_c = fg.labels.add) !== null && _c !== void 0 ? _c : 'Add subform'}"
+							.forms="${Object.entries(fg.forms)}"
+							.formAdded="${(title, form) => {
+                    var _a;
+                    form.id && (formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.addChild(fg.id, form.id, (_a = fg.shortLabel) !== null && _a !== void 0 ? _a : ''));
+                }}"
+							.translationProvider="${tp}"
+							.language="${props.language}"
+					  ></form-selection-button>`}
+			</div>
+			${yield (children === null || children === void 0 ? void 0 : children.reduce((templatesPromise, child) => __awaiter(this, void 0, void 0, function* () {
+                var _a, _b, _c;
+                const templates = yield templatesPromise;
+                const childForm = Object.values(fg.forms).find((f) => f.id === child.getFormId());
+                const title = (_a = childForm === null || childForm === void 0 ? void 0 : childForm.form) !== null && _a !== void 0 ? _a : childForm === null || childForm === void 0 ? void 0 : childForm.description;
+                const localisedTitle = (_b = (title && tp && props.language ? tp === null || tp === void 0 ? void 0 : tp(props.language, title) : title)) !== null && _b !== void 0 ? _b : '';
+                const localisedRemove = (_c = (fg.labels.remove && tp && props.language ? tp === null || tp === void 0 ? void 0 : tp(props.language, fg.labels.remove) : fg.labels.remove)) !== null && _c !== void 0 ? _c : 'Remove';
+                if (childForm) {
+                    templates.push(html `
+						<div class="subform__child">
+							<h3 class="subform__child__title">${localisedTitle}</h3>
+							${yield render(childForm, props, child, translationProvider, ownersProvider, optionsProvider, actionListener, languages, readonly, displayMetadata)}
+							${readonly ? nothing : html ` <button class="subform__removeBtn" @click="${() => { var _a; return (_a = formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.removeChild) === null || _a === void 0 ? void 0 : _a.call(formsValueContainer, child); }}">${localisedRemove}</button>`}
+						</div>
+					`);
                 }
-                done = done && isStale;
-                return value;
+                return templates;
+            }), Promise.resolve([])))}
+		</div>`;
+        });
+    }
+    function renderTextField(fgSpan, fgRowSpan, fg) {
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a, _b, _c, _d, _e, _f, _g, _h;
+            return html `<icure-form-text-field
+			class="icure-form-field"
+			style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan, (_a = fg.styleOptions) === null || _a === void 0 ? void 0 : _a.width)}"
+			label="${fg.field}"
+			value="${fg.value}"
+			.displayedLabels="${getLabels(fg)}"
+			.displayMetadata="${displayMetadata}"
+			.multiline="${fg.multiline || false}"
+			.lines=${fgRowSpan}
+			.defaultLanguage="${props.language}"
+			.languages="${languages}"
+			.linksProvider=${(_b = fg.options) === null || _b === void 0 ? void 0 : _b.linksProvider}
+			.suggestionProvider=${(_c = fg.options) === null || _c === void 0 ? void 0 : _c.suggestionProvider}
+			.ownersProvider=${ownersProvider}
+			.translationProvider=${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}
+			.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
+			.codeColorProvider=${(_d = fg.options) === null || _d === void 0 ? void 0 : _d.codeColorProvider}
+			.linkColorProvider=${(_e = fg.options) === null || _e === void 0 ? void 0 : _e.linkColorProvider}
+			.codeContentProvider=${(_f = fg.options) === null || _f === void 0 ? void 0 : _f.codeContentProvider}
+			.defaultValueProvider=${() => formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.getDefaultValue(fg.field)}
+			.valueProvider="${formsValueContainer && fieldValuesProvider(formsValueContainer, fg)}"
+			.metadataProvider=${formsValueContainer && formsValueContainer.getMetadata.bind(formsValueContainer)}
+			.handleValueChanged=${handleValueChangedProvider(formsValueContainer, fg, props.defaultOwner)}
+			.handleMetadataChanged=${handleMetadataChangedProvider(formsValueContainer)}
+			.styleOptions="${fg.styleOptions}"
+			.readonly="${readonly || fg.readonly || (((_g = fg.computedProperties) === null || _g === void 0 ? void 0 : _g.readonly) ? !(yield (formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.compute((_h = fg.computedProperties) === null || _h === void 0 ? void 0 : _h.readonly))) : false)}"
+		></icure-form-text-field>`;
+        });
+    }
+    function renderTokenField(fgSpan, fgRowSpan, fg) {
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a, _b, _c, _d;
+            return html `<icure-form-token-field
+			class="icure-form-field"
+			style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan, (_a = fg.styleOptions) === null || _a === void 0 ? void 0 : _a.width)}"
+			label="${fg.field}"
+			value="${fg.value}"
+			.displayedLabels="${getLabels(fg)}"
+			.displayMetadata="${displayMetadata}"
+			.multiline="${fg.multiline || false}"
+			.lines=${fgRowSpan}
+			.defaultLanguage="${props.language}"
+			.suggestionProvider=${(_b = fg.options) === null || _b === void 0 ? void 0 : _b.suggestionProvider}
+			.ownersProvider=${ownersProvider}
+			.translationProvider=${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}
+			.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
+			.valueProvider="${formsValueContainer && fieldValuesProvider(formsValueContainer, fg)}"
+			.metadataProvider=${formsValueContainer && formsValueContainer.getMetadata.bind(formsValueContainer)}
+			.handleValueChanged=${handleValueChangedProvider(formsValueContainer, fg, props.defaultOwner)}
+			.handleMetadataChanged=${handleMetadataChangedProvider(formsValueContainer)}
+			.styleOptions="${fg.styleOptions}"
+			.readonly="${readonly || fg.readonly || (((_c = fg.computedProperties) === null || _c === void 0 ? void 0 : _c.readonly) ? !(yield (formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.compute((_d = fg.computedProperties) === null || _d === void 0 ? void 0 : _d.readonly))) : false)}"
+		></icure-form-token-field>`;
+        });
+    }
+    function renderItemsListField(fgSpan, fgRowSpan, fg) {
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a, _b, _c, _d;
+            return html `<icure-form-items-list-field
+			class="icure-form-field"
+			style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan, (_a = fg.styleOptions) === null || _a === void 0 ? void 0 : _a.width)}"
+			label="${fg.field}"
+			value="${fg.value}"
+			.displayedLabels="${getLabels(fg)}"
+			.displayMetadata="${displayMetadata}"
+			.multiline="${fg.multiline || false}"
+			.lines=${fgRowSpan}
+			.defaultLanguage="${props.language}"
+			.suggestionProvider=${(_b = fg.options) === null || _b === void 0 ? void 0 : _b.suggestionProvider}
+			.ownersProvider=${ownersProvider}
+			.translationProvider=${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}
+			.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
+			.valueProvider="${formsValueContainer && fieldValuesProvider(formsValueContainer, fg)}"
+			.metadataProvider=${formsValueContainer && formsValueContainer.getMetadata.bind(formsValueContainer)}
+			.handleValueChanged=${handleValueChangedProvider(formsValueContainer, fg, props.defaultOwner)}
+			.handleMetadataChanged=${handleMetadataChangedProvider(formsValueContainer)}
+			.styleOptions="${fg.styleOptions}"
+			.readonly="${readonly || fg.readonly || (((_c = fg.computedProperties) === null || _c === void 0 ? void 0 : _c.readonly) ? !(yield (formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.compute((_d = fg.computedProperties) === null || _d === void 0 ? void 0 : _d.readonly))) : false)}"
+		></icure-form-items-list-field>`;
+        });
+    }
+    function renderMeasureField(fgSpan, fgRowSpan, fg) {
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a, _b;
+            return html `<icure-form-measure-field
+			style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan)}"
+			class="icure-form-field"
+			label="${fg.field}"
+			.displayedLabels="${getLabels(fg)}"
+			.displayMetadata="${displayMetadata}"
+			value="${fg.value}"
+			unit="${fg.unit}"
+			.defaultLanguage="${props.language}"
+			.translationProvider=${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}
+			.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
+			.valueProvider="${formsValueContainer && fieldValuesProvider(formsValueContainer, fg)}"
+			.metadataProvider=${formsValueContainer && formsValueContainer.getMetadata.bind(formsValueContainer)}
+			.handleValueChanged=${handleValueChangedProvider(formsValueContainer, fg, props.defaultOwner)}
+			.handleMetadataChanged=${handleMetadataChangedProvider(formsValueContainer)}
+			.styleOptions="${fg.styleOptions}"
+			.readonly="${readonly || fg.readonly || (((_a = fg.computedProperties) === null || _a === void 0 ? void 0 : _a.readonly) ? !(yield (formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.compute((_b = fg.computedProperties) === null || _b === void 0 ? void 0 : _b.readonly))) : false)}"
+		></icure-form-measure-field>`;
+        });
+    }
+    function renderNumberField(fgSpan, fgRowSpan, fg) {
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a, _b;
+            return html `<icure-form-number-field
+			style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan)}"
+			class="icure-form-field"
+			label="${fg.field}"
+			.displayedLabels="${getLabels(fg)}"
+			.displayMetadata="${displayMetadata}"
+			value="${fg.value}"
+			.defaultLanguage="${props.language}"
+			.translationProvider=${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}
+			.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
+			.valueProvider="${formsValueContainer && fieldValuesProvider(formsValueContainer, fg)}"
+			.metadataProvider=${formsValueContainer && formsValueContainer.getMetadata.bind(formsValueContainer)}
+			.handleValueChanged=${handleValueChangedProvider(formsValueContainer, fg, props.defaultOwner)}
+			.handleMetadataChanged=${handleMetadataChangedProvider(formsValueContainer)}
+			.styleOptions="${fg.styleOptions}"
+			.readonly="${readonly || fg.readonly || (((_a = fg.computedProperties) === null || _a === void 0 ? void 0 : _a.readonly) ? !(yield (formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.compute((_b = fg.computedProperties) === null || _b === void 0 ? void 0 : _b.readonly))) : false)}"
+		></icure-form-number-field>`;
+        });
+    }
+    function renderDatePicker(fgSpan, fgRowSpan, fg) {
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a, _b;
+            return html `<icure-form-date-picker
+			style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan)}"
+			class="icure-form-field"
+			label="${fg.field}"
+			.displayedLabels="${getLabels(fg)}"
+			.displayMetadata="${displayMetadata}"
+			value="${fg.now ? currentDate() : fg.value}"
+			.defaultLanguage="${props.language}"
+			.translationProvider=${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}
+			.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
+			.valueProvider="${formsValueContainer && fieldValuesProvider(formsValueContainer, fg)}"
+			.metadataProvider=${formsValueContainer && formsValueContainer.getMetadata.bind(formsValueContainer)}
+			.handleValueChanged=${handleValueChangedProvider(formsValueContainer, fg, props.defaultOwner)}
+			.handleMetadataChanged=${handleMetadataChangedProvider(formsValueContainer)}
+			.styleOptions="${fg.styleOptions}"
+			.readonly="${readonly || fg.readonly || (((_a = fg.computedProperties) === null || _a === void 0 ? void 0 : _a.readonly) ? !(yield (formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.compute((_b = fg.computedProperties) === null || _b === void 0 ? void 0 : _b.readonly))) : false)}"
+		></icure-form-date-picker>`;
+        });
+    }
+    function renderTimePicker(fgSpan, fgRowSpan, fg) {
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a, _b;
+            return html `<icure-form-time-picker
+			style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan)}"
+			class="icure-form-field"
+			label="${fg.field}"
+			.displayedLabels="${getLabels(fg)}"
+			.displayMetadata="${displayMetadata}"
+			value="${fg.now ? currentTime() : fg.value}"
+			.defaultLanguage="${props.language}"
+			.translationProvider=${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}
+			.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
+			.valueProvider="${formsValueContainer && fieldValuesProvider(formsValueContainer, fg)}"
+			.metadataProvider=${formsValueContainer && formsValueContainer.getMetadata.bind(formsValueContainer)}
+			.handleValueChanged=${handleValueChangedProvider(formsValueContainer, fg, props.defaultOwner)}
+			.handleMetadataChanged=${handleMetadataChangedProvider(formsValueContainer)}
+			.styleOptions="${fg.styleOptions}"
+			.readonly="${readonly || fg.readonly || (((_a = fg.computedProperties) === null || _a === void 0 ? void 0 : _a.readonly) ? !(yield (formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.compute((_b = fg.computedProperties) === null || _b === void 0 ? void 0 : _b.readonly))) : false)}"
+		></icure-form-time-picker>`;
+        });
+    }
+    function renderDateTimePicker(fgSpan, fgRowSpan, fg) {
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a, _b;
+            return html `<icure-form-date-time-picker
+			style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan)}"
+			class="icure-form-field"
+			label="${fg.field}"
+			.displayedLabels="${getLabels(fg)}"
+			.displayMetadata="${displayMetadata}"
+			value="${fg.now ? currentDateTime() : fg.value}"
+			.defaultLanguage="${props.language}"
+			.translationProvider=${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}
+			.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
+			.valueProvider="${formsValueContainer && fieldValuesProvider(formsValueContainer, fg)}"
+			.metadataProvider=${formsValueContainer && formsValueContainer.getMetadata.bind(formsValueContainer)}
+			.handleValueChanged=${handleValueChangedProvider(formsValueContainer, fg, props.defaultOwner)}
+			.handleMetadataChanged=${handleMetadataChangedProvider(formsValueContainer)}
+			.styleOptions="${fg.styleOptions}"
+			.readonly="${readonly || fg.readonly || (((_a = fg.computedProperties) === null || _a === void 0 ? void 0 : _a.readonly) ? !(yield (formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.compute((_b = fg.computedProperties) === null || _b === void 0 ? void 0 : _b.readonly))) : false)}"
+		></icure-form-date-time-picker>`;
+        });
+    }
+    function renderDropdownField(fgSpan, fgRowSpan, fg) {
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a, _b, _c;
+            return html `<icure-form-dropdown-field
+			style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan)}"
+			class="icure-form-field"
+			.label=${fg.field}
+			.displayedLabels=${getLabels(fg)}
+			.defaultLanguage="${props.language}"
+			.translate="${fg.translate}"
+			.sortOptions="${fg.sortOptions}"
+			value="${fg.value}"
+			.codifications="${fg.codifications}"
+			.optionsProvider="${composedOptionsProvider && ((_a = fg.codifications) === null || _a === void 0 ? void 0 : _a.length)
+                ? (language, terms) => { var _a; return composedOptionsProvider(language, (_a = fg.codifications) !== null && _a !== void 0 ? _a : [], terms, fg.sortOptions); }
+                : (language, terms) => filterAndSortOptionsFromFieldDefinition(language, fg, translationProvider, terms)}"
+			.ownersProvider=${ownersProvider}
+			.translationProvider=${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}
+			.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
+			.valueProvider="${formsValueContainer && fieldValuesProvider(formsValueContainer, fg)}"
+			.metadataProvider=${formsValueContainer && formsValueContainer.getMetadata.bind(formsValueContainer)}
+			.handleValueChanged=${handleValueChangedProvider(formsValueContainer, fg, props.defaultOwner)}
+			.handleMetadataChanged=${handleMetadataChangedProvider(formsValueContainer)}
+			.styleOptions="${fg.styleOptions}"
+			.readonly="${readonly || fg.readonly || (((_b = fg.computedProperties) === null || _b === void 0 ? void 0 : _b.readonly) ? !(yield (formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.compute((_c = fg.computedProperties) === null || _c === void 0 ? void 0 : _c.readonly))) : false)}"
+		></icure-form-dropdown-field>`;
+        });
+    }
+    function renderRadioButtons(fgSpan, fgRowSpan, fg) {
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a, _b, _c;
+            return html `<icure-form-radio-button
+			style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan)}"
+			class="icure-form-field"
+			.label="${fg.field}"
+			.displayedLabels="${getLabels(fg)}"
+			.displayMetadata="${displayMetadata}"
+			.defaultLanguage="${props.language}"
+			.translate="${fg.translate}"
+			.sortOptions="${fg.sortOptions}"
+			.codifications="${fg.codifications}"
+			.optionsProvider="${composedOptionsProvider && ((_a = fg.codifications) === null || _a === void 0 ? void 0 : _a.length)
+                ? (language, terms) => { var _a; return composedOptionsProvider(language, (_a = fg.codifications) !== null && _a !== void 0 ? _a : [], terms, fg.sortOptions); }
+                : (language, terms) => filterAndSortOptionsFromFieldDefinition(language, fg, translationProvider, terms)}"
+			.ownersProvider=${ownersProvider}
+			.translationProvider=${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}
+			.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
+			.valueProvider="${formsValueContainer && fieldValuesProvider(formsValueContainer, fg)}"
+			.metadataProvider=${formsValueContainer && formsValueContainer.getMetadata.bind(formsValueContainer)}
+			.handleValueChanged=${handleValueChangedProvider(formsValueContainer, fg, props.defaultOwner)}
+			.handleMetadataChanged=${handleMetadataChangedProvider(formsValueContainer)}
+			.styleOptions="${fg.styleOptions}"
+			.readonly="${readonly || fg.readonly || (((_b = fg.computedProperties) === null || _b === void 0 ? void 0 : _b.readonly) ? !(yield (formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.compute((_c = fg.computedProperties) === null || _c === void 0 ? void 0 : _c.readonly))) : false)}"
+		></icure-form-radio-button>`;
+        });
+    }
+    function renderCheckboxes(fgSpan, fgRowSpan, fg) {
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a, _b, _c;
+            return html ` <icure-form-checkbox
+			style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan)}"
+			class="icure-form-field"
+			.label="${fg.field}"
+			.displayedLabels="${getLabels(fg)}"
+			.displayMetadata="${displayMetadata}"
+			.defaultLanguage="${props.language}"
+			.translate="${fg.translate}"
+			.sortOptions="${fg.sortOptions}"
+			value="${fg.value}"
+			.codifications="${fg.codifications}"
+			.optionsProvider="${composedOptionsProvider && ((_a = fg.codifications) === null || _a === void 0 ? void 0 : _a.length)
+                ? (language, terms) => { var _a; return composedOptionsProvider(language, (_a = fg.codifications) !== null && _a !== void 0 ? _a : [], terms, fg.sortOptions); }
+                : (language, terms) => filterAndSortOptionsFromFieldDefinition(language, fg, translationProvider, terms)}"
+			.ownersProvider="${ownersProvider}"
+			.translationProvider="${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}"
+			.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
+			.valueProvider="${formsValueContainer && fieldValuesProvider(formsValueContainer, fg)}"
+			.metadataProvider="${formsValueContainer && formsValueContainer.getMetadata.bind(formsValueContainer)}"
+			.handleValueChanged="${handleValueChangedProvider(formsValueContainer, fg, props.defaultOwner)}"
+			.handleMetadataChanged="${handleMetadataChangedProvider(formsValueContainer)}"
+			.styleOptions="${fg.styleOptions}"
+			.readonly="${readonly || fg.readonly || (((_b = fg.computedProperties) === null || _b === void 0 ? void 0 : _b.readonly) ? !(yield (formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.compute((_c = fg.computedProperties) === null || _c === void 0 ? void 0 : _c.readonly))) : false)}"
+		></icure-form-checkbox>`;
+        });
+    }
+    function renderButton(fgSpan, fgRowSpan, fg) {
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a, _b, _c, _d, _e;
+            return html `<icure-form-button
+			style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan)}"
+			class="icure-form-button"
+			label="${(_a = fg.shortLabel) !== null && _a !== void 0 ? _a : fg.field}"
+			.defaultLanguage="${props.language}"
+			.translationProvider="${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}"
+			.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
+			.actionListener="${actionListener}"
+			.event="${fg.event !== undefined ? fg.event : ((_b = fg.computedProperties) === null || _b === void 0 ? void 0 : _b.event) ? !(yield (formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.compute((_c = fg.computedProperties) === null || _c === void 0 ? void 0 : _c.event))) : 'submit'}"
+			.payload="${fg.payload !== undefined ? fg.payload : ((_d = fg.computedProperties) === null || _d === void 0 ? void 0 : _d.payload) ? !(yield (formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.compute((_e = fg.computedProperties) === null || _e === void 0 ? void 0 : _e.payload))) : undefined}"
+			.styleOptions="${fg.styleOptions}"
+		></icure-form-button>`;
+        });
+    }
+    function renderLabel(fgSpan, fgRowSpan, fg) {
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a, _b, _c;
+            return html `<icure-form-label
+			style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan)}"
+			class="icure-form-field"
+			.defaultLanguage="${props.language}"
+			labelPosition=${props.labelPosition}
+			label="${(_a = fg.shortLabel) !== null && _a !== void 0 ? _a : fg.field}"
+			.translationProvider="${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}"
+			.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
+			.styleOptions="${fg.styleOptions}"
+			.readonly="${readonly || fg.readonly || (((_b = fg.computedProperties) === null || _b === void 0 ? void 0 : _b.readonly) ? !(yield (formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.compute((_c = fg.computedProperties) === null || _c === void 0 ? void 0 : _c.readonly))) : false)}"
+		></icure-form-label>`;
+        });
+    }
+    const renderFieldGroupOrSubform = function (fg, level) {
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a, _b, _c, _d, _e, _f;
+            if (!fg) {
+                return nothing;
             }
-            else {
+            const computedProperties = (yield Object.keys((_a = fg.computedProperties) !== null && _a !== void 0 ? _a : {})
+                .filter((k) => k !== 'value' && k !== 'defaultValue')
+                .reduce((acc, k) => __awaiter(this, void 0, void 0, function* () { var _a; return (Object.assign(Object.assign({}, (yield acc)), { [k]: ((_a = fg.computedProperties) === null || _a === void 0 ? void 0 : _a[k]) && (yield (formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.compute(fg.computedProperties[k]))) })); }), Promise.resolve({})));
+            if (computedProperties['hidden']) {
                 return nothing;
             }
+            const fgSpan = ((_c = (_b = computedProperties['span']) !== null && _b !== void 0 ? _b : fg.span) !== null && _c !== void 0 ? _c : 6);
+            const fgRowSpan = ((_e = (_d = computedProperties['rowSpan']) !== null && _d !== void 0 ? _d : fg.rowSpan) !== null && _e !== void 0 ? _e : 1);
+            if (fg.clazz === 'group' && ((_f = fg.fields) === null || _f === void 0 ? void 0 : _f.length)) {
+                return yield renderGroup(fg.copy(Object.assign({}, computedProperties)), fgSpan, level);
+            }
+            else if (fg.clazz === 'subform' && (fg.id || computedProperties['title'])) {
+                return yield renderSubform(fg.copy(Object.assign({}, computedProperties)), fgSpan, level);
+            }
+            else if (fg.clazz === 'field') {
+                const field = fg.copy(Object.assign({}, computedProperties));
+                return html `${fg.type === 'text-field'
+                    ? yield renderTextField(fgSpan, fgRowSpan, field)
+                    : fg.type === 'measure-field'
+                        ? yield renderMeasureField(fgSpan, fgRowSpan, field)
+                        : fg.type === 'token-field'
+                            ? yield renderTokenField(fgSpan, fgRowSpan, field)
+                            : fg.type === 'items-list-field'
+                                ? yield renderItemsListField(fgSpan, fgRowSpan, field)
+                                : fg.type === 'number-field'
+                                    ? yield renderNumberField(fgSpan, fgRowSpan, field)
+                                    : fg.type === 'date-picker'
+                                        ? yield renderDatePicker(fgSpan, fgRowSpan, field)
+                                        : fg.type === 'time-picker'
+                                            ? yield renderTimePicker(fgSpan, fgRowSpan, field)
+                                            : fg.type === 'date-time-picker'
+                                                ? yield renderDateTimePicker(fgSpan, fgRowSpan, field)
+                                                : fg.type === 'dropdown-field'
+                                                    ? yield renderDropdownField(fgSpan, fgRowSpan, field)
+                                                    : fg.type === 'radio-button'
+                                                        ? yield renderRadioButtons(fgSpan, fgRowSpan, field)
+                                                        : fg.type === 'checkbox'
+                                                            ? yield renderCheckboxes(fgSpan, fgRowSpan, field)
+                                                            : fg.type === 'label'
+                                                                ? yield renderLabel(fgSpan, fgRowSpan, field)
+                                                                : fg.type === 'action'
+                                                                    ? yield renderButton(fgSpan, fgRowSpan, field)
+                                                                    : ''}`;
+            }
+            return html ``;
+        });
+    };
+    const calculateFieldOrGroupSize = (span, rowSpan, fixedWidth) => {
+        if (fixedWidth)
+            return `width: ${fixedWidth}px`;
+        return `grid-column: span ${span}; ${rowSpan > 1 ? `grid-row: span ${rowSpan}` : ''}`;
+    };
+    const renderForm = (form, sectionWrapper) => __awaiter(void 0, void 0, void 0, function* () {
+        return yield Promise.all(form.sections.map((s, idx) => __awaiter(void 0, void 0, void 0, function* () {
+            const section = yield Promise.all(s.fields.map((fieldOrGroup) => renderFieldGroupOrSubform(fieldOrGroup, 3)));
+            return sectionWrapper(idx, () => html ` <div class="icure-form">${section}</div>`);
         })));
-        return { done, subElements };
-    });
-}
-export function render(form_1, props_1, formsValueContainer_1, translationProvider_1) {
-    return __asyncGenerator(this, arguments, function* render_1(form, props, formsValueContainer, translationProvider, ownersProvider = () => __awaiter(this, void 0, void 0, function* () { return []; }), optionsProvider, actionListener = () => undefined, languages, readonly, displayMetadata, sectionWrapper) {
-        function renderPotentiallyReadonlyField(fg, getHtml) {
-            return __asyncGenerator(this, arguments, function* renderPotentiallyReadonlyField_1() {
-                var _a, _b;
-                if (formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.isFieldBeingComputed(fg.label())) {
-                    yield yield __await([getHtml(true), true]);
-                }
-                else if ((_a = fg.computedProperties) === null || _a === void 0 ? void 0 : _a.readonly) {
-                    const readonlyPromise = formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.compute(fg.computedProperties.readonly);
-                    yield yield __await([getHtml(true), false]);
-                    const finalResult = getHtml(!!readonlyPromise ? yield __await(readonlyPromise) : false);
-                    while (true) {
-                        yield yield __await([finalResult, true]);
-                    }
-                }
-                else {
-                    const finalResult = getHtml((_b = readonly !== null && readonly !== void 0 ? readonly : fg.readonly) !== null && _b !== void 0 ? _b : false);
-                    while (true) {
-                        yield yield __await([finalResult, true]);
-                    }
-                }
-            });
-        }
-        const composedOptionsProvider = optionsProvider && form.codifications
-            ? (language, codifications, terms, sortOptions) => __awaiter(this, void 0, void 0, function* () {
-                var _a, _b, _c;
-                const originalOptions = optionsProvider ? yield optionsProvider(language, codifications, terms) : [];
-                return sortSuggestions(originalOptions.concat((_c = (_b = (_a = form.codifications) === null || _a === void 0 ? void 0 : _a.filter((c) => codifications.includes(c.type))) === null || _b === void 0 ? void 0 : _b.flatMap((c) => c.codes
-                    .filter((c) => (terms !== null && terms !== void 0 ? terms : []).map((st) => st.toLowerCase()).every((st) => c.label[language].toLowerCase().includes(st)))
-                    .map((c) => ({ id: c.id, label: c.label, text: c.label[language], terms: terms !== null && terms !== void 0 ? terms : [] })))) !== null && _c !== void 0 ? _c : []), language, sortOptions);
-            })
-            : optionsProvider
-                ? (language, codifications, terms, sortOptions) => {
-                    var _a;
-                    return (_a = optionsProvider === null || optionsProvider === void 0 ? void 0 : optionsProvider(language, codifications, terms).then((codes) => sortSuggestions(codes, language, sortOptions))) !== null && _a !== void 0 ? _a : Promise.resolve([]);
-                }
-                : undefined;
-        const h = function (level, className = '', content) {
-            return level === 1
-                ? html `<h1 class="${className}">${content}</h1>`
-                : level === 2
-                    ? html `<h2 class="${className}">${content}</h2>`
-                    : level === 3
-                        ? html `<h3 class="${className}">${content}</h3>`
-                        : level === 4
-                            ? html `<h4 class="${className}">${content}</h4>`
-                            : level === 5
-                                ? html `<h5 class="${className}">${content}</h5>`
-                                : html `<h6 class="${className}">${content}</h6>`;
-        };
-        function renderGroup(fg, fgSpan, level) {
-            return __asyncGenerator(this, arguments, function* renderGroup_1() {
-                var _a, _b;
-                const subGenerators = (_b = (_a = fg.fields) === null || _a === void 0 ? void 0 : _a.map((fieldOrGroup) => renderFieldGroupOrSubform(fieldOrGroup, level + 1))) !== null && _b !== void 0 ? _b : [];
-                const cache = [];
-                while (true) {
-                    const { done, subElements } = yield __await(allNext(subGenerators, cache));
-                    const filteredSubElements = subElements.filter((x) => !!x && x !== nothing);
-                    yield yield __await([
-                        filteredSubElements.length
-                            ? html ` <div class="${['group', fg.borderless ? undefined : 'bordered'].filter((x) => !!x).join(' ')}" style="${calculateFieldOrGroupSize(fgSpan, 1)}">
-							${fg.borderless ? nothing : html ` <div>${h(level, '', html `${fg.group}`)}</div>`}
-							<div class="icure-form">${filteredSubElements}</div>
-					  </div>`
-                            : nothing,
-                        done,
-                    ]);
-                }
-            });
-        }
-        function renderSubform(fg, fgSpan, level) {
-            return __asyncGenerator(this, arguments, function* renderSubform_1() {
-                var _a;
-                function getHtml(children) {
-                    return __awaiter(this, void 0, void 0, function* () {
-                        var _a, _b;
-                        return html `<div class="subform" style="${calculateFieldOrGroupSize(fgSpan, 1)}">
-				<div class="subform__heading">
-					${h(level, 'subform__heading__title', html `${(_a = (props.language && fg.shortLabel ? tp === null || tp === void 0 ? void 0 : tp(props.language, fg.shortLabel) : fg.shortLabel)) !== null && _a !== void 0 ? _a : ''}`)}
-					${readonly
-                            ? nothing
-                            : html `<form-selection-button
-								.label="${(_b = fg.labels.add) !== null && _b !== void 0 ? _b : 'Add subform'}"
-								.forms="${Object.entries(fg.forms)}"
-								.formAdded="${(form) => {
-                                var _a;
-                                form.id && (formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.addChild(fg.id, form.id, (_a = fg.shortLabel) !== null && _a !== void 0 ? _a : ''));
-                            }}"
-								.translationProvider="${tp}"
-								.language="${props.language}"
-						  ></form-selection-button>`}
-				</div>
-				${yield Promise.all(children === null || children === void 0 ? void 0 : children.map((_a) => __awaiter(this, [_a], void 0, function* ([child, childForm, renderedChildForm]) {
-                            var _b, _c, _d;
-                            const title = (_b = childForm === null || childForm === void 0 ? void 0 : childForm.form) !== null && _b !== void 0 ? _b : childForm === null || childForm === void 0 ? void 0 : childForm.description;
-                            const localisedTitle = (_c = (title && tp && props.language ? tp === null || tp === void 0 ? void 0 : tp(props.language, title) : title)) !== null && _c !== void 0 ? _c : '';
-                            const localisedRemove = (_d = (fg.labels.remove && tp && props.language ? tp === null || tp === void 0 ? void 0 : tp(props.language, fg.labels.remove) : fg.labels.remove)) !== null && _d !== void 0 ? _d : 'Remove';
-                            return html `
-							<div class="subform__child">
-								<h3 class="subform__child__title">${localisedTitle}</h3>
-								${renderedChildForm} ${readonly ? nothing : html ` <button class="subform__removeBtn" @click="${() => { var _a; return (_a = formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.removeChild) === null || _a === void 0 ? void 0 : _a.call(formsValueContainer, child); }}">${localisedRemove}</button>`}
-							</div>
-						`;
-                        })))}
-			</div>`;
-                    });
-                }
-                const children = (_a = (yield __await((formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.getChildren())))) === null || _a === void 0 ? void 0 : _a.filter((c) => c.getLabel() === fg.id);
-                const tp = translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations));
-                const subGenerators = (children !== null && children !== void 0 ? children : []).map((child) => {
-                    const childForm = Object.values(fg.forms).find((f) => f.id === child.getFormId());
-                    return childForm ? render(childForm, props, child, translationProvider, ownersProvider, optionsProvider, actionListener, languages, readonly, displayMetadata) : undefined;
-                });
-                const cache = [];
-                while (true) {
-                    const { done, subElements } = yield __await(allNext(subGenerators, cache));
-                    yield yield __await([yield __await(getHtml((children !== null && children !== void 0 ? children : []).map((child, idx) => [child, Object.values(fg.forms).find((f) => f.id === child.getFormId()), subElements[idx]]))), done]);
-                }
-            });
-        }
-        function renderTextField(fgSpan, fgRowSpan, fg) {
-            return __asyncGenerator(this, arguments, function* renderTextField_1() {
-                yield __await(yield* __asyncDelegator(__asyncValues(renderPotentiallyReadonlyField(fg, function (readonly) {
-                    var _a, _b, _c, _d, _e, _f;
-                    const loading = formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.isFieldBeingComputed(fg.label());
-                    return html `<icure-form-text-field
-				class="icure-form-field ${loading ? 'loading' : ''}"
-				style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan, (_a = fg.styleOptions) === null || _a === void 0 ? void 0 : _a.width)}"
-				label="${fg.field}"
-				value="${fg.value}"
-				.displayedLabels="${getLabels(fg)}"
-				.displayMetadata="${displayMetadata}"
-				.multiline="${fg.multiline || false}"
-				.lines=${fgRowSpan}
-				.defaultLanguage="${props.language}"
-				.languages="${languages}"
-				.linksProvider=${(_b = fg.options) === null || _b === void 0 ? void 0 : _b.linksProvider}
-				.suggestionProvider=${(_c = fg.options) === null || _c === void 0 ? void 0 : _c.suggestionProvider}
-				.ownersProvider=${ownersProvider}
-				.translationProvider=${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}
-				.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
-				.codeColorProvider=${(_d = fg.options) === null || _d === void 0 ? void 0 : _d.codeColorProvider}
-				.linkColorProvider=${(_e = fg.options) === null || _e === void 0 ? void 0 : _e.linkColorProvider}
-				.codeContentProvider=${(_f = fg.options) === null || _f === void 0 ? void 0 : _f.codeContentProvider}
-				.valueProvider="${formsValueContainer && fieldValuesProvider(formsValueContainer, fg)}"
-				.metadataProvider=${formsValueContainer && formsValueContainer.getMetadata.bind(formsValueContainer)}
-				.handleValueChanged=${handleValueChangedProvider(formsValueContainer, fg, props.defaultOwner)}
-				.handleMetadataChanged=${handleMetadataChangedProvider(formsValueContainer)}
-				.styleOptions="${fg.styleOptions}"
-				.readonly="${readonly}"
-				.loading="${loading}"
-			></icure-form-text-field>`;
-                }))));
-            });
-        }
-        function renderTokenField(fgSpan, fgRowSpan, fg) {
-            return __asyncGenerator(this, arguments, function* renderTokenField_1() {
-                yield __await(yield* __asyncDelegator(__asyncValues(renderPotentiallyReadonlyField(fg, function (readonly) {
-                    var _a, _b;
-                    return html `<icure-form-token-field
-				class="icure-form-field"
-				style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan, (_a = fg.styleOptions) === null || _a === void 0 ? void 0 : _a.width)}"
-				label="${fg.field}"
-				value="${fg.value}"
-				.displayedLabels="${getLabels(fg)}"
-				.displayMetadata="${displayMetadata}"
-				.multiline="${fg.multiline || false}"
-				.lines=${fgRowSpan}
-				.defaultLanguage="${props.language}"
-				.suggestionProvider=${(_b = fg.options) === null || _b === void 0 ? void 0 : _b.suggestionProvider}
-				.ownersProvider=${ownersProvider}
-				.translationProvider=${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}
-				.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
-				.valueProvider="${formsValueContainer && fieldValuesProvider(formsValueContainer, fg)}"
-				.metadataProvider=${formsValueContainer && formsValueContainer.getMetadata.bind(formsValueContainer)}
-				.handleValueChanged=${handleValueChangedProvider(formsValueContainer, fg, props.defaultOwner)}
-				.handleMetadataChanged=${handleMetadataChangedProvider(formsValueContainer)}
-				.styleOptions="${fg.styleOptions}"
-				.readonly="${readonly}"
-			></icure-form-token-field>`;
-                }))));
-            });
-        }
-        function renderItemsListField(fgSpan, fgRowSpan, fg) {
-            return __asyncGenerator(this, arguments, function* renderItemsListField_1() {
-                yield __await(yield* __asyncDelegator(__asyncValues(renderPotentiallyReadonlyField(fg, function (readonly) {
-                    var _a, _b;
-                    return html `<icure-form-items-list-field
-				class="icure-form-field"
-				style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan, (_a = fg.styleOptions) === null || _a === void 0 ? void 0 : _a.width)}"
-				label="${fg.field}"
-				value="${fg.value}"
-				.displayedLabels="${getLabels(fg)}"
-				.displayMetadata="${displayMetadata}"
-				.multiline="${fg.multiline || false}"
-				.lines=${fgRowSpan}
-				.defaultLanguage="${props.language}"
-				.suggestionProvider=${(_b = fg.options) === null || _b === void 0 ? void 0 : _b.suggestionProvider}
-				.ownersProvider=${ownersProvider}
-				.translationProvider=${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}
-				.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
-				.valueProvider="${formsValueContainer && fieldValuesProvider(formsValueContainer, fg)}"
-				.metadataProvider=${formsValueContainer && formsValueContainer.getMetadata.bind(formsValueContainer)}
-				.handleValueChanged=${handleValueChangedProvider(formsValueContainer, fg, props.defaultOwner)}
-				.handleMetadataChanged=${handleMetadataChangedProvider(formsValueContainer)}
-				.styleOptions="${fg.styleOptions}"
-				.readonly="${readonly}"
-			></icure-form-items-list-field>`;
-                }))));
-            });
-        }
-        function renderMeasureField(fgSpan, fgRowSpan, fg) {
-            return __asyncGenerator(this, arguments, function* renderMeasureField_1() {
-                yield __await(yield* __asyncDelegator(__asyncValues(renderPotentiallyReadonlyField(fg, function (readonly) {
-                    return html `<icure-form-measure-field
-				style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan)}"
-				class="icure-form-field"
-				label="${fg.field}"
-				.displayedLabels="${getLabels(fg)}"
-				.displayMetadata="${displayMetadata}"
-				value="${fg.value}"
-				unit="${fg.unit}"
-				.defaultLanguage="${props.language}"
-				.translationProvider=${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}
-				.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
-				.valueProvider="${formsValueContainer && fieldValuesProvider(formsValueContainer, fg)}"
-				.metadataProvider=${formsValueContainer && formsValueContainer.getMetadata.bind(formsValueContainer)}
-				.handleValueChanged=${handleValueChangedProvider(formsValueContainer, fg, props.defaultOwner)}
-				.handleMetadataChanged=${handleMetadataChangedProvider(formsValueContainer)}
-				.styleOptions="${fg.styleOptions}"
-				.readonly="${readonly}"
-			></icure-form-measure-field>`;
-                }))));
-            });
-        }
-        function renderNumberField(fgSpan, fgRowSpan, fg) {
-            return __asyncGenerator(this, arguments, function* renderNumberField_1() {
-                yield __await(yield* __asyncDelegator(__asyncValues(renderPotentiallyReadonlyField(fg, function (readonly) {
-                    const loading = formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.isFieldBeingComputed(fg.label());
-                    return html `<icure-form-number-field
-				style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan)}"
-				class="icure-form-field ${loading ? 'loading' : ''}"
-				label="${fg.field}"
-				.displayedLabels="${getLabels(fg)}"
-				.displayMetadata="${displayMetadata}"
-				value="${fg.value}"
-				.defaultLanguage="${props.language}"
-				.translationProvider=${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}
-				.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
-				.valueProvider="${formsValueContainer && fieldValuesProvider(formsValueContainer, fg)}"
-				.metadataProvider=${formsValueContainer && formsValueContainer.getMetadata.bind(formsValueContainer)}
-				.handleValueChanged=${handleValueChangedProvider(formsValueContainer, fg, props.defaultOwner)}
-				.handleMetadataChanged=${handleMetadataChangedProvider(formsValueContainer)}
-				.styleOptions="${fg.styleOptions}"
-				.readonly="${readonly}"
-				.loading="${loading}"
-			></icure-form-number-field>`;
-                }))));
-            });
-        }
-        function renderDatePicker(fgSpan, fgRowSpan, fg) {
-            return __asyncGenerator(this, arguments, function* renderDatePicker_1() {
-                yield __await(yield* __asyncDelegator(__asyncValues(renderPotentiallyReadonlyField(fg, function (readonly) {
-                    return html ` <icure-form-date-picker
-				style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan)}"
-				class="icure-form-field"
-				label="${fg.field}"
-				.displayedLabels="${getLabels(fg)}"
-				.displayMetadata="${displayMetadata}"
-				value="${fg.now ? currentDate() : fg.value}"
-				.defaultLanguage="${props.language}"
-				.translationProvider="${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}"
-				.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
-				.valueProvider="${formsValueContainer && fieldValuesProvider(formsValueContainer, fg)}"
-				.metadataProvider="${formsValueContainer && formsValueContainer.getMetadata.bind(formsValueContainer)}"
-				.handleValueChanged="${handleValueChangedProvider(formsValueContainer, fg, props.defaultOwner)}"
-				.handleMetadataChanged="${handleMetadataChangedProvider(formsValueContainer)}"
-				.styleOptions="${fg.styleOptions}"
-				.readonly="${readonly}"
-			></icure-form-date-picker>`;
-                }))));
-            });
-        }
-        function renderTimePicker(fgSpan, fgRowSpan, fg) {
-            return __asyncGenerator(this, arguments, function* renderTimePicker_1() {
-                yield __await(yield* __asyncDelegator(__asyncValues(renderPotentiallyReadonlyField(fg, function (readonly) {
-                    return html `<icure-form-time-picker
-				style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan)}"
-				class="icure-form-field"
-				label="${fg.field}"
-				.displayedLabels="${getLabels(fg)}"
-				.displayMetadata="${displayMetadata}"
-				value="${fg.now ? currentTime() : fg.value}"
-				.defaultLanguage="${props.language}"
-				.translationProvider=${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}
-				.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
-				.valueProvider="${formsValueContainer && fieldValuesProvider(formsValueContainer, fg)}"
-				.metadataProvider=${formsValueContainer && formsValueContainer.getMetadata.bind(formsValueContainer)}
-				.handleValueChanged=${handleValueChangedProvider(formsValueContainer, fg, props.defaultOwner)}
-				.handleMetadataChanged=${handleMetadataChangedProvider(formsValueContainer)}
-				.styleOptions="${fg.styleOptions}"
-				.readonly="${readonly}"
-			></icure-form-time-picker>`;
-                }))));
-            });
-        }
-        function renderDateTimePicker(fgSpan, fgRowSpan, fg) {
-            return __asyncGenerator(this, arguments, function* renderDateTimePicker_1() {
-                yield __await(yield* __asyncDelegator(__asyncValues(renderPotentiallyReadonlyField(fg, function (readonly) {
-                    return html `<icure-form-date-time-picker
-				style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan)}"
-				class="icure-form-field"
-				label="${fg.field}"
-				.displayedLabels="${getLabels(fg)}"
-				.displayMetadata="${displayMetadata}"
-				value="${fg.now ? currentDateTime() : fg.value}"
-				.defaultLanguage="${props.language}"
-				.translationProvider=${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}
-				.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
-				.valueProvider="${formsValueContainer && fieldValuesProvider(formsValueContainer, fg)}"
-				.metadataProvider=${formsValueContainer && formsValueContainer.getMetadata.bind(formsValueContainer)}
-				.handleValueChanged=${handleValueChangedProvider(formsValueContainer, fg, props.defaultOwner)}
-				.handleMetadataChanged=${handleMetadataChangedProvider(formsValueContainer)}
-				.styleOptions="${fg.styleOptions}"
-				.readonly="${readonly}"
-			></icure-form-date-time-picker>`;
-                }))));
-            });
-        }
-        function renderDropdownField(fgSpan, fgRowSpan, fg) {
-            return __asyncGenerator(this, arguments, function* renderDropdownField_1() {
-                yield __await(yield* __asyncDelegator(__asyncValues(renderPotentiallyReadonlyField(fg, function (readonly) {
-                    var _a;
-                    return html `<icure-form-dropdown-field
-				style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan)}"
-				class="icure-form-field"
-				.label=${fg.field}
-				.displayedLabels=${getLabels(fg)}
-				.defaultLanguage="${props.language}"
-				.translate="${fg.translate}"
-				.sortOptions="${fg.sortOptions}"
-				value="${fg.value}"
-				.codifications="${fg.codifications}"
-				.optionsProvider="${composedOptionsProvider && ((_a = fg.codifications) === null || _a === void 0 ? void 0 : _a.length)
-                        ? (language, terms) => { var _a; return composedOptionsProvider(language, (_a = fg.codifications) !== null && _a !== void 0 ? _a : [], terms, fg.sortOptions); }
-                        : (language, terms) => filterAndSortOptionsFromFieldDefinition(language, fg, translationProvider, terms)}"
-				.ownersProvider=${ownersProvider}
-				.translationProvider=${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}
-				.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
-				.valueProvider="${formsValueContainer && fieldValuesProvider(formsValueContainer, fg)}"
-				.metadataProvider=${formsValueContainer && formsValueContainer.getMetadata.bind(formsValueContainer)}
-				.handleValueChanged=${handleValueChangedProvider(formsValueContainer, fg, props.defaultOwner)}
-				.handleMetadataChanged=${handleMetadataChangedProvider(formsValueContainer)}
-				.styleOptions="${fg.styleOptions}"
-				.readonly="${readonly}"
-			></icure-form-dropdown-field>`;
-                }))));
-            });
-        }
-        function renderRadioButtons(fgSpan, fgRowSpan, fg) {
-            return __asyncGenerator(this, arguments, function* renderRadioButtons_1() {
-                yield __await(yield* __asyncDelegator(__asyncValues(renderPotentiallyReadonlyField(fg, function (readonly) {
-                    var _a;
-                    return html `<icure-form-radio-button
-				style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan)}"
-				class="icure-form-field"
-				.label="${fg.field}"
-				.displayedLabels="${getLabels(fg)}"
-				.displayMetadata="${displayMetadata}"
-				.defaultLanguage="${props.language}"
-				.translate="${fg.translate}"
-				.sortOptions="${fg.sortOptions}"
-				.codifications="${fg.codifications}"
-				.optionsProvider="${composedOptionsProvider && ((_a = fg.codifications) === null || _a === void 0 ? void 0 : _a.length)
-                        ? (language, terms) => { var _a; return composedOptionsProvider(language, (_a = fg.codifications) !== null && _a !== void 0 ? _a : [], terms, fg.sortOptions); }
-                        : (language, terms) => filterAndSortOptionsFromFieldDefinition(language, fg, translationProvider, terms)}"
-				.ownersProvider=${ownersProvider}
-				.translationProvider=${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}
-				.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
-				.valueProvider="${formsValueContainer && fieldValuesProvider(formsValueContainer, fg)}"
-				.metadataProvider=${formsValueContainer && formsValueContainer.getMetadata.bind(formsValueContainer)}
-				.handleValueChanged=${handleValueChangedProvider(formsValueContainer, fg, props.defaultOwner)}
-				.handleMetadataChanged=${handleMetadataChangedProvider(formsValueContainer)}
-				.styleOptions="${fg.styleOptions}"
-				.readonly="${readonly}"
-			></icure-form-radio-button>`;
-                }))));
-            });
-        }
-        function renderCheckboxes(fgSpan, fgRowSpan, fg) {
-            return __asyncGenerator(this, arguments, function* renderCheckboxes_1() {
-                yield __await(yield* __asyncDelegator(__asyncValues(renderPotentiallyReadonlyField(fg, function (readonly) {
-                    var _a;
-                    return html ` <icure-form-checkbox
-				style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan)}"
-				class="icure-form-field"
-				.label="${fg.field}"
-				.displayedLabels="${getLabels(fg)}"
-				.displayMetadata="${displayMetadata}"
-				.defaultLanguage="${props.language}"
-				.translate="${fg.translate}"
-				.sortOptions="${fg.sortOptions}"
-				value="${fg.value}"
-				.codifications="${fg.codifications}"
-				.optionsProvider="${composedOptionsProvider && ((_a = fg.codifications) === null || _a === void 0 ? void 0 : _a.length)
-                        ? (language, terms) => { var _a; return composedOptionsProvider(language, (_a = fg.codifications) !== null && _a !== void 0 ? _a : [], terms, fg.sortOptions); }
-                        : (language, terms) => filterAndSortOptionsFromFieldDefinition(language, fg, translationProvider, terms)}"
-				.ownersProvider="${ownersProvider}"
-				.translationProvider="${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}"
-				.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
-				.valueProvider="${formsValueContainer && fieldValuesProvider(formsValueContainer, fg)}"
-				.metadataProvider="${formsValueContainer && formsValueContainer.getMetadata.bind(formsValueContainer)}"
-				.handleValueChanged="${handleValueChangedProvider(formsValueContainer, fg, props.defaultOwner)}"
-				.handleMetadataChanged="${handleMetadataChangedProvider(formsValueContainer)}"
-				.styleOptions="${fg.styleOptions}"
-				.readonly="${readonly}"
-			></icure-form-checkbox>`;
-                }))));
-            });
-        }
-        function renderButton(fgSpan, fgRowSpan, fg) {
-            return __asyncGenerator(this, arguments, function* renderButton_1() {
-                var _a, _b, _c, _d, _e, _f, _g, _h;
-                function getHtml(payload, event) {
-                    var _a;
-                    return html `<icure-form-button
-				style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan)}"
-				class="icure-form-button"
-				label="${(_a = fg.shortLabel) !== null && _a !== void 0 ? _a : fg.field}"
-				.defaultLanguage="${props.language}"
-				.translationProvider="${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}"
-				.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
-				.actionListener="${actionListener}"
-				.event="${event}"
-				.payload="${payload}"
-				.styleOptions="${fg.styleOptions}"
-			></icure-form-button>`;
-                }
-                if (((_a = fg.computedProperties) === null || _a === void 0 ? void 0 : _a.readonly) || ((_b = fg.computedProperties) === null || _b === void 0 ? void 0 : _b.event)) {
-                    yield yield __await([getHtml(true, (_c = fg.event) !== null && _c !== void 0 ? _c : 'submit'), false]);
-                    const [payload, event] = (yield __await(Promise.all([
-                        fg.payload !== undefined ? fg.payload : ((_d = fg.computedProperties) === null || _d === void 0 ? void 0 : _d.payload) ? !(yield __await((formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.compute((_e = fg.computedProperties) === null || _e === void 0 ? void 0 : _e.payload)))) : undefined,
-                        fg.event !== undefined ? fg.event : ((_f = fg.computedProperties) === null || _f === void 0 ? void 0 : _f.event) ? !(yield __await((formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.compute((_g = fg.computedProperties) === null || _g === void 0 ? void 0 : _g.event)))) : 'submit',
-                    ])));
-                    yield yield __await([getHtml(payload, event), true]);
-                }
-                else {
-                    yield yield __await([getHtml(true, (_h = fg.event) !== null && _h !== void 0 ? _h : 'submit'), true]);
-                }
-            });
-        }
-        function renderLabel(fgSpan, fgRowSpan, fg) {
-            return __asyncGenerator(this, arguments, function* renderLabel_1() {
-                var _a;
-                yield yield __await([
-                    html `<icure-form-label
-				style="${calculateFieldOrGroupSize(fgSpan, fgRowSpan)}"
-				class="icure-form-field"
-				.defaultLanguage="${props.language}"
-				labelPosition="${props.labelPosition}"
-				label="${(_a = fg.shortLabel) !== null && _a !== void 0 ? _a : fg.field}"
-				.translationProvider="${translationProvider !== null && translationProvider !== void 0 ? translationProvider : (form.translations && defaultTranslationProvider(form.translations))}"
-				.validationErrorsProvider="${getValidationErrorProvider(formsValueContainer, fg)}"
-				.styleOptions="${fg.styleOptions}"
-			></icure-form-label>`,
-                    true,
-                ]);
-            });
-        }
-        function dummyGen() {
-            return __asyncGenerator(this, arguments, function* dummyGen_1() {
-                yield yield __await([html ``, true]);
-            });
-        }
-        function renderFieldGroupOrSubform(fg, level) {
-            return __asyncGenerator(this, arguments, function* renderFieldGroupOrSubform_1() {
-                var _a, e_1, _b, _c;
-                var _d, _e, _f, _g, _h, _j;
-                if (!fg) {
-                    yield yield __await(Promise.resolve([nothing, true]));
-                    return yield __await(void 0);
-                }
-                const computedProperties = (yield __await(Object.keys((_d = fg.computedProperties) !== null && _d !== void 0 ? _d : {})
-                    .filter((k) => k !== 'value' && k !== 'defaultValue')
-                    .reduce((acc, k) => __awaiter(this, void 0, void 0, function* () { var _a; return (Object.assign(Object.assign({}, (yield acc)), { [k]: ((_a = fg.computedProperties) === null || _a === void 0 ? void 0 : _a[k]) && (yield (formsValueContainer === null || formsValueContainer === void 0 ? void 0 : formsValueContainer.compute(fg.computedProperties[k]))) })); }), Promise.resolve({}))));
-                if (computedProperties['hidden']) {
-                    yield yield __await(Promise.resolve([nothing, true]));
-                    return yield __await(void 0);
-                }
-                const fgSpan = ((_f = (_e = computedProperties['span']) !== null && _e !== void 0 ? _e : fg.span) !== null && _f !== void 0 ? _f : 6);
-                const fgRowSpan = ((_h = (_g = computedProperties['rowSpan']) !== null && _g !== void 0 ? _g : fg.rowSpan) !== null && _h !== void 0 ? _h : 1);
-                if (fg.clazz === 'group' && ((_j = fg.fields) === null || _j === void 0 ? void 0 : _j.length)) {
-                    yield __await(yield* __asyncDelegator(__asyncValues(renderGroup(fg.copy(Object.assign({}, computedProperties)), fgSpan, level))));
-                }
-                else if (fg.clazz === 'subform' && (fg.id || computedProperties['title'])) {
-                    yield __await(yield* __asyncDelegator(__asyncValues(renderSubform(fg.copy(Object.assign({}, computedProperties)), fgSpan, level))));
-                }
-                else if (fg.clazz === 'field') {
-                    const field = fg.copy(Object.assign({}, computedProperties));
-                    try {
-                        for (var _k = true, _l = __asyncValues(fg.type === 'text-field'
-                            ? renderTextField(fgSpan, fgRowSpan, field)
-                            : fg.type === 'measure-field'
-                                ? renderMeasureField(fgSpan, fgRowSpan, field)
-                                : fg.type === 'token-field'
-                                    ? renderTokenField(fgSpan, fgRowSpan, field)
-                                    : fg.type === 'items-list-field'
-                                        ? renderItemsListField(fgSpan, fgRowSpan, field)
-                                        : fg.type === 'number-field'
-                                            ? renderNumberField(fgSpan, fgRowSpan, field)
-                                            : fg.type === 'date-picker'
-                                                ? renderDatePicker(fgSpan, fgRowSpan, field)
-                                                : fg.type === 'time-picker'
-                                                    ? renderTimePicker(fgSpan, fgRowSpan, field)
-                                                    : fg.type === 'date-time-picker'
-                                                        ? renderDateTimePicker(fgSpan, fgRowSpan, field)
-                                                        : fg.type === 'dropdown-field'
-                                                            ? renderDropdownField(fgSpan, fgRowSpan, field)
-                                                            : fg.type === 'radio-button'
-                                                                ? renderRadioButtons(fgSpan, fgRowSpan, field)
-                                                                : fg.type === 'checkbox'
-                                                                    ? renderCheckboxes(fgSpan, fgRowSpan, field)
-                                                                    : fg.type === 'label'
-                                                                        ? renderLabel(fgSpan, fgRowSpan, field)
-                                                                        : fg.type === 'action'
-                                                                            ? renderButton(fgSpan, fgRowSpan, field)
-                                                                            : dummyGen()), _m; _m = yield __await(_l.next()), _a = _m.done, !_a; _k = true) {
-                            _c = _m.value;
-                            _k = false;
-                            const render = _c;
-                            yield yield __await([html `${render[0]}`, render[1]]);
-                        }
-                    }
-                    catch (e_1_1) { e_1 = { error: e_1_1 }; }
-                    finally {
-                        try {
-                            if (!_k && !_a && (_b = _l.return)) yield __await(_b.call(_l));
-                        }
-                        finally { if (e_1) throw e_1.error; }
-                    }
-                }
-                else {
-                    yield yield __await([html ``, true]);
-                }
-            });
-        }
-        const calculateFieldOrGroupSize = (span, rowSpan, fixedWidth) => {
-            if (fixedWidth)
-                return `width: ${fixedWidth}px`;
-            return `grid-column: span ${span}; ${rowSpan > 1 ? `grid-row: span ${rowSpan}` : ''}`;
-        };
-        function renderForm(form, sectionWrapper) {
-            return __asyncGenerator(this, arguments, function* renderForm_1() {
-                const sectionGenerators = form.sections.map(function (s) {
-                    return __asyncGenerator(this, arguments, function* () {
-                        const fieldsGenerator = s.fields.map((fieldOrGroup) => renderFieldGroupOrSubform(fieldOrGroup, 3));
-                        const cache = [];
-                        while (true) {
-                            const { done, subElements } = yield __await(allNext(fieldsGenerator, cache));
-                            yield yield __await([subElements, done]);
-                        }
-                    });
-                });
-                const cache = [];
-                while (true) {
-                    const { done, subElements } = yield __await(allNext(sectionGenerators, cache));
-                    yield yield __await([html `${yield __await(Promise.all(subElements.map((section, idx) => sectionWrapper(idx, () => __awaiter(this, void 0, void 0, function* () { return html ` <div class="icure-form">${section}</div>`; })))))}`, done]);
-                }
-            });
-        }
-        yield __await(yield* __asyncDelegator(__asyncValues(renderForm(form, sectionWrapper !== null && sectionWrapper !== void 0 ? sectionWrapper : ((_idx, section) => __awaiter(this, void 0, void 0, function* () { return yield section(); }))))));
     });
-}
+    return html `${yield renderForm(form, sectionWrapper !== null && sectionWrapper !== void 0 ? sectionWrapper : ((idx, section) => section()))}`;
+});
 //# sourceMappingURL=form.js.map