@configura/web-api 1.6.0-iotest.2 → 1.6.1-alpha.1

package/dist/CfgProduct.d.ts

@@ -5,10 +5,11 @@ import { _CfgFeatureInternal } from "./productConfiguration/CfgFeature.js";
 import { ProductConfigurationBubbleMode } from "./productConfiguration/CfgOption.js";
 import { CfgProductConfiguration } from "./productConfiguration/CfgProductConfiguration.js";
 import { ProductLoader } from "./productLoader.js";
+import { SyncGroupsApplyMode } from "./syncGroups/SyncGroupsApplyMode.js";
+import { SyncGroupsHandler } from "./syncGroups/SyncGroupsHandler.js";
 import { CfgProductData, RootNodeSource } from "./utilitiesCatalogueData.js";
 export declare type CfgProductChangeNotification = {
     freshRef: CfgProduct;
-    committed: boolean;
 };
 export declare type CfgProductSettings = {
     /**
@@ -25,6 +26,20 @@ export declare type CfgProductSettings = {
      * believe is a rare use case.
      */
     strictSetApiSelectionMatch: boolean;
+    /**
+     * Controls if SyncGroups are applied Faster or Stricter.
+     *
+     * Fast - Tries to minimize the number of validates calls to the AI lowering the response times
+     * for selecting options. Might not always give the expected result for complex products.
+     *
+     * Strict - Apply the SyncGroups rules in a stricter fashion to be as close to CET as possible,
+     * which might result in longer response times and more validation calls to the API when
+     * selecting options.
+     *
+     * The SDK will default to Strict, but we recommend that you try out Fast since cases where the
+     * results differ should be rare in most real uses cases and the speedup can be quite large.
+     */
+    syncGroupsApplyMode: SyncGroupsApplyMode | undefined;
 };
 /**
  * This enum is used internally in the SDK and is not expected by be used directly by integrators.
@@ -49,6 +64,10 @@ export declare type CfgPrice = {
     currency: string;
     fractionDigits: number;
 };
+export declare type RevalidateResult = {
+    wasAborted: boolean;
+    requestDidValidate: boolean;
+};
 /**
  * This class is meant to only be used through CfgProduct. It should never be instantiated on its
  * own. Normally the internal state of this class should never be directly modified. CfgProduct is
@@ -69,6 +88,7 @@ export declare class _CfgProductInternal {
     readonly parent: _CfgProductInternal | undefined;
     readonly transform: Transform | undefined;
     anchor: MeasureParam | undefined;
+    private readonly _syncGroupHandler;
     static make: (productLoaderRaw: ProductLoader, productLoaderForGroupedLoad: ProductLoader | undefined, lang: string, catId: CatalogueParams, partNumber: string, settings: CfgProductSettings, optional: boolean, loadingObservable: AggregatedLoadingObservable, refKey: string | undefined, refDescription: string | undefined, parent: _CfgProductInternal | undefined, root: _CfgProductInternal | undefined, transform: Transform | undefined, anchor: MeasureParam | undefined) => Promise<_CfgProductInternal>;
     private constructor();
     readonly root: _CfgProductInternal;
@@ -113,17 +133,18 @@ export declare class _CfgProductInternal {
      * It does not affect the visibility of anything in the 3D view at all.
      */
     get visible(): boolean;
-    _notifyAllOfChange: (bubbleMode: CfgProductBubbleMode, committed: boolean) => Promise<void>;
+    _notifyAllOfChange: (bubbleMode: CfgProductBubbleMode) => Promise<void>;
     /** Called when a child (additional product or the configuration) has changed. */
     private _childHasChanged;
     /** Called by child to tell its parent that it has changed. */
-    _additionalProductHasChanged: (freshRef: CfgProduct, bubbleMode: CfgProductBubbleMode, committed: boolean) => Promise<void>;
+    _additionalProductHasChanged: (freshRef: CfgProduct, bubbleMode: CfgProductBubbleMode) => Promise<void>;
     /** Called by the configuration to tell its parent that it has changed. */
-    _configurationHasChanged: (freshRef: CfgProductConfiguration, bubbleMode: ProductConfigurationBubbleMode, committed: boolean) => Promise<void>;
+    _configurationHasChanged: (freshRef: CfgProductConfiguration, bubbleMode: ProductConfigurationBubbleMode) => Promise<void>;
     getApiSelection: () => AdditionalProductConfiguration;
     setApiSelection: (s: AdditionalProductConfiguration, doValidate: boolean, productLoaderForGroupedLoad?: ProductLoader | undefined) => Promise<boolean>;
