@smartbit4all/ng-client 7.3.37 → 7.3.38

package/HTML-WIDGET.md

@@ -14,7 +14,7 @@ html-t **két fázisban** oldjuk fel, két külön jelöléssel:
 | Fázis | Jelölés | Ki oldja fel | Mire jó |
 |---|---|---|---|
 | szerver-helyőrző | `${…}` | a backend, a page-ben, mielőtt a html elhagyja | feltétel, iteráció, szkript, lokalizáció — a platform meglévő template-dialektusa |
-| kliens-helyőrző | `{{…}}` | a kliens, a widget **feloldási kontextusán** | ugyanaz a html egyszer utazik és soronként / modell-változásonként újra feloldódik |
+| kliens-helyőrző | `{{…}}` | a kliens, a widget **feloldási kontextusán** | ugyanaz a html egyszer utazik és soronként / modell-változásonként, a form egy kontrolljának minden szerkesztésére újra feloldódik |
 
 A kliens a szerver-fázisból semmit nem lát: mire a html megérkezik, a `${…}` már nincs benne.
 
@@ -40,7 +40,8 @@ A `DIV` widget változatlanul megmarad; a HTML widget annak a használatnak a re
 | `css` | a widget stíluslapja, a html mellett utazik — lásd *Stíluslap* |
 | `icons` | az **ikon-szótár**: `kulcs → ImageResource`, amit az ikon-slotok `data-sb4-icon-key`-jel címeznek — lásd *Ikon-slot* |
 
-A **feloldási kontextus** nézeten a `ComponentModel` (`data` + `valueSets`), grid-kártyán a sor
+A **feloldási kontextus** nézeten a `ComponentModel` (`data` + `valueSets`), a `data`-ban a form
+kontrolljainak még be nem küldött szerkesztéseivel, grid-kártyán a sor
 (`GridRow.data`) a gridet mutató oldal `valueSets`-ével. Ha a `root` listát, egyetlen értéket vagy
 semmit nevez, minden helyőrző üres marad, és a kliens egyszer `console.warn`-t ír.
 

package/fesm2022/smartbit4all-ng-client.mjs

@@ -4320,6 +4320,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
             args: [{ selector: '[smartEmbeddedSlot]' }]
         }], propDecorators: { containerId: [{ type: i0.Input, args: [{ isSignal: true, alias: "smartEmbeddedSlot", required: true }] }], containerUuid: [{ type: i0.Input, args: [{ isSignal: true, alias: "containerUuid", required: false }] }] } });
 
+/** Uri text as RFC 3986 gives it, the URI_PATTERN of UriUtils on the server. */
+const URI_PATTERN = new RegExp('^(?:(?:[a-zA-Z][a-zA-Z0-9+.-]*):)' + // scheme
+    "(?://(?:[\\w\\-._~%!$&'()*+,;=:]+@)?" + // userinfo
+    '(?:\\[[0-9A-Fa-f:.]+\\]|[\\w\\-._~%]+)' + // host (IP-literal / IPv4 / name)
+    '(?::\\d{2,5})?)?' + // port
+    "(?:/[\\w\\-._~%!$&'()*+,;=:@]*)*" + // path
+    "(?:\\?[\\w\\-._~%!$&'()*+,;=:@/?]*)?" + // query
+    "(?:#[\\w\\-._~%!$&'()*+,;=:@/?]*)?$" // fragment
+);
+/** The version suffix of the storage at the end of a path. */
+const VERSION_SUFFIX = /\.v(?:0|[1-9]\d*)$/;
 /**
  * The key and display property of a valueSet's values: the preferred name if the values carry it,
  * then the GenericValue name (`uri` / `name`), then the Value name (`objectUri` / `displayValue`).
@@ -4331,26 +4342,66 @@ function valueSetKeyProperty(values, preferred) {
 function valueSetDisplayProperty(values, preferred) {
     return firstExisting(values, [preferred ?? 'displayValue', 'name', 'displayValue']);
 }
+/**
+ * The property of a value: a key the value has as it is, else a dotted path navigated part by
+ * part (`data.name`); undefined when a part is missing.
+ */
+function readValueSetProperty(value, property) {
+    if (value === null || typeof value !== 'object' || property in value) {
+        return value?.[property];
+    }
+    return property.split('.').reduce((part, name) => part?.[name], value);
+}
 /** The label of a code in a valueSet, or undefined when the valueSet does not know the code. */
 function valueSetLabelOf(valueSetData, code) {
     const values = valueSetData.values ?? [];
     const keyProperty = valueSetKeyProperty(values, valueSetData.keyProperty);
-    const hit = values.find((value) => String(value[keyProperty]) === String(code));
-    return hit?.[valueSetDisplayProperty(values)];
+    const hit = values.find((value) => isSameKey(readValueSetProperty(value, keyProperty), code, valueSetData.versionedKeys));
+    return hit && readValueSetProperty(hit, valueSetDisplayProperty(values));
 }
 function firstExisting(values, candidates) {
     if (!values?.length) {
         return candidates[0];
     }
-    return candidates.find((c) => c in values[0]) ?? candidates[candidates.length - 1];
+    // A candidate exists when the first value reads it, also as a dotted path, or has it as a key.
+    return (candidates.find((c) => readValueSetProperty(values[0], c) !== undefined || c in values[0]) ??
+        candidates[candidates.length - 1]);
 }
 /** Whether a field holds no value: `''`, null, undefined or an empty list. */
 function isEmptyValue(value) {
     return value === '' || value == null || (Array.isArray(value) && value.length === 0);
 }
