@valtimo/components 13.44.0 → 13.45.1

package/assets/css/carbon.scss

@@ -109,6 +109,8 @@ $darkThemeOverwriteVariables: (
 
 @use '@carbon/styles';
 @use '@carbon/grid';
+/* @use so the path resolves here, not in the consuming app; aliased to avoid a namespace clash */
+@use '@carbon/charts-angular/styles.min.css' as chart-styles;
 @include grid.flex-grid();
 
 /* Extended tag colours, beyond the ten colours Carbon ships for tags. They follow Carbon's own tag
@@ -201,8 +203,6 @@ $extendedTagColors: (
   }
 }
 
-@import 'node_modules/@carbon/charts-angular/styles.min.css';
-
 /* default Valtimo colors */
 
 :root {

package/fesm2022/valtimo-components.mjs

@@ -61,7 +61,6 @@ import { english } from 'flatpickr/dist/l10n/default';
 import * as i2$5 from 'ng-multiselect-dropdown';
 import { NgMultiSelectDropDownModule } from 'ng-multiselect-dropdown';
 import { v4 } from 'uuid';
-import { createJSONEditor } from 'vanilla-jsoneditor';
 import Ajv from 'ajv';
 import Muuri from 'muuri';
 import Pickr from '@simonwep/pickr';
@@ -11538,18 +11537,21 @@ class FormIoCurrencyComponent {
     }
     set value(value) {
         this._value = value;
+        // Rendering only — emitting here would write the rendered value back over the one form.io
+        // is about to hand a freshly redrawn component.
         this.currencyForm.setValue({
             currencyValue: Currency.masking(value, this.maskOpts),
-        });
+        }, { emitEvent: false });
     }
     set disabled(value) {
         if (value) {
-            this.currencyForm.disable();
+            this.currencyForm.disable({ emitEvent: false });
         }
         else {
-            this.currencyForm.enable();
+            this.currencyForm.enable({ emitEvent: false });
         }
     }
+    // A fresh object every call: Currency's constructor sets viaInput on the options it is handed.
     get maskOpts() {
         return {
             empty: this.allowEmptyValue || false,
@@ -11563,6 +11565,10 @@ class FormIoCurrencyComponent {
     }
     ngOnInit() {
         this._subscriptions.add(this.currencyForm.valueChanges.subscribe(() => {
+            // No mask yet: the value is being rendered, not typed, so there is nothing to write back.
+            if (!this._currencyInstance) {
+                return;
+            }
             const unmasked = this._currencyInstance.getUnmasked(this.currencyForm.value.currencyValue);
             if (unmasked === 0 && this.allowEmptyValue) {
                 this._value = null;
@@ -11581,25 +11587,35 @@ class FormIoCurrencyComponent {
         this._currencyInstance = new Currency(this.currencyElement.nativeElement, {
             maskOpts: this.maskOpts,
         });
+        // A value can arrive before the view exists, so its render is redone here with the mask in
+        // place.
+        if (typeof this._value === 'number') {
+            this.renderValue();
+        }
     }
     ngOnChanges(changes) {
         if (changes.currencyLocale || changes.currencyCurrency || changes.allowEmptyValue) {
-            if (typeof this.currencyLocale === 'string') {
-                this._currencyInstance.opts.maskOpts.locales = this.currencyLocale;
-            }
-            if (typeof this.currencyCurrency === 'string') {
-                this._currencyInstance.opts.maskOpts.options.currency = this.currencyCurrency;
-            }
-            if (typeof this.allowEmptyValue === 'boolean') {
-                this._currencyInstance.opts.maskOpts.empty = this.allowEmptyValue;
+            // ngOnChanges runs before ngAfterViewInit, which is where the mask is created from the
+            // current inputs, so there is nothing to update yet on the first run.
+            if (this._currencyInstance) {
+                if (typeof this.currencyLocale === 'string') {
+                    this._currencyInstance.opts.maskOpts.locales = this.currencyLocale;
+                }
+                if (typeof this.currencyCurrency === 'string') {
+                    this._currencyInstance.opts.maskOpts.options.currency = this.currencyCurrency;
+                }
+                if (typeof this.allowEmptyValue === 'boolean') {
+                    this._currencyInstance.opts.maskOpts.empty = this.allowEmptyValue;
+                }
             }
-            this.currencyForm.setValue({
-                currencyValue: typeof this._value === 'number'
-                    ? Currency.masking(this._value, this._currencyInstance.opts.maskOpts)
-                    : '',
-            });
+            this.renderValue();
         }
     }
+    renderValue() {
+        this.currencyForm.setValue({
+            currencyValue: typeof this._value === 'number' ? Currency.masking(this._value, this.maskOpts) : '',
+        }, { emitEvent: false });
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: FormIoCurrencyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: FormIoCurrencyComponent, isStandalone: false, selector: "valtimo-currency", inputs: { value: "value", disabled: "disabled", currencyLocale: "currencyLocale", currencyCurrency: "currencyCurrency", allowEmptyValue: "allowEmptyValue" }, outputs: { valueChange: "valueChange" }, viewQueries: [{ propertyName: "currencyElement", first: true, predicate: ["currencyElement"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<div class=\"currencyForm-container\" [formGroup]=\"currencyForm\">\n  <div class=\"input-group\">\n    <input #currencyElement id=\"currency\" formControlName=\"currencyValue\" class=\"form-control\" />\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] }); }
 }
@@ -19391,6 +19407,7 @@ class SchemaEditorComponent {
         this.changeEvent = new EventEmitter();
         this.saveEvent = new EventEmitter();
         this.validEvent = new EventEmitter();
+        this._destroyed = false;
         this._ajv = new Ajv();
         this.showSaveConfirmationModal$ = new BehaviorSubject(false);
         this.valid$ = new BehaviorSubject(false);
@@ -19400,10 +19417,15 @@ class SchemaEditorComponent {
         this.showRequiredPanel$ = new BehaviorSubject(false);
         this.iconService.registerAll([DocumentRequirements16]);
     }
-    ngAfterViewInit() {
-        const initial = { text: this.schemaJson };
+    async ngAfterViewInit() {
         this.setObjectLevels(this.schemaJson);
         this.setRequired(this.schemaJson);
+        // Lazy — keeps vanilla-jsoneditor out of the initial bundle
+        const { createJSONEditor } = await import('vanilla-jsoneditor');
+        if (this._destroyed)
+            return;
+        // Read after the await: inputs may have changed while loading
+        const initial = { text: this.schemaJson };
         this._editor = createJSONEditor({
             target: this.hostEl.nativeElement,
             props: {
@@ -19447,6 +19469,7 @@ class SchemaEditorComponent {
         }
     }
     ngOnDestroy() {
+        this._destroyed = true;
         if (this._editor)
             this._editor.destroy?.();
     }