@shoper/phoenix_design_system 1.18.11-5 → 1.18.11-7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/build/cjs/packages/phoenix/src/components/accordion/accordion_content.js +34 -10
  2. package/build/cjs/packages/phoenix/src/components/accordion/accordion_content.js.map +1 -1
  3. package/build/esm/packages/phoenix/src/components/accordion/accordion_content.js +34 -10
  4. package/build/esm/packages/phoenix/src/components/accordion/accordion_content.js.map +1 -1
  5. package/package.json +2 -2
package/build/cjs/packages/phoenix/src/components/accordion/accordion_content.js CHANGED
@@ -5,6 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var tslib_es6 = require('../../../../../external/tslib/tslib.es6.js');
6
6
  require('lit');
7
7
  var decorators = require('lit/decorators');
8
+ var utilities = require('@dreamcommerce/utilities');
8
9
  var phoenix_light_lit_element = require('../../core/phoenix_light_lit_element/phoenix_light_lit_element.js');
9
10
  var phoenix_custom_element = require('../../core/decorators/phoenix_custom_element.js');
10
11
  var observer = require('../../core/classes/observer/observer.js');
@@ -48,7 +49,23 @@ exports.HAccordionContent = class HAccordionContent extends phoenix_light_lit_el
48
49
  window.clearTimeout(this._mutationDebounceTimer);
49
50
  }
50
51
  this._mutationDebounceTimer = window.setTimeout(() => {
51
- this._forceHeightRecalculation();
52
+ if (utilities.FeatureFlagUtils.isEnabled('dev_accordion_height_fix')) {
53
+ this._forceHeightRecalculation();
54
+ }
55
+ else {
56
+ requestAnimationFrame(() => {
57
+ this.style.height = 'auto';
58
+ requestAnimationFrame(() => {
59
+ this._setOriginalHeightValue();
60
+ if (this.hidden) {
61
+ this.style.height = '0px';
62
+ }
63
+ else {
64
+ this.style.height = this._originalHeight;
65
+ }
66
+ });
67
+ });
68
+ }
52
69
  }, MUTATION_DEBOUNCE_MS);
53
70
  };
54
71
  this._setOriginalHeightValue = () => {
@@ -88,6 +105,9 @@ exports.HAccordionContent = class HAccordionContent extends phoenix_light_lit_el
88
105
  this._subscribeObserver();
89
106
  window.addEventListener('resize', this._handleResize, { passive: true });
90
107
  this.addEventListener('transitionend', this._boundHandleTransitionEnd);
108
+ if (utilities.FeatureFlagUtils.isEnabled('dev_accordion_height_fix')) {
109
+ this._setupImageLoadListeners();
110
+ }
91
111
  }
92
112
  firstUpdated(props) {
93
113
  super.firstUpdated(props);
@@ -102,16 +122,18 @@ exports.HAccordionContent = class HAccordionContent extends phoenix_light_lit_el
102
122
  this._accordionGroupProps.subscribe(this._accordionGroupPropsObserver);
103
123
  this._mutationObserver = new MutationObserver(this._handleMutation);
104
124
  this._mutationObserver.observe(this, { childList: true, subtree: true });
105
- this._setupImageLoadListeners();
106
125
  }
107
126
  _forceHeightRecalculation() {
108
- if (this.hidden)
109
- return;
110
127
  requestAnimationFrame(() => {
111
128
  this.style.height = 'auto';
112
129
  requestAnimationFrame(() => {
113
130
  this._setOriginalHeightValue();
114
- this.style.height = this._originalHeight;
131
+ if (this.hidden) {
132
+ this.style.height = '0px';
133
+ }
134
+ else {
135
+ this.style.height = this._originalHeight;
136
+ }
115
137
  });
116
138
  });
117
139
  }
@@ -139,11 +161,13 @@ exports.HAccordionContent = class HAccordionContent extends phoenix_light_lit_el
139
161
  super.disconnectedCallback();
140
162
  (_a = this._accordionGroupProps) === null || _a === void 0 ? void 0 : _a.unsubscribe(this._accordionGroupPropsObserver);
141
163
  (_b = this._mutationObserver) === null || _b === void 0 ? void 0 : _b.disconnect();
142
- const images = this.querySelectorAll('img');
143
- images.forEach((img) => {
144
- img.removeEventListener('load', this._boundHandleImageLoad);
145
- img.removeEventListener('error', this._boundHandleImageLoad);
146
- });
164
+ if (utilities.FeatureFlagUtils.isEnabled('dev_accordion_height_fix')) {
165
+ const images = this.querySelectorAll('img');
166
+ images.forEach((img) => {
167
+ img.removeEventListener('load', this._boundHandleImageLoad);
168
+ img.removeEventListener('error', this._boundHandleImageLoad);
169
+ });
170
+ }
147
171
  window.removeEventListener('resize', this._handleResize);
148
172
  this.removeEventListener('transitionend', this._boundHandleTransitionEnd);
