@shoper/phoenix_design_system 1.18.10-0 → 1.18.10-2

package/build/cjs/packages/phoenix/src/index.js

@@ -78,8 +78,8 @@ var textarea_control = require('./components/form/textarea/textarea_control.js')
 var accordion_constants = require('./components/accordion/accordion_constants.js');
 var accordion = require('./components/accordion/accordion.js');
 var accordion_group = require('./components/accordion/accordion_group.js');
-var accordion_toggler = require('./components/accordion/accordion_toggler.js');
 var accordion_content = require('./components/accordion/accordion_content.js');
+var accordion_toggler = require('./components/accordion/accordion_toggler.js');
 var dropdown_close = require('./components/dropdown/dropdown_close.js');
 var toggle_button_group = require('./components/groups/toggle_button_group/toggle_button_group.js');
 var toggle_button = require('./components/groups/toggle_button_group/toggle_button.js');
@@ -468,6 +468,7 @@ Object.defineProperty(exports, 'HTextareaControl', {
 	}
 });
 exports.ACCORDION_ANIMATION_DURATION = accordion_constants.ACCORDION_ANIMATION_DURATION;
+exports.ACCORDION_CONTEXTS = accordion_constants.ACCORDION_CONTEXTS;
 exports.ACCORDION_CSS_CLASSES = accordion_constants.ACCORDION_CSS_CLASSES;
 exports.ACCORDION_EVENTS = accordion_constants.ACCORDION_EVENTS;
 exports.ACCORDION_MODE = accordion_constants.ACCORDION_MODE;
@@ -483,16 +484,16 @@ Object.defineProperty(exports, 'HAccordionGroup', {
 		return accordion_group.HAccordionGroup;
 	}
 });