-    getApiSelectionAsString: () => string;
-    setFromApiSelectionString: (str: string, doValidate: boolean, productLoaderForGroupedLoad?: ProductLoader | undefined) => Promise<boolean>;
+    copyFrom: (otherProduct: _CfgProductInternal, doValidate: boolean, productLoaderForGroupedLoad?: ProductLoader | undefined) => Promise<boolean>;
+    private _setApiSelectionWithOtherProduct;
+    get syncGroupHandler(): SyncGroupsHandler | undefined;
     structureCompare: (other: _CfgProductInternal, strictOrder?: boolean, descriptionMatch?: boolean) => boolean;
     tryMatchSelection: (other: _CfgProductInternal, descriptionMatch?: boolean, productLoaderForGroupedLoad?: ProductLoader | undefined) => Promise<boolean>;
     /** Only features in selected options and selected additional products. */
@@ -134,7 +155,7 @@ export declare class _CfgProductInternal {
      * product in isolation. The validation result is applied on the configuration. Then additional
      * products are synced (unloaded, loaded etc.) Finally the changes bubble up the tree.
      */
-    _revalidate: (bubbleMode: CfgProductBubbleMode, productLoader: ProductLoader, committed: boolean) => Promise<boolean>;
+    _revalidate: (bubbleMode: CfgProductBubbleMode, productLoader: ProductLoader) => Promise<RevalidateResult>;
     /**
      * Based on this configuration find what additional products should be shown and not, unload
      * (i.e. destroy) those that should no longer be shown, load the new ones.
@@ -146,7 +167,7 @@ export declare class CfgProduct {
     static make(productLoader: ProductLoader, lang: string, catId: CatalogueParams, partNumber: string, settings?: Partial<CfgProductSettings>): Promise<CfgProduct>;
     /**
      * Makes an object wrapping the passed object. This is not a clone method, it is a method to
-     * make a new outer reference. Like a shallow copy./ We use this to help frameworks that are
+     * make a new outer reference. Like a shallow copy. We use this to help frameworks that are
      * build around using equals to detect change.
      */
     static _makeNewRefFrom(source: _CfgProductInternal): CfgProduct;
@@ -233,8 +254,6 @@ export declare class CfgProduct {
      */
     getApiSelection: () => AdditionalProductConfiguration;
     setApiSelection: (s: AdditionalProductConfiguration, doValidate?: boolean) => Promise<boolean>;
-    getApiSelectionAsString: () => string;
-    setFromApiSelectionString: (str: string, doValidate?: boolean) => Promise<boolean>;
     listenForChange: (l: SingleArgCallback<CfgProductChangeNotification>) => void;
     stopListenForChange: (l: SingleArgCallback<CfgProductChangeNotification>) => void;
     stopAllListenForChange: () => void;

package/dist/CfgProduct.js

@@ -7,18 +7,20 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import { AggregatedLoadingObservable, compareArrays, count, Observable, toLengthUnit, } from "@configura/web-utilities";
+import { AggregatedLoadingObservable, assert, assertDefined, compareArrays, count, Observable, toLengthUnit, } from "@configura/web-utilities";
 import { CfgMeasureDefinition } from "./CfgMeasure.js";
 import { ProductConfigurationBubbleMode } from "./productConfiguration/CfgOption.js";
 import { CfgProductConfiguration } from "./productConfiguration/CfgProductConfiguration.js";
 import { collectAdditionalProductRefs } from "./productConfiguration/utilitiesProductConfiguration.js";
 import { wrapWithCache } from "./productLoader.js";
-import { comparePricesObjects, correctDefaultsOnCatalogueParams, makeProductKey, } from "./utilitiesCatalogueData.js";
+import { SyncGroupsHandler } from "./syncGroups/SyncGroupsHandler.js";
+import { comparePricesObjects, correctDefaultsOnCatalogueParams, isSameProductRef, makeProductKey, } from "./utilitiesCatalogueData.js";
 function completeSettings(incompleteSettings) {
     var _a, _b;
     return {
         strictSelectOneSelectionCount: (_a = incompleteSettings === null || incompleteSettings === void 0 ? void 0 : incompleteSettings.strictSelectOneSelectionCount) !== null && _a !== void 0 ? _a : false,
         strictSetApiSelectionMatch: (_b = incompleteSettings === null || incompleteSettings === void 0 ? void 0 : incompleteSettings.strictSetApiSelectionMatch) !== null && _b !== void 0 ? _b : false,
+        syncGroupsApplyMode: incompleteSettings === null || incompleteSettings === void 0 ? void 0 : incompleteSettings.syncGroupsApplyMode,
     };
 }
 /**
@@ -50,7 +52,7 @@ function isDescriptionMatch(l, r) {
  * the class that should be used and interacted with.
  */
 export class _CfgProductInternal {
-    constructor(initSuccess, initFail, _productLoaderRaw, lang, catId, partNumber, settings, optional, selected, rootFeatureRefs, allRawFeatures, uuid, _rawUnit, _rawProductData, apiSelection, loadingObservable, refKey, refDescription, parent, root, transform, anchor) {
+    constructor(initSuccess, initFail, _productLoaderRaw, lang, catId, partNumber, settings, optional, selected, rootFeatureRefs, allRawFeatures, uuid, _rawUnit, _rawProductData, apiSelection, loadingObservable, refKey, refDescription, parent, root, transform, anchor, _syncGroupHandler) {
         this._productLoaderRaw = _productLoaderRaw;
         this.lang = lang;
         this.catId = catId;
@@ -65,6 +67,7 @@ export class _CfgProductInternal {
         this.parent = parent;
         this.transform = transform;
         this.anchor = anchor;
+        this._syncGroupHandler = _syncGroupHandler;
         this._destroyed = false;
         this.additionalProducts = [];
         this.changeObservable = new Observable();
@@ -76,31 +79,31 @@ export class _CfgProductInternal {
                 additionalProduct.destroy();
             }
         };
-        this._notifyAllOfChange = (bubbleMode, committed) => __awaiter(this, void 0, void 0, function* () {
+        this._notifyAllOfChange = (bubbleMode) => __awaiter(this, void 0, void 0, function* () {
             if (bubbleMode === CfgProductBubbleMode.Stop) {
                 return;
             }
             const parent = this.parent;
             const freshRef = CfgProduct._makeNewRefFrom(this);
-            this.changeObservable.notifyAll({ freshRef, committed });
+            this.changeObservable.notifyAll({ freshRef });
             if (parent !== undefined) {
                 yield parent._additionalProductHasChanged(freshRef, bubbleMode === CfgProductBubbleMode.OneLevel
                     ? CfgProductBubbleMode.Stop
-                    : bubbleMode, committed);
+                    : bubbleMode);
             }
         });
         /** Called when a child (additional product or the configuration) has changed. */
-        this._childHasChanged = (bubbleMode, committed) => __awaiter(this, void 0, void 0, function* () {
+        this._childHasChanged = (bubbleMode) => __awaiter(this, void 0, void 0, function* () {
             if (bubbleMode === CfgProductBubbleMode.ToRootAndBubbleSelected &&
                 this.optional &&
                 !this.selected) {
                 yield this.setSelected(true, bubbleMode);
                 return;
             }
-            yield this._notifyAllOfChange(bubbleMode, committed);
+            yield this._notifyAllOfChange(bubbleMode);
         });
         /** Called by child to tell its parent that it has changed. */
-        this._additionalProductHasChanged = (freshRef, bubbleMode, committed) => __awaiter(this, void 0, void 0, function* () {
+        this._additionalProductHasChanged = (freshRef, bubbleMode) => __awaiter(this, void 0, void 0, function* () {
             const i = this.additionalProducts.findIndex((a) => a.isBackedBySame(freshRef));
             if (i !== -1) {
                 // Child additional product might not be found. This probably means that propagate
@@ -110,31 +113,34 @@ export class _CfgProductInternal {
                 // C no longer is part of the tree. Odd, but fully permitted.
                 this.additionalProducts[i] = freshRef;
             }
-            yield this._childHasChanged(bubbleMode, committed);
+            yield this._childHasChanged(bubbleMode);
         });
         /** Called by the configuration to tell its parent that it has changed. */
-        this._configurationHasChanged = (freshRef, bubbleMode, committed) => __awaiter(this, void 0, void 0, function* () {
+        this._configurationHasChanged = (freshRef, bubbleMode) => __awaiter(this, void 0, void 0, function* () {
             this._configuration = freshRef;
             switch (bubbleMode) {
                 case ProductConfigurationBubbleMode.ValidateAndBubbleSelected:
                     // The revalidate call will continue the bubble
-                    yield this._revalidate(CfgProductBubbleMode.ToRootAndBubbleSelected, this._productLoaderRaw, committed);
+                    yield this._revalidate(CfgProductBubbleMode.ToRootAndBubbleSelected, this._productLoaderRaw);
+                    return;
+                case ProductConfigurationBubbleMode.BubbleSelected:
+                    yield this._childHasChanged(CfgProductBubbleMode.ToRootAndBubbleSelected);
                     return;
                 case ProductConfigurationBubbleMode.Validate:
                     // The revalidate call will continue the bubble
-                    yield this._revalidate(CfgProductBubbleMode.ToRoot, this._productLoaderRaw, committed);
+                    yield this._revalidate(CfgProductBubbleMode.ToRoot, this._productLoaderRaw);
                     return;
                 case ProductConfigurationBubbleMode.ToParentProduct:
                     // Do not continue bubble as we have reached the parent CfgProduct
                     return;
                 case ProductConfigurationBubbleMode.OneLevel:
-                    yield this._childHasChanged(CfgProductBubbleMode.OneLevel, committed);
+                    yield this._childHasChanged(CfgProductBubbleMode.OneLevel);
                     return;
                 case ProductConfigurationBubbleMode.Stop:
-                    yield this._childHasChanged(CfgProductBubbleMode.Stop, committed);
+                    yield this._childHasChanged(CfgProductBubbleMode.Stop);
                     return;
                 case ProductConfigurationBubbleMode.ToRoot:
-                    yield this._childHasChanged(CfgProductBubbleMode.ToRoot, committed);
+                    yield this._childHasChanged(CfgProductBubbleMode.ToRoot);
                     return;
             }
         });
@@ -145,13 +151,27 @@ export class _CfgProductInternal {
             additionalProducts: this.additionalProducts.map((additionalProduct) => additionalProduct.getApiSelection()),
         });
         this.setApiSelection = (s, doValidate, productLoaderForGroupedLoad) => __awaiter(this, void 0, void 0, function* () {
+            return this._setApiSelectionWithOtherProduct(s, doValidate, productLoaderForGroupedLoad, undefined);
+        });
+        this.copyFrom = (otherProduct, doValidate, productLoaderForGroupedLoad) => __awaiter(this, void 0, void 0, function* () {
+            return yield this._setApiSelectionWithOtherProduct(otherProduct.getApiSelection(), doValidate, productLoaderForGroupedLoad, otherProduct);
+        });
+        this._setApiSelectionWithOtherProduct = (s, doValidate, productLoaderForGroupedLoad, sourceProduct) => __awaiter(this, void 0, void 0, function* () {
             // Wrap with cache will make getProduct for this function call use the same server call
             // for the same product with the same params. Used for getProduct (when a new additional
             // product is loaded) and postValidate.
             productLoaderForGroupedLoad =
                 productLoaderForGroupedLoad || wrapWithCache(this._productLoaderRaw);
+            let change = false;
+            if (sourceProduct !== undefined) {
+                this._rawProductData = sourceProduct.rawProductData;
+                this.configuration._internal.populateFeatures(sourceProduct.configuration.rootFeatureRefs);
+                change = true; // We can not know if this is an actual change, so we assume it is
+            }
             const configurationChange = yield this.configuration._internal.setApiSelection(s.selOptions, false);
-            let change = configurationChange;
+            if (configurationChange) {
+                change = true;
+            }
             if (this.optional) {
                 if (yield this.setSelected(s.selected !== false, CfgProductBubbleMode.Stop)) {
                     change = true;
@@ -165,35 +185,37 @@ export class _CfgProductInternal {
             if (apiSelectionAdditionalProductsCount !== additionalProductsCount) {
                 throw new Error(`Additional products are not same length. This product: "${this.key}". This product additional products count: ${additionalProductsCount}. Passed apiSelection additional products count: ${apiSelectionAdditionalProductsCount}`);
             }
-            if ((yield Promise.all(apiSelectionAdditionalProducts.map((apiSelectionChild) => {
-                const refKey = apiSelectionChild.refKey;
-                if (refKey === undefined) {
-                    throw new Error("Additional product api configurations must have refKey.");
-                }
+            const sourceProductAdditionalProducts = sourceProduct === null || sourceProduct === void 0 ? void 0 : sourceProduct.additionalProducts;
+            assert(!sourceProductAdditionalProducts ||
+                additionalProductsCount === sourceProductAdditionalProducts.length, `Passed sourceProduct does not have the same number of additional products as this.`);
+            if ((yield Promise.all(apiSelectionAdditionalProducts.map((apiSelectionAdditionalProduct, index) => {
+                var _a;
+                const refKey = apiSelectionAdditionalProduct.refKey;
+                assertDefined(refKey, "Additional product api configurations must have refKey.");
                 const i = additionalProducts.findIndex((a) => refKey === a.refKey);
-                if (i === -1) {
-                    throw new Error(`Additional product not found. This product: "${this.key}". refKey of not found additional product: "${refKey}"`);
+                assert(i !== -1, `Additional product not found. This product: "${this.key}". refKey of not found additional product: "${refKey}"`);
+                let sourceProductAdditionalProduct = undefined;
+                if (sourceProductAdditionalProducts !== undefined) {
+                    sourceProductAdditionalProduct =
+                        (_a = sourceProductAdditionalProducts.find((a) => refKey === a.refKey)) === null || _a === void 0 ? void 0 : _a._internal;
+                    assertDefined(sourceProductAdditionalProduct, "Additional product not found in sourceProduct");
                 }
                 const additionalProduct = additionalProducts.splice(i, 1)[0]; // Splicing like this is okay because this is done synchronous. The setCon. is what is async.
-                return additionalProduct._internal.setApiSelection(apiSelectionChild, doValidate, productLoaderForGroupedLoad);
+                return additionalProduct._internal._setApiSelectionWithOtherProduct(apiSelectionAdditionalProduct, doValidate, productLoaderForGroupedLoad, sourceProductAdditionalProduct);
             }))).some((b) => b)) {
                 change = true;
             }
             if (doValidate && configurationChange) {
-                yield this._revalidate(CfgProductBubbleMode.ToRoot, productLoaderForGroupedLoad, true);
+                yield this._revalidate(CfgProductBubbleMode.ToRoot, productLoaderForGroupedLoad);
             }
             else if (change) {
                 // As setApiSelection is done recursively each level takes care of its own notifications
                 // so we only need to bubble one level to notify this and swap out the reference in the
                 // parent.
-                yield this._notifyAllOfChange(CfgProductBubbleMode.OneLevel, true);
+                yield this._notifyAllOfChange(CfgProductBubbleMode.OneLevel);
             }
             return change;
         });
-        this.getApiSelectionAsString = () => JSON.stringify(this.getApiSelection(), undefined, "");
-        this.setFromApiSelectionString = (str, doValidate, productLoaderForGroupedLoad) => __awaiter(this, void 0, void 0, function* () {
-            return this.setApiSelection(JSON.parse(decodeURIComponent(str)), doValidate, productLoaderForGroupedLoad);
-        });
         this.structureCompare = (other, strictOrder = true, descriptionMatch = false) => {
             if (!this.configuration.structureCompare(other.configuration, strictOrder, descriptionMatch)) {
                 return false;
@@ -216,10 +238,10 @@ export class _CfgProductInternal {
             const configurationChange = yield this.configuration._internal.tryMatchSelection(other.configuration._internal, descriptionMatch, false);
             if (configurationChange) {
                 change = true;
-                yield this._revalidate(CfgProductBubbleMode.ToRootAndBubbleSelected, productLoaderForGroupedLoad, true);
+                yield this._revalidate(CfgProductBubbleMode.ToRootAndBubbleSelected, productLoaderForGroupedLoad);
             }
             else if (change) {
-                yield this._notifyAllOfChange(CfgProductBubbleMode.ToRootAndBubbleSelected, true);
+                yield this._notifyAllOfChange(CfgProductBubbleMode.ToRootAndBubbleSelected);
             }
             const thisAdditionalProducts = this.additionalProducts;
             const otherAdditionalProducts = other.additionalProducts;
@@ -268,12 +290,13 @@ export class _CfgProductInternal {
          * product in isolation. The validation result is applied on the configuration. Then additional
          * products are synced (unloaded, loaded etc.) Finally the changes bubble up the tree.
          */
-        this._revalidate = (bubbleMode, productLoader, committed) => __awaiter(this, void 0, void 0, function* () {
+        this._revalidate = (bubbleMode, productLoader) => __awaiter(this, void 0, void 0, function* () {
             const { _configuration: configuration } = this;
             const token = this.loadingObservable.startChildLoading();
             this._revalidateInProgressToken = token;
             try {
                 const response = yield productLoader.postValidate(Object.assign(Object.assign({ lang: this.lang }, correctDefaultsOnCatalogueParams(this.catId)), { partNumber: this.partNumber }), { selOptions: configuration.getApiSelection() });
+                const requestDidValidate = response.validated;
                 // The revalidateInProgressToken is used to know if some other revalidate
                 // call has happened after this call, thereby making this call obsolete.
                 // This is a bit crude in that it does not actually cancel previous validate
@@ -282,7 +305,7 @@ export class _CfgProductInternal {
                 // of all, the heavy work happens on the server, and that work will not be
                 // cancelled even if we would cancel the call.
                 if (this._revalidateInProgressToken !== token) {
-                    return false;
+                    return { wasAborted: true, requestDidValidate };
                 }
                 // After a successful validate-call we will always assume there
                 // is a change. It would be possible to compare relevant parts
@@ -290,7 +313,7 @@ export class _CfgProductInternal {
                 // syndAndLoad, however the code comparing productData would be fragile
                 // and likely to break if new data-fields were added.
                 if (this._destroyed) {
-                    return false;
+                    return { wasAborted: true, requestDidValidate };
                 }
                 const { productData, rootFeatureRefs } = response;
                 const pricesUpdated = !comparePricesObjects(this.prices, productData.partsData.prices);
@@ -305,10 +328,10 @@ export class _CfgProductInternal {
                 yield configuration._internal.setApiSelection(productData.partsData.selOptions || [], false);
                 yield this._syncAndLoadAdditionalProducts(productLoader);
                 if (this._destroyed) {
-                    return false;
+                    return { wasAborted: true, requestDidValidate };
                 }
-                yield this._notifyAllOfChange(bubbleMode, committed);
-                return true;
+                yield this._notifyAllOfChange(bubbleMode);
+                return { wasAborted: false, requestDidValidate };
             }
             catch (e) {
                 throw e;
@@ -326,7 +349,14 @@ export class _CfgProductInternal {
             const additionalProductRefs = [
                 ...(productData.additionalProductRefs || []),
                 ...collectAdditionalProductRefs(configuration),
-            ].map((prodRef, originalIndex) => ({
+            ]
+                .reduce((a, c) => {
+                if (a.every((p) => !isSameProductRef(p, c))) {
+                    a.push(c);
+                }
+                return a;
+            }, [])
+                .map((prodRef, originalIndex) => ({
                 prodRef,
                 originalIndex,
             }));
@@ -372,7 +402,7 @@ export class _CfgProductInternal {
                 this.loadingObservable.stopChildLoading(token);
             }
         });
-        this.root = root || this;
+        this.root = root !== null && root !== void 0 ? root : this;
         this.key = makeProductKey(catId, refKey || partNumber);
         this._selected = optional ? selected : undefined;
         this.isAdditionalProduct = parent !== undefined;
@@ -384,9 +414,10 @@ export class _CfgProductInternal {
     clone(parent, root) {
         return __awaiter(this, void 0, void 0, function* () {
             const product = yield new Promise((initSuccess, initFail) => {
+                var _a;
                 const p = new _CfgProductInternal(() => {
                     initSuccess(p);
-                }, initFail, this._productLoaderRaw, this.lang, this.catId, this.partNumber, this.settings, this.optional, this.selected, this._configuration.rootFeatureRefs, this._configuration.allRawFeatures, this.uuid, this._rawUnit, this._rawProductData, this.configuration.getApiSelection(), new AggregatedLoadingObservable(), this.refKey, this.refDescription, parent, root, this.transform, this.anchor);
+                }, initFail, this._productLoaderRaw, this.lang, this.catId, this.partNumber, this.settings, this.optional, this.selected, this._configuration.rootFeatureRefs, this._configuration.allRawFeatures, this.uuid, this._rawUnit, this._rawProductData, this.configuration.getApiSelection(), new AggregatedLoadingObservable(), this.refKey, this.refDescription, parent, root, this.transform, this.anchor, (_a = this._syncGroupHandler) === null || _a === void 0 ? void 0 : _a.clone());
             });
             for (const additionalProduct of this.additionalProducts) {
                 product.additionalProducts.push(CfgProduct._makeNewRefFrom(yield additionalProduct._internal.clone(product, root || product)));
@@ -465,7 +496,7 @@ export class _CfgProductInternal {
                 return false;
             }
             this._selected = v;
-            yield this._notifyAllOfChange(bubbleMode, true);
+            yield this._notifyAllOfChange(bubbleMode);
             return true;
         });
     }
@@ -498,6 +529,9 @@ export class _CfgProductInternal {
             ? this.visibleIfAdditionalProduct
             : this.visibleIfMainProduct;
     }
+    get syncGroupHandler() {
+        return this.root._syncGroupHandler;
+    }
 }
 _CfgProductInternal.make = (productLoaderRaw, productLoaderForGroupedLoad, // Used when instantiating the current product
 lang, catId, partNumber, settings, optional, loadingObservable, refKey, refDescription, parent, root, transform, anchor) => __awaiter(void 0, void 0, void 0, function* () {
@@ -506,6 +540,7 @@ lang, catId, partNumber, settings, optional, loadingObservable, refKey, refDescr
     // at this initial load.
     productLoaderForGroupedLoad =
         productLoaderForGroupedLoad || wrapWithCache(productLoaderRaw);
+    const syncGroupHandler = root === undefined ? SyncGroupsHandler.make(settings.syncGroupsApplyMode) : undefined;
     const productResponse = yield productLoaderForGroupedLoad.getProduct(Object.assign(Object.assign({ lang }, correctDefaultsOnCatalogueParams(catId)), { partNumber }));
     const { productData, rootFeatureRefs, features: allRawFeatures, uuid, unit, } = productResponse;
     const product = yield new Promise((initSuccess, initFail) => {
@@ -514,9 +549,11 @@ lang, catId, partNumber, settings, optional, loadingObservable, refKey, refDescr
             // But we can not set the api selection synchronously. And the product configuration needs "this". So we use this callback.
             // Feel free to find a nicer more readable solution :)
             initSuccess(p);
-        }, initFail, productLoaderRaw, lang, catId, partNumber, settings, optional, !optional, rootFeatureRefs, allRawFeatures, uuid, unit, productData, productData.partsData.selOptions || [], loadingObservable, refKey, refDescription, parent, root, transform, anchor);
+        }, initFail, productLoaderRaw, lang, catId, partNumber, settings, optional, !optional, rootFeatureRefs, allRawFeatures, uuid, unit, productData, productData.partsData.selOptions || [], loadingObservable, refKey, refDescription, parent, root, transform, anchor, syncGroupHandler);
     });
     yield product._syncAndLoadAdditionalProducts(productLoaderForGroupedLoad);
+    // Product is guaranteed to be root
+    yield (syncGroupHandler === null || syncGroupHandler === void 0 ? void 0 : syncGroupHandler.init(product, productLoaderForGroupedLoad));
     return product;
 });
 export class CfgProduct {
@@ -558,8 +595,6 @@ export class CfgProduct {
          */
         this.getApiSelection = () => this._internal.getApiSelection();
         this.setApiSelection = (s, doValidate = false) => __awaiter(this, void 0, void 0, function* () { return yield this._internal.setApiSelection(s, doValidate); });
-        this.getApiSelectionAsString = () => this._internal.getApiSelectionAsString();
-        this.setFromApiSelectionString = (str, doValidate = false) => __awaiter(this, void 0, void 0, function* () { return yield this._internal.setFromApiSelectionString(str, doValidate); });
         this.listenForChange = (l) => this._internal.changeObservable.listen(l);
         this.stopListenForChange = (l) => this._internal.changeObservable.stopListen(l);
         this.stopAllListenForChange = () => this._internal.changeObservable.stopAllListen();
@@ -574,7 +609,7 @@ export class CfgProduct {
     }
     /**
      * Makes an object wrapping the passed object. This is not a clone method, it is a method to
-     * make a new outer reference. Like a shallow copy./ We use this to help frameworks that are
+     * make a new outer reference. Like a shallow copy. We use this to help frameworks that are
      * build around using equals to detect change.
      */
     static _makeNewRefFrom(source) {

package/dist/index.d.ts

@@ -1,9 +1,5 @@
 export * from "./CatalogueAPI.js";
 export * from "./CfgProduct.js";
-export * from "./io/CfgHistoryManager.js";
-export * from "./io/CfgHistoryToProdConfConnector.js";
-export * from "./io/CfgWindowMessageManager.js";
-export * from "./io/CfgWindowMessageToProdConfConnector.js";
 export * from "./material/CfgMaterialMapping.js";
 export * from "./material/CfgMtrlApplication.js";
 export * from "./material/CfgMtrlApplicationSource.js";
@@ -15,6 +11,8 @@ export * from "./productConfiguration/CfgProductConfiguration.js";
 export * from "./productConfiguration/filters.js";
 export * from "./productConfiguration/productParamsGenerator.js";
 export * from "./productLoader.js";
+export * from "./syncGroups/SyncGroupsApplyMode.js";
+export * from "./syncGroups/SyncGroupsHandler.js";
 export * from "./tasks/formats.js";
 export * from "./tasks/TaskHandler.js";
 export * from "./utilitiesCatalogueData.js";

package/dist/index.js

@@ -1,9 +1,5 @@
 export * from "./CatalogueAPI.js";
 export * from "./CfgProduct.js";
-export * from "./io/CfgHistoryManager.js";
-export * from "./io/CfgHistoryToProdConfConnector.js";
-export * from "./io/CfgWindowMessageManager.js";
-export * from "./io/CfgWindowMessageToProdConfConnector.js";
 export * from "./material/CfgMaterialMapping.js";
 export * from "./material/CfgMtrlApplication.js";
 export * from "./material/CfgMtrlApplicationSource.js";
@@ -15,6 +11,8 @@ export * from "./productConfiguration/CfgProductConfiguration.js";
 export * from "./productConfiguration/filters.js";
 export * from "./productConfiguration/productParamsGenerator.js";
 export * from "./productLoader.js";
+export * from "./syncGroups/SyncGroupsApplyMode.js";
+export * from "./syncGroups/SyncGroupsHandler.js";
 export * from "./tasks/formats.js";
 export * from "./tasks/TaskHandler.js";
 export * from "./utilitiesCatalogueData.js";

package/dist/productConfiguration/CfgFeature.d.ts

@@ -1,5 +1,5 @@
 import { LengthUnit, Observable, SingleArgCallback } from "@configura/web-utilities";
-import { Feature, SelectedOption } from "../CatalogueAPI.js";
+import { Feature, SelectedOption, SyncGroup } from "../CatalogueAPI.js";
 import { CfgProduct, _CfgProductInternal } from "../CfgProduct.js";
 import { CfgMtrlApplication } from "../material/CfgMtrlApplication.js";
 import { CfgOption, ProductConfigurationBubbleMode, _CfgOptionInternal } from "./CfgOption.js";
@@ -49,6 +49,7 @@ export declare class _CfgFeatureInternal {
     get isUseNumericValue(): boolean;
     get numericValue(): number | undefined;
     setNumericValue: (val: number) => Promise<boolean>;
+    get syncGroup(): SyncGroup | undefined;
     get description(): string;
     /**
      * The MeasureParam class is re-used for different purposes. In Features it is used

package/dist/productConfiguration/CfgFeature.js

@@ -7,10 +7,12 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import { compareArrays, convertLength, count, Observable, someMatch, toLengthUnit, } from "@configura/web-utilities";
+import { assertDefined, compareArrays, convertLength, count, Observable, someMatch, toLengthUnit, } from "@configura/web-utilities";
 import { CfgProduct } from "../CfgProduct.js";
 import { CfgMtrlApplication } from "../material/CfgMtrlApplication.js";
 import { CfgMtrlApplicationSource } from "../material/CfgMtrlApplicationSource.js";
+import { wrapWithCache } from "../productLoader.js";
+import { SyncGroupsPathHelper } from "../syncGroups/SyncGroupsPathHelper.js";
 import { CfgOption, ProductConfigurationBubbleMode } from "./CfgOption.js";
 import { _CfgProductConfigurationInternal } from "./CfgProductConfiguration.js";
 import { getMtrlPreview } from "./utilitiesProductConfiguration.js";
@@ -86,9 +88,9 @@ export class _CfgFeatureInternal {
             if (bubbleMode === ProductConfigurationBubbleMode.Stop) {
                 return;
             }
+            const parent = this.parent;
             const freshRef = CfgFeature._makeNewRefFrom(this);
             this.changeObservable.notifyAll({ freshRef });
-            const parent = this.parent;
             if (parent !== undefined) {
                 yield parent._childHasChanged(freshRef, bubbleMode === ProductConfigurationBubbleMode.OneLevel
                     ? ProductConfigurationBubbleMode.Stop
@@ -306,6 +308,13 @@ export class _CfgFeatureInternal {
          * Using a validate bubbleMode will cause validation calls to the server.
          */
         this.selectOption = (optionInternal, on, bubbleMode) => __awaiter(this, void 0, void 0, function* () {
+            if (bubbleMode ===
+                ProductConfigurationBubbleMode.ValidateAndBubbleSelectedAndApplySyncGroups) {
+                const product = this.rootProduct;
+                const syncGroupHandler = product.syncGroupHandler;
+                assertDefined(syncGroupHandler, `Sync group handler is required for bubble mode ${ProductConfigurationBubbleMode.ValidateAndBubbleSelectedAndApplySyncGroups}`);
+                return yield syncGroupHandler.selectOption(product, SyncGroupsPathHelper.getPath(optionInternal), on, wrapWithCache(product._productLoaderRaw));
+            }
             if (!on) {
                 if (this.selectionType === SelectionType.Group) {
                     throw new Error(`Multiple features are always selected and are not user selectable. Feature key: "${this.key}".`);
@@ -357,11 +366,18 @@ export class _CfgFeatureInternal {
             if (isAllOptionsAffectedByAnySelection) {
                 this._freshRefAllOptions();
             }
-            // If this was a deselect action we shall not bubble selected, that is, we shall not
-            // select the ancestors if this action was deselect.
-            yield this._notifyAllOfChange(!on && bubbleMode === ProductConfigurationBubbleMode.ValidateAndBubbleSelected
-                ? ProductConfigurationBubbleMode.Validate
-                : bubbleMode);
+            let nextLevelBubbleMode = bubbleMode;
+            if (!on) {
+                // If this was a deselect action we shall not bubble selected, that is, we shall not
+                // select the ancestors if this action was deselect.
+                if (bubbleMode === ProductConfigurationBubbleMode.ValidateAndBubbleSelected) {
+                    nextLevelBubbleMode = ProductConfigurationBubbleMode.Validate;
+                }
+                else if (bubbleMode === ProductConfigurationBubbleMode.BubbleSelected) {
+                    nextLevelBubbleMode = ProductConfigurationBubbleMode.ToRoot;
+                }
+            }
+            yield this._notifyAllOfChange(nextLevelBubbleMode);
             return isActualChange;
         });
         this.isSelected = (option) => this.selectionType === SelectionType.Group ||
@@ -412,6 +428,9 @@ export class _CfgFeatureInternal {
         }
         return value;
     }
+    get syncGroup() {
+        return this.rawFeature.syncGroup;
+    }
     get description() {
         return this.rawFeature.description;
     }
@@ -531,7 +550,7 @@ export class CfgFeature {
          * Calling this will cause a validation call to the server.
          */
         this.selectOption = (option, on) => __awaiter(this, void 0, void 0, function* () {
-            return yield this._internal.selectOption(option._internal, on, ProductConfigurationBubbleMode.ValidateAndBubbleSelected);
+            return yield this._internal.selectOption(option._internal, on, ProductConfigurationBubbleMode.ValidateAndBubbleSelectedAndApplySyncGroups);
         });
         this.isSelected = (option) => this._internal.isSelected(option._internal);
         this.listenForChange = (l) => this._internal.changeObservable.listen(l);