149
173
  if (this._resizeDebounceTimer !== null) {
package/build/cjs/packages/phoenix/src/components/accordion/accordion_content.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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_content.js CHANGED
@@ -1,6 +1,7 @@
1
1
  import { __decorate, __metadata } from '../../../../../external/tslib/tslib.es6.js';
2
2
  import 'lit';
3
3
  import { property } from 'lit/decorators';
4
+ import { FeatureFlagUtils } from '@dreamcommerce/utilities';
4
5
  import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
5
6
  import { phoenixCustomElement } from '../../core/decorators/phoenix_custom_element.js';
6
7
  import { Observer } from '../../core/classes/observer/observer.js';
@@ -44,7 +45,23 @@ let HAccordionContent = class HAccordionContent extends PhoenixLightLitElement {
44
45
  window.clearTimeout(this._mutationDebounceTimer);
45
46
  }
46
47
  this._mutationDebounceTimer = window.setTimeout(() => {
47
- this._forceHeightRecalculation();
48
+ if (FeatureFlagUtils.isEnabled('dev_accordion_height_fix')) {
49
+ this._forceHeightRecalculation();
50
+ }
51
+ else {
52
+ requestAnimationFrame(() => {
53
+ this.style.height = 'auto';
54
+ requestAnimationFrame(() => {
55
+ this._setOriginalHeightValue();
56
+ if (this.hidden) {
57
+ this.style.height = '0px';
58
+ }
59
+ else {
60
+ this.style.height = this._originalHeight;
61
+ }
62
+ });
63
+ });
64
+ }
48
65
  }, MUTATION_DEBOUNCE_MS);
49
66
  };
50
67
  this._setOriginalHeightValue = () => {
@@ -84,6 +101,9 @@ let HAccordionContent = class HAccordionContent extends PhoenixLightLitElement {
84
101
  this._subscribeObserver();
85
102
  window.addEventListener('resize', this._handleResize, { passive: true });
86
103
  this.addEventListener('transitionend', this._boundHandleTransitionEnd);
104
+ if (FeatureFlagUtils.isEnabled('dev_accordion_height_fix')) {
105
+ this._setupImageLoadListeners();
106
+ }
87
107
  }
88
108
  firstUpdated(props) {
89
109
  super.firstUpdated(props);
@@ -98,16 +118,18 @@ let HAccordionContent = class HAccordionContent extends PhoenixLightLitElement {
98
118
  this._accordionGroupProps.subscribe(this._accordionGroupPropsObserver);
99
119
  this._mutationObserver = new MutationObserver(this._handleMutation);
100
120
  this._mutationObserver.observe(this, { childList: true, subtree: true });
101
- this._setupImageLoadListeners();
102
121
  }
103
122
  _forceHeightRecalculation() {
104
- if (this.hidden)
105
- return;
106
123
  requestAnimationFrame(() => {
107
124
  this.style.height = 'auto';
108
125
  requestAnimationFrame(() => {
109
126
  this._setOriginalHeightValue();
110
- this.style.height = this._originalHeight;
127
+ if (this.hidden) {
128
+ this.style.height = '0px';
129
+ }
130
+ else {
131
+ this.style.height = this._originalHeight;
132
+ }
111
133
  });
112
134
  });
113
135
  }
@@ -135,11 +157,13 @@ let HAccordionContent = class HAccordionContent extends PhoenixLightLitElement {
135
157
  super.disconnectedCallback();
136
158
  (_a = this._accordionGroupProps) === null || _a === void 0 ? void 0 : _a.unsubscribe(this._accordionGroupPropsObserver);
137
159
  (_b = this._mutationObserver) === null || _b === void 0 ? void 0 : _b.disconnect();
138
- const images = this.querySelectorAll('img');
139
- images.forEach((img) => {
140
- img.removeEventListener('load', this._boundHandleImageLoad);
141
- img.removeEventListener('error', this._boundHandleImageLoad);
142
- });
160
+ if (FeatureFlagUtils.isEnabled('dev_accordion_height_fix')) {
161
+ const images = this.querySelectorAll('img');
162
+ images.forEach((img) => {
163
+ img.removeEventListener('load', this._boundHandleImageLoad);
164
+ img.removeEventListener('error', this._boundHandleImageLoad);
165
+ });
166
+ }
143
167
  window.removeEventListener('resize', this._handleResize);
144
168
  this.removeEventListener('transitionend', this._boundHandleTransitionEnd);
145
169
  if (this._resizeDebounceTimer !== null) {
package/build/esm/packages/phoenix/src/components/accordion/accordion_content.js.map CHANGED
@@ -1 +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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@shoper/phoenix_design_system",
3
3
  "packageManager": "yarn@3.2.0",
4
4
  "sideEffects": false,
5
- "version": "1.18.11-5",
5
+ "version": "1.18.11-7",
6
6
  "description": "phoenix design system",
7
7
  "author": "zefirek",
8
8
  "license": "MIT",
@@ -31,7 +31,7 @@
31
31
  "@splidejs/splide-extension-auto-scroll": "0.5.3"
32
32
  },
33
33
  "devDependencies": {
34
- "@dreamcommerce/utilities": "^1.23.2",
34
+ "@dreamcommerce/utilities": "^1.23.2-2",
35
35
  "@shoper/jest_config": "^0.0.0",
36
36
  "@shoper/tsconfig": "^0.0.0",
37
37
  "@splidejs/splide": "4.0.7",