-Object.defineProperty(exports, 'HAccordionToggler', {
+Object.defineProperty(exports, 'HAccordionContent', {
 	enumerable: true,
 	get: function () {
-		return accordion_toggler.HAccordionToggler;
+		return accordion_content.HAccordionContent;
 	}
 });
-Object.defineProperty(exports, 'HAccordionContent', {
+Object.defineProperty(exports, 'HAccordionToggler', {
 	enumerable: true,
 	get: function () {
-		return accordion_content.HAccordionContent;
+		return accordion_toggler.HAccordionToggler;
 	}
 });
 Object.defineProperty(exports, 'HDropdownClose', {

package/build/cjs/packages/phoenix/src/index.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/utilities/build/esm/packages/utilities/src/feature_flag_utils.js

@@ -0,0 +1,26 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var json_utils = require('./json_utils.js');
+
+class FeatureFlagUtils {
+    static _initialize() {
+        if (this._flags !== null)
+            return;
+        const $script = document.getElementById('featureFlags');
+        this._flags = $script ? this._toObjectFromJsonScriptTag($script) : null;
+    }
+    static _toObjectFromJsonScriptTag(scriptTag) {
+        const scriptContent = scriptTag.textContent;
+        return json_utils.JsonUtils.fromJson(scriptContent) || {};
+    }
+    static isEnabled(flagName) {
+        this._initialize();
+        return !!this._flags[flagName];
+    }
+}
+FeatureFlagUtils._flags = null;
+
+exports.FeatureFlagUtils = FeatureFlagUtils;
+//# sourceMappingURL=feature_flag_utils.js.map

package/build/cjs/packages/utilities/build/esm/packages/utilities/src/feature_flag_utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/utilities/build/esm/packages/utilities/src/json_utils.js

@@ -0,0 +1,25 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+class JsonUtils {
+    static toJson(value) {
+        try {
+            return JSON.stringify(value);
+        }
+        catch (error) {
+            console.error(error);
+        }
+    }
+    static fromJson(value) {
+        try {
+            return JSON.parse(value);
+        }
+        catch (error) {
+            console.error(error);
+        }
+    }
+}
+
+exports.JsonUtils = JsonUtils;
+//# sourceMappingURL=json_utils.js.map

package/build/cjs/packages/utilities/build/esm/packages/utilities/src/json_utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/phoenix/src/components/accordion/accordion.d.ts

@@ -3,8 +3,13 @@ import { PhoenixLightLitElement } from "../../core/phoenix_light_lit_element/pho
 export declare class HAccordion extends PhoenixLightLitElement implements IAccordion {
     disabled: boolean;
     mode: TAccordionMode;
-    updated(): void;
+    private _accordionSubject;
+    private _accordionContext;
+    private _isDevAccordionOptimizationFlagEnabled;
+    constructor();
     enable(): void;
     disable(): void;
+    updated(): void;
     notify(): void;
+    private _getProps;
 }

package/build/esm/packages/phoenix/src/components/accordion/accordion.js

@@ -2,16 +2,23 @@ import { __decorate, __metadata } from '../../../../../external/tslib/tslib.es6.
 import { property } from 'lit/decorators';
 import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
 import { phoenixCustomElement } from '../../core/decorators/phoenix_custom_element.js';
-import { ACCORDION_MODE, ACCORDION_EVENTS } from './accordion_constants.js';
+import { BehaviorSubject } from '../../core/classes/behavior_subject/behavior_subject.js';
+import { ContextProviderController } from '../../core/context/context_provider_controller.js';
+import { ACCORDION_MODE, ACCORDION_CONTEXTS, ACCORDION_EVENTS } from './accordion_constants.js';
+import { FeatureFlagUtils } from '../../../../utilities/build/esm/packages/utilities/src/feature_flag_utils.js';
 
 let HAccordion = class HAccordion extends PhoenixLightLitElement {
     constructor() {
-        super(...arguments);
+        super();
         this.disabled = false;
         this.mode = ACCORDION_MODE.multi;
-    }
-    updated() {
-        this.notify();
+        this._isDevAccordionOptimizationFlagEnabled = FeatureFlagUtils.isEnabled('dev_accordion_optimization');
+        if (!this._isDevAccordionOptimizationFlagEnabled) {
+            this._accordionSubject = new BehaviorSubject(this._getProps());
+            this._accordionContext = new ContextProviderController(this);
+            this._accordionContext.provide(ACCORDION_CONTEXTS.accordionProps, this._accordionSubject);
+            this.setAttribute('role', 'none');
+        }
     }
     enable() {
         this.disabled = false;
@@ -19,8 +26,22 @@ let HAccordion = class HAccordion extends PhoenixLightLitElement {
     disable() {
         this.disabled = true;
     }
+    updated() {
+        this.notify();
+    }
     notify() {
-        this.dispatchEvent(new Event(ACCORDION_EVENTS.update));
+        if (this._isDevAccordionOptimizationFlagEnabled) {
+            this.dispatchEvent(new Event(ACCORDION_EVENTS.update));
+        }
+        else {
+            this._accordionSubject.notify(this._getProps());
+        }
+    }
+    _getProps() {
+        return {
+            disabled: this.disabled,
+            mode: this.mode
+        };
     }
 };
 __decorate([
@@ -32,7 +53,8 @@ __decorate([
     __metadata("design:type", String)
 ], HAccordion.prototype, "mode", void 0);
 HAccordion = __decorate([
-    phoenixCustomElement('h-accordion')
+    phoenixCustomElement('h-accordion'),
+    __metadata("design:paramtypes", [])
 ], HAccordion);
 
 export { HAccordion };

package/build/esm/packages/phoenix/src/components/accordion/accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/phoenix/src/components/accordion/accordion_constants.d.ts

@@ -2,6 +2,10 @@ export declare const ACCORDION_EVENTS: {
     readonly toggle: "toggle";
     readonly update: "updateAccordion";
 };
+export declare const ACCORDION_CONTEXTS: {
+    accordionProps: string;
+    accordionGroupProps: string;
+};
 export declare const ACCORDION_CSS_CLASSES: {
     readonly open: "accordion__details_open";
 };

package/build/esm/packages/phoenix/src/components/accordion/accordion_constants.js

@@ -2,6 +2,10 @@ const ACCORDION_EVENTS = {
     toggle: 'toggle',
     update: 'updateAccordion'
 };
+const ACCORDION_CONTEXTS = {
+    accordionProps: 'accordionPropsSubject',
+    accordionGroupProps: 'accordionGroupPropsSubject'
+};
 const ACCORDION_CSS_CLASSES = {
     open: 'accordion__details_open'
 };
@@ -11,5 +15,5 @@ const ACCORDION_MODE = {
 };
 const ACCORDION_ANIMATION_DURATION = 400;
 
-export { ACCORDION_ANIMATION_DURATION, ACCORDION_CSS_CLASSES, ACCORDION_EVENTS, ACCORDION_MODE };
+export { ACCORDION_ANIMATION_DURATION, ACCORDION_CONTEXTS, ACCORDION_CSS_CLASSES, ACCORDION_EVENTS, ACCORDION_MODE };
 //# sourceMappingURL=accordion_constants.js.map

package/build/esm/packages/phoenix/src/components/accordion/accordion_constants.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/phoenix/src/components/accordion/accordion_content.d.ts

@@ -1,5 +1,29 @@
 import { PhoenixLightLitElement } from "../../core/phoenix_light_lit_element/phoenix_light_lit_element";
+import { PropertyValues } from 'lit';
 export declare class HAccordionContent extends PhoenixLightLitElement {
+    transitionName: string;
+    private _transitionController;
+    private _contextConsumer;
+    private _accordionGroupProps;
+    private _accordionGroupPropsObserver;
+    private _originalHeight;
+    private _resizeDebounceTimer;
+    private _mutationDebounceTimer;
+    private _mutationObserver;
+    private _boundHandleTransitionEnd;
+    private _isDevAccordionOptimizationFlagEnabled;
     constructor();
     connectedCallback(): void;
+    firstUpdated(props: PropertyValues): void;
+    private _handleResize;
+    private _setStylingOptions;
+    private _subscribeObserver;
+    private _handleMutation;
+    private _setOriginalHeightValue;
+    private _expand;
+    private _handleTransitionEnd;
+    private _collapse;
+    private _setHeight;
+    private _setAttributes;
+    disconnectedCallback(): void;
 }

package/build/esm/packages/phoenix/src/components/accordion/accordion_content.js

@@ -1,17 +1,166 @@
 import { __decorate, __metadata } from '../../../../../external/tslib/tslib.es6.js';
+import 'lit';
+import { property } from 'lit/decorators';
+import { UiDomUtils } from '@dreamcommerce/utilities';
 import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
 import { phoenixCustomElement } from '../../core/decorators/phoenix_custom_element.js';
+import { Observer } from '../../core/classes/observer/observer.js';
+import { ContextConsumerController } from '../../core/context/context_consumer_controller.js';
+import { ACCORDION_CONTEXTS } from './accordion_constants.js';
+import { FeatureFlagUtils } from '../../../../utilities/build/esm/packages/utilities/src/feature_flag_utils.js';
+import { HAccordion } from './accordion.js';
+import { TransitionController } from '../../controllers/transition_controller/transition_controller.js';
 
+const RESIZE_DEBOUNCE_MS = 150;
+const MUTATION_DEBOUNCE_MS = 100;
 let HAccordionContent = class HAccordionContent extends PhoenixLightLitElement {
     constructor() {
         super();
-        this.slot = this.hasAttribute('slot') ? this.slot : 'content';
+        this.transitionName = 'accordion-toggle';
+        this._resizeDebounceTimer = null;
+        this._mutationDebounceTimer = null;
+        this._mutationObserver = null;
+        this._handleResize = () => {
+            if (this._resizeDebounceTimer !== null) {
+                window.cancelAnimationFrame(this._resizeDebounceTimer);
+            }
+            this._resizeDebounceTimer = window.requestAnimationFrame(() => {
+                setTimeout(() => {
+                    this._setStylingOptions();
+                }, RESIZE_DEBOUNCE_MS);
+            });
+        };
+        this._setStylingOptions = () => {
+            requestAnimationFrame(() => {
+                const previousDisplay = this.style.display;
+                this.style.setProperty('display', 'block', 'important');
+                this.style.height = 'auto';
+                requestAnimationFrame(() => {
+                    this._setOriginalHeightValue();
+                    this.style.display = previousDisplay;
+                    this.style.height = this.hidden ? '0px' : this._originalHeight;
+                });
+            });
+        };
+        this._handleMutation = () => {
+            if (this._mutationDebounceTimer !== null) {
+                window.clearTimeout(this._mutationDebounceTimer);
+            }
+            this._mutationDebounceTimer = window.setTimeout(() => {
+                requestAnimationFrame(() => {
+                    this.style.height = 'auto';
+                    requestAnimationFrame(() => {
+                        this._setOriginalHeightValue();
+                        if (this.hidden) {
+                            this.style.height = '0px';
+                        }
+                        else {
+                            this.style.height = this._originalHeight;
+                        }
+                    });
+                });
+            }, MUTATION_DEBOUNCE_MS);
+        };
+        this._setOriginalHeightValue = () => {
+            const newHeight = this.getBoundingClientRect().height;
+            if (newHeight !== 0 || this.children.length === 0) {
+                this._originalHeight = `${newHeight}px`;
+            }
+        };
+        this._expand = () => {
+            this._setHeight(this._originalHeight);
+        };
+        this._handleTransitionEnd = (e) => {
+            if (this._isDevAccordionOptimizationFlagEnabled)
+                return;
+            if (e.propertyName !== 'height' || e.target !== this) {
+                return;
+            }
+            if (!this.hidden && this.style.height !== '0px') {
+                this.style.height = 'auto';
+            }
+        };
+        this._collapse = () => {
+            const currentHeight = this.getBoundingClientRect().height;
+            this._setHeight(`${currentHeight}px`);
+            requestAnimationFrame(() => {
+                requestAnimationFrame(() => {
+                    this._setHeight('0px');
+                });
+            });
+        };
+        this._isDevAccordionOptimizationFlagEnabled = FeatureFlagUtils.isEnabled('dev_accordion_optimization');
+        if (this._isDevAccordionOptimizationFlagEnabled) {
+            if (this.parentElement instanceof HAccordion) {
+                this.slot = this.hasAttribute('slot') ? this.slot : 'content';
+            }
+            else {
+                const contentToSlot = UiDomUtils.findParentByCondition(this, ($el) => $el.parentElement instanceof HAccordion);
+                contentToSlot === null || contentToSlot === void 0 ? void 0 : contentToSlot.setAttribute('slot', 'content');
+            }
+        }
+        else {
+            this.setAttribute('role', 'region');
+            this._boundHandleTransitionEnd = this._handleTransitionEnd.bind(this);
+        }
     }
     connectedCallback() {
         super.connectedCallback();
-        this.classList.add('accordion-content');
+        if (!this._isDevAccordionOptimizationFlagEnabled) {
+            this._contextConsumer = new ContextConsumerController(this);
+            this._transitionController = new TransitionController(this, this.transitionName);
+            this._subscribeObserver();
+            window.addEventListener('resize', this._handleResize, { passive: true });
+            this.addEventListener('transitionend', this._boundHandleTransitionEnd);
+        }
+        if (this._isDevAccordionOptimizationFlagEnabled) {
+            this.classList.add('accordion-content');
+        }
+    }
+    firstUpdated(props) {
+        super.firstUpdated(props);
+        if (!this._isDevAccordionOptimizationFlagEnabled) {
+            this._setStylingOptions();
+        }
+    }
+    async _subscribeObserver() {
+        this._accordionGroupProps = await this._contextConsumer.consumeAsync(ACCORDION_CONTEXTS.accordionGroupProps);
+        this._accordionGroupPropsObserver = new Observer((accordionProps) => {
+            this._setAttributes(accordionProps);
+            accordionProps.opened ? this._transitionController.show(this._expand) : this._transitionController.hide(this._collapse);
+        });
+        this._accordionGroupProps.subscribe(this._accordionGroupPropsObserver);
+        this._mutationObserver = new MutationObserver(this._handleMutation);
+        this._mutationObserver.observe(this, { childList: true, subtree: true });
+    }
+    _setHeight(height) {
+        this.style.height = height;
+    }
+    _setAttributes({ regionId, controlsId }) {
+        this.setAttribute('id', controlsId);
+        this.setAttribute('labelledby', regionId);
+    }
+    disconnectedCallback() {
+        var _a, _b;
+        super.disconnectedCallback();
+        if (!this._isDevAccordionOptimizationFlagEnabled) {
+            (_a = this._accordionGroupProps) === null || _a === void 0 ? void 0 : _a.unsubscribe(this._accordionGroupPropsObserver);
+            (_b = this._mutationObserver) === null || _b === void 0 ? void 0 : _b.disconnect();
+            window.removeEventListener('resize', this._handleResize);
+            this.removeEventListener('transitionend', this._boundHandleTransitionEnd);
+            if (this._resizeDebounceTimer !== null) {
+                window.cancelAnimationFrame(this._resizeDebounceTimer);
+            }
+            if (this._mutationDebounceTimer !== null) {
+                window.clearTimeout(this._mutationDebounceTimer);
+            }
+        }
     }
 };
+__decorate([
+    property(),
+    __metadata("design:type", Object)
+], HAccordionContent.prototype, "transitionName", void 0);
 HAccordionContent = __decorate([
     phoenixCustomElement('h-accordion-content'),
     __metadata("design:paramtypes", [])

package/build/esm/packages/phoenix/src/components/accordion/accordion_content.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/phoenix/src/components/accordion/accordion_group.d.ts

@@ -4,23 +4,37 @@ import { PropertyValues } from 'lit';
 export declare class HAccordionGroup extends PhoenixLightLitElement implements IAccordionGroup, IAccordion {
     opened: boolean;
     private _isDisabled;
+    private _regionId;
+    private _controlsId;
     private _mode;
+    private _accordionGroupPropsSubject;
+    private _accordionGroupContext;
+    private _accordionContextConsumer;
+    private _accordionProps;
+    private _accordionPropsObserver;
     private _$parentAccordion;
     private _detailsRef;
     private _togglerId;
+    private _isDevAccordionOptimizationFlagEnabled;
+    constructor();
     connectedCallback(): void;
     firstUpdated(props: PropertyValues): void;
+    private _subscribeObserver;
     disconnectedCallback(): void;
     private _syncWithParentAccordion;
-    private _handleSingleModeConstraint;
-    toggle(): void;
     show(): void;
     hide(): void;
-    private _hideOtherDetailsGroups;
     private _dispatchToggleEvent;
+    toggle(): void;
+    private _handleSingleModeConstraint;
+    private _hideOtherDetailsGroups;
     enable(): void;
     disable(): void;
+    private _accordionToggle;
+    private _closeOtherAccordionGroups;
     notify(): void;
+    protected updated(_changedProperties: Map<string, unknown>): void;
+    private _getProps;
     private _summaryClickHandler;
     protected render(): unknown;
 }