-/** Whether two keys are equal; compared as text, as a control holds a boolean key as text. */
-function isSameKey(key1, key2) {
-    return String(key1) === String(key2);
+/**
+ * The key as the keys of a set compare: as text, a uri text (RFC 3986) without the version suffix
+ * at the end of its path unless the set has Versioned Keys. Any other text stays as it is, a code
+ * ending in a version too.
+ */
+function createReferenceKey(key, versionedKeys) {
+    const text = String(key);
+    return versionedKeys || !URI_PATTERN.test(text) ? text : removeVersion(text);
+}
+/**
+ * The uri text without the version suffix at the end of its path, as removeVersion of UriUtils on
+ * the server; the scheme, the authority, the query and the fragment stay as they are.
+ */
+function removeVersion(uri) {
+    const schemeEnd = uri.indexOf(':');
+    const queryOrFragment = uri.slice(schemeEnd + 1).search(/[?#]/);
+    const pathEnd = queryOrFragment < 0 ? uri.length : schemeEnd + 1 + queryOrFragment;
+    let pathStart = schemeEnd + 1;
+    if (uri.startsWith('//', pathStart)) {
+        const slash = uri.indexOf('/', pathStart + 2);
+        pathStart = slash < 0 || slash > pathEnd ? pathEnd : slash;
+    }
+    const version = VERSION_SUFFIX.exec(uri.slice(pathStart, pathEnd));
+    return version ? uri.slice(0, pathStart + version.index) + uri.slice(pathEnd) : uri;
+}
+/**
+ * Whether two keys of a set are equal as {@link createReferenceKey} gives them; as text, as a
+ * control holds a boolean key as text.
+ */
+function isSameKey(key1, key2, versionedKeys) {
+    return createReferenceKey(key1, versionedKeys) === createReferenceKey(key2, versionedKeys);
 }
 
 /**
@@ -4456,7 +4507,7 @@ class SmartValueSetMemoryStore extends SmartValueSetStore {
             }
             const held = this.viewEntries.get(viewUuid)?.get(key);
             const extras = {
-                extras: addReceivedExtras(held?.extras, valueSet.extraValues),
+                extras: addReceivedExtras(held?.extras, valueSet.extraValues, this.findVersionedKeys(viewUuid, key, valueSet, held)),
                 excludedKeys: valueSet.excludedKeys,
             };
             // A version alone keeps the values held on screen until the fetch brings the new ones.
@@ -4879,6 +4930,18 @@ class SmartValueSetMemoryStore extends SmartValueSetStore {
         });
         changedNames.forEach((name) => this.changeSource.next(name));
     }
+    /**
+     * The Versioned Keys of the view's set of the key: of the values it receives or holds, else of
+     * the explicit set its selection reads; undefined while the client has none of them.
+     */
+    findVersionedKeys(viewUuid, key, valueSet, held) {
+        const selection = this.viewSelections.get(viewUuid)?.get(key);
+        const data = valueSet.valueSetData ??
+            held?.data ??
+            (selection &&
+                this.findExplicitEntry(viewUuid, selection.valueSetNamespace, key)?.data);
+        return data ? !!data.versionedKeys : undefined;
+    }
     mergeViewExtras(data, viewEntry, selection) {
         return viewEntry?.extras?.length || viewEntry?.excludedKeys?.length
             ? mergeExtraValues(data, viewEntry, selection)
@@ -4911,31 +4974,46 @@ class SmartValueSetMemoryStore extends SmartValueSetStore {
         this.changeSource.next(key);
     }
 }
-/** The held extras followed by the received ones of a code not held yet. */
-function addReceivedExtras(held, received) {
-    const heldCodes = new Set((held ?? []).map((extra) => extra.value.code));
+/**
+ * The held extras followed by the received ones of a code not held yet, compared as
+ * {@link createReferenceKey} gives it. While the Versioned Keys of the set are unknown the codes
+ * compare exactly, the merge with the set drops the second version of an object then.
+ */
+function addReceivedExtras(held, received, versionedKeys) {
+    const keepsVersion = versionedKeys !== false;
+    const heldCodes = new Set((held ?? []).map((extra) => createReferenceKey(extra.value.code, keepsVersion)));
     const added = (received ?? [])
-        .filter((value) => !heldCodes.has(value.code))
+        .filter((value) => !heldCodes.has(createReferenceKey(value.code, keepsVersion)))
         .map((value) => ({ value }));
     return [...(held ?? []), ...added];
 }
 /**
- * The set without the values whose text at the set's key property is an excluded key, then the
- * view's extras keyed by their code under the selection's key property, none the set has.
+ * The set without the values whose key at the set's key property is an excluded key, then the
+ * view's extras keyed by their code under the selection's key property, none the set or an extra
+ * before has; the keys compare as {@link createReferenceKey} gives them.
  */
 function mergeExtraValues(data, extras, selection) {
     const values = data.values ?? [];
     const keyProperty = valueSetKeyProperty(values, selection.keyProperty ?? data.keyProperty);
     const displayProperty = valueSetDisplayProperty(values, selection.displayProperty);
-    const excludedKeys = new Set(extras.excludedKeys ?? []);
+    const versionedKeys = data.versionedKeys;
+    const excludedKeys = new Set((extras.excludedKeys ?? []).map((key) => createReferenceKey(key, versionedKeys)));
     const keptValues = values.filter((value) => {
-        const key = data.keyProperty ? value?.[data.keyProperty] : undefined;
-        return key === undefined || key === null || !excludedKeys.has(String(key));
+        const key = data.keyProperty &&
+            findReferenceKey(readValueSetProperty(value, data.keyProperty), versionedKeys);
+        return key === undefined || !excludedKeys.has(key);
     });
-    const keys = new Set(keptValues.map((value) => convertKeyToText(value?.[keyProperty])));
+    const keys = new Set(keptValues.map((value) => findReferenceKey(readValueSetProperty(value, keyProperty), versionedKeys)));
     const extraValues = (extras.extras ?? [])
         .map((extra) => extra.value)
-        .filter((extra) => extra.code !== undefined && !keys.has(extra.code))
+        .filter((extra) => {
+        const key = findReferenceKey(extra.code, versionedKeys);
+        if (key === undefined || keys.has(key)) {
+            return false;
+        }
+        keys.add(key);
+        return true;
+    })
         .map((extra) => {
         const merged = {
             ...extra,
@@ -4953,8 +5031,9 @@ const mergedExtras = new WeakSet();
 function isMergedExtra(value) {
     return typeof value === "object" && value !== null && mergedExtras.has(value);
 }
-function convertKeyToText(key) {
-    return key === undefined || key === null ? undefined : String(key);
+/** The key as {@link createReferenceKey} gives it, undefined for no key. */
+function findReferenceKey(key, versionedKeys) {
+    return key === undefined || key === null ? undefined : createReferenceKey(key, versionedKeys);
 }
 function createExplicitKey(module, namespace, name, branchUri) {
     return JSON.stringify([module ?? "", namespace ?? "", name, branchUri ?? ""]);
@@ -8045,6 +8124,13 @@ class SmartFormService {
          * mutating. See ADR-0007, decision 4.
          */
         this.revision = this.revisionState.asReadonly();
+        this.controlRevisionState = signal(0, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "controlRevisionState" }] : /* istanbul ignore next */ []));
+        /**
+         * Counts the value changes of the form's controls, which reach the data only at submit. A
+         * widget showing the model as edited (the html widget) reads it to follow the user's edits.
+         */
+        this.controlRevision = this.controlRevisionState.asReadonly();
         this.emptyKey = 'e#m%p@t*y';
         this.group = {};
         /** The previous build's controls during a rebuild: a widget still shown keeps its control. */
@@ -8080,6 +8166,10 @@ class SmartFormService {
     widgetsChanged() {
         this.revisionState.update((revision) => revision + 1);
     }
+    /** Whether the set the selection widget lists has Versioned Keys. */
+    hasVersionedKeys(widget) {
+        return !!this.filledValueSets.get(widget)?.versionedKeys;
+    }
     /** Forgets the agreed values; the form is being rebuilt from the model. */
     resetExchangedValues() {
         this.exchanged.clear();
@@ -8318,8 +8408,9 @@ class SmartFormService {
     }
     /**
      * The values of the set the widget's parent fields admit: each dependency compares the parent
-     * control's value with the value object's property. A parent with no control in the form admits
-     * every value. An extra of the view is listed only while the parents hold the keys of its tag.
+     * control's value with the value object's property, by the Versioned Keys of the widget's set. A
+     * parent with no control in the form admits every value. An extra of the view is listed only
+     * while the parents hold the keys of its tag.
      */
     narrowValueSetData(widget, valueSetData, form) {
         const dependencies = this.getDependencies(widget);
@@ -8327,16 +8418,18 @@ class SmartFormService {
             return valueSetData;
         }
         const keyProperty = this.readKeyProperty(widget, valueSetData);
+        const versionedKeys = valueSetData.versionedKeys;
         const extras = this.viewExtras.get(widget) ?? [];
         const parentKeys = this.readDependencyKeys(widget, form);
         const values = valueSetData.values.filter((value) => {
+            const key = readValueSetProperty(value, keyProperty);
             const sameKeyExtras = isMergedExtra(value)
-                ? extras.filter((extra) => isSameKey(extra.value.code, value[keyProperty]))
+                ? extras.filter((extra) => isSameKey(extra.value.code, key, versionedKeys))
                 : [];
             if (sameKeyExtras.length) {
-                return sameKeyExtras.some((extra) => !!extra.tag && this.isTaggedWith(extra.tag, parentKeys));
+                return sameKeyExtras.some((extra) => !!extra.tag && this.isTaggedWith(extra.tag, parentKeys, versionedKeys));
             }
-            return dependencies.every((dependency) => this.isAdmittedBy(dependency, value, form));
+            return dependencies.every((dependency) => this.isAdmittedBy(dependency, value, form, versionedKeys));
         });
         return { ...valueSetData, values };
     }
@@ -8349,17 +8442,17 @@ class SmartFormService {
                 : this.readParentKeys(dependency.modelPath, control.value);
         });
     }
-    isTaggedWith(tag, parentKeys) {
+    isTaggedWith(tag, parentKeys, versionedKeys) {
         return (tag.length === parentKeys.length &&
             tag.every((keys, index) => keys.length === parentKeys[index].length &&
-                keys.every((key, keyIndex) => isSameKey(key, parentKeys[index][keyIndex]))));
+                keys.every((key, keyIndex) => isSameKey(key, parentKeys[index][keyIndex], versionedKeys))));
     }
-    isAdmittedBy(dependency, value, form) {
+    isAdmittedBy(dependency, value, form, versionedKeys) {
         const control = form.controls[dependency.modelPath];
         if (!control || isEmptyValue(control.value)) {
             return !this.isBlockedByEmptyParent(dependency, form);
         }
-        return this.readParentKeys(dependency.modelPath, control.value).some((key) => isSameKey(key, value[dependency.property]));
+        return this.readParentKeys(dependency.modelPath, control.value).some((key) => isSameKey(key, value[dependency.property], versionedKeys));
     }
     /**
      * The keys a parent field holds: an object value, the whole entry of an OBJECT selection, gives
@@ -8371,7 +8464,7 @@ class SmartFormService {
                 return value;
             }
             const parent = this.findWidgetByKey(modelPath);
-            return value[valueSetKeyProperty([value], parent?.selection?.keyProperty)];
+            return readValueSetProperty(value, valueSetKeyProperty([value], parent?.selection?.keyProperty));
         });
     }
     /**
@@ -8403,7 +8496,7 @@ class SmartFormService {
         }
         const keyProperty = this.readKeyProperty(widget, valueSetData);
         const readKey = this.createKeyReader(widget, valueSetData);
-        const isAdmitted = (item) => valueSetData.values.some((admitted) => isSameKey(admitted[keyProperty], readKey(item)));
+        const isAdmitted = (item) => valueSetData.values.some((admitted) => isSameKey(readValueSetProperty(admitted, keyProperty), readKey(item), valueSetData.versionedKeys));
         if (Array.isArray(value)) {
             return value.filter(isAdmitted);
         }
@@ -8413,7 +8506,7 @@ class SmartFormService {
     createKeyReader(widget, valueSetData) {
         const keyProperty = this.readKeyProperty(widget, valueSetData);
         return (item) => widget.selection.type === SelectionDefinitionTypeEnum.OBJECT
-            ? item?.[keyProperty]
+            ? readValueSetProperty(item, keyProperty)
             : item;
     }
     readKeyProperty(widget, valueSetData) {
@@ -8445,11 +8538,12 @@ class SmartFormService {
             !selection.mapping?.length) {
             let keyProperty = valueSetKeyProperty(values, selection.keyProperty ?? valueSetData?.keyProperty);
             select.valueList = values.map((value) => {
+                const key = readValueSetProperty(value, keyProperty);
                 return {
-                    key: value[keyProperty],
-                    label: value[displayProperty],
+                    key,
+                    label: readValueSetProperty(value, displayProperty),
                     type: SmartFormWidgetType.ITEM,
-                    value: value[keyProperty],
+                    value: key,
                 };
             });
             if (!isRequired(select)) {
@@ -8461,7 +8555,7 @@ class SmartFormService {
             select.valueList = values.map((value, index) => {
                 return {
                     key: `${index}`,
-                    label: value[displayProperty],
+                    label: readValueSetProperty(value, displayProperty),
                     type: SmartFormWidgetType.ITEM,
                     value: value,
                 };
@@ -8493,6 +8587,8 @@ class SmartFormService {
         }
         else {
             this.formGroup = new UntypedFormGroup(this.group);
+            // The group lives as long as this service: a rebuild reuses it, so one subscription holds.
+            this.formGroup.valueChanges.subscribe(() => this.controlRevisionState.update((revision) => revision + 1));
         }
         if (this.smartForm.validators && this.smartForm.validators.length) {
             this.formGroup.setValidators(this.smartForm.validators.map((validator) => {
@@ -8638,24 +8734,40 @@ class SmartFormService {
             this.copyValueFromFormToWidgetBeans(this.smartForm.widgets, group);
             const data = this.smartForm.componentModel?.data;
             if (data) {
-                for (const key of this.getPropertyNamesDeeply(data)) {
-                    if (!group.controls[key]) {
-                        continue;
-                    }
-                    const agreed = this.exchanged.has(key)
-                        ? this.exchanged.get(key)
-                        : this.getValueDeeply(data, key);
-                    const value = coerceToTypeOf(agreed, group.controls[key].value);
-                    if (this.exchanged.has(key) && deepEqual(value, agreed)) {
-                        continue;
-                    }
-                    this.setValueDeeply(data, key, value);
-                    this.exchanged.set(key, structuredClone(this.getValueDeeply(data, key)));
-                }
+                this.copyControlsIntoData(data, group, this.exchanged);
             }
         }
         return this.smartForm;
     }
+    /**
+     * The form's data with the controls' edits applied as the next submit would copy them (a
+     * MATRIX widget excepted: its submit changes the data through the widget beans). The result is
+     * read-only: it is a copy, but the live data itself when the form has no controls; undefined
+     * without a data.
+     */
+    buildModelWithEdits() {
+        const data = this.smartForm?.componentModel?.data;
+        if (!data || !this.formGroup) {
+            return data;
+        }
+        const model = structuredClone(data);
+        this.copyControlsIntoData(model, this.formGroup, new Map(this.exchanged));
+        return model;
+    }
+    copyControlsIntoData(data, group, exchanged) {
+        for (const key of this.getPropertyNamesDeeply(data)) {
+            if (!group.controls[key]) {
+                continue;
+            }
+            const agreed = exchanged.has(key) ? exchanged.get(key) : this.getValueDeeply(data, key);
+            const value = coerceToTypeOf(agreed, group.controls[key].value);
+            if (exchanged.has(key) && deepEqual(value, agreed)) {
+                continue;
+            }
+            this.setValueDeeply(data, key, value);
+            exchanged.set(key, structuredClone(this.getValueDeeply(data, key)));
+        }
+    }
     getModel(group) {
         if (!this.smartForm?.componentModel) {
             return {};
@@ -10644,9 +10756,10 @@ function injectSmartHtmlRenderer(container) {
 
 /**
  * The HTML widget: server-sent HTML whose client placeholders are resolved against the model of
- * the form it sits on, the widget's `root` applied. It has no control, no label and no value of
- * its own; it follows the form's revision and the value sets it reads and re-resolves, which
- * rewrites the html only when the result differs. See HTML-WIDGET.md.
+ * the form it sits on, its controls' unsubmitted edits included, the widget's `root` applied. It
+ * has no control, no label and no value of its own; it follows the form's revision, every edit of
+ * a control and the value sets it reads and re-resolves, which rewrites the html only when the
+ * result differs. See HTML-WIDGET.md.
  */
 class SmartHtmlWidgetComponent {
     constructor() {
@@ -10659,13 +10772,14 @@ class SmartHtmlWidgetComponent {
         ...(ngDevMode ? [{ debugName: "widgetInstance" }] : /* istanbul ignore next */ []));
         effect(() => {
             this.service.revision();
+            this.service.controlRevision();
             this.valueSetReads.changed();
             const properties = this.widgetInstance().htmlProperties;
             const model = this.service.smartForm?.componentModel;
             this.warnUnloaded(properties);
             this.renderer.useCss(properties?.css);
             this.renderer.render(properties?.html ?? '', {
-                data: this.scope(model?.data, properties?.root, properties?.html),
+                data: this.scope(this.service.buildModelWithEdits(), properties?.root, properties?.html),
                 findValueSetData: this.valueSetReads.track(createValueSetLookup(model?.valueSets, this.valueSetStore, this.smartComponent?.uuid)),
                 icons: properties?.icons,
             });
@@ -11230,6 +11344,16 @@ class SmartformwidgetComponent {
         this.addOnBlur = true;
         this.separatorKeysCodes = [ENTER, COMMA];
         this.emptySeparatorKeysCodes = [];
+        /**
+         * The mat-select comparison of the widget's keys, by the Versioned Keys of its set. An arrow
+         * property, as the template hands it to mat-select unbound.
+         */
+        this.compareItems = (o1, o2) => {
+            const versionedKeys = this.service.hasVersionedKeys(this.widgetInstance);
+            const v1 = o1 && typeof o1 === 'string' ? createReferenceKey(o1, versionedKeys) : o1;
+            const v2 = o2 && typeof o2 === 'string' ? createReferenceKey(o2, versionedKeys) : o2;
+            return deepEqual(v1, v2);
+        };
         // The form changes the widget objects it has already handed to this template — values,
         // constraints, the touched state of the controls — and a mutation of a plain object is
         // invisible to change detection. Registering here rather than being found by a view query
@@ -12076,19 +12200,6 @@ class SmartformwidgetComponent {
         }
         this.setDateFormControl(control, yearMonthValue, '00:00');
     }
-    compareItems(o1, o2) {
-        function convert(obj) {
-            if (obj && typeof obj === 'string') {
-                return obj.replace(/\.v[0-9]+$/, '');
-            }
-            return obj;
-        }
-        // calling this.truncateUri didn't work
-        // TODO: use widget.selection.parameter for ignoreUriVersion / strictUriComparison;
-        let v1 = convert(o1);
-        let v2 = convert(o2);
-        return deepEqual(v1, v2);
-    }
     truncateUri(uri) {
         if (uri && typeof uri === 'string') {
             return uri.replace(/\.v[0-9]+$/, '');