@shoper/phoenix_design_system 0.14.1 → 0.14.3

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 (28) hide show
  1. package/build/cjs/packages/phoenix/src/components/dropdown/dropdown.js +53 -11
  2. package/build/cjs/packages/phoenix/src/components/dropdown/dropdown.js.map +1 -1
  3. package/build/cjs/packages/phoenix/src/controllers/click_outside_controller/click_outside_controller.js +13 -2
  4. package/build/cjs/packages/phoenix/src/controllers/click_outside_controller/click_outside_controller.js.map +1 -1
  5. package/build/cjs/packages/phoenix/src/controllers/relative_position_controller/relative_position_calculator.js +7 -7
  6. package/build/cjs/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller.js +52 -47
  7. package/build/cjs/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller.js.map +1 -1
  8. package/build/cjs/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller_constants.js +7 -1
  9. package/build/cjs/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller_constants.js.map +1 -1
  10. package/build/esm/packages/phoenix/src/components/dropdown/dropdown.d.ts +8 -0
  11. package/build/esm/packages/phoenix/src/components/dropdown/dropdown.js +53 -11
  12. package/build/esm/packages/phoenix/src/components/dropdown/dropdown.js.map +1 -1
  13. package/build/esm/packages/phoenix/src/controllers/click_outside_controller/click_outside_controller.d.ts +6 -3
  14. package/build/esm/packages/phoenix/src/controllers/click_outside_controller/click_outside_controller.js +13 -2
  15. package/build/esm/packages/phoenix/src/controllers/click_outside_controller/click_outside_controller.js.map +1 -1
  16. package/build/esm/packages/phoenix/src/controllers/click_outside_controller/click_outside_controller_types.d.ts +5 -0
  17. package/build/esm/packages/phoenix/src/controllers/click_outside_controller/click_outside_controller_types.js +1 -0
  18. package/build/esm/packages/phoenix/src/controllers/click_outside_controller/click_outside_controller_types.js.map +1 -1
  19. package/build/esm/packages/phoenix/src/controllers/relative_position_controller/relative_position_calculator.d.ts +1 -1
  20. package/build/esm/packages/phoenix/src/controllers/relative_position_controller/relative_position_calculator.js +7 -7
  21. package/build/esm/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller.d.ts +5 -2
  22. package/build/esm/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller.js +53 -48
  23. package/build/esm/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller.js.map +1 -1
  24. package/build/esm/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller_constants.d.ts +4 -0
  25. package/build/esm/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller_constants.js +7 -2
  26. package/build/esm/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller_constants.js.map +1 -1
  27. package/build/esm/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller_types.d.ts +2 -2
  28. package/package.json +1 -1
package/build/cjs/packages/phoenix/src/components/dropdown/dropdown.js CHANGED
@@ -3,18 +3,19 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var tslib_es6 = require('../../../../../external/tslib/tslib.es6.js');
6
+ var global_constants = require('../../global_constants.js');
6
7
  var dropdown_constants = require('./dropdown_constants.js');
8
+ var relative_position_controller_constants = require('../../controllers/relative_position_controller/relative_position_controller_constants.js');
7
9
  var portal_constants = require('../portal/portal_constants.js');
8
10
  var lit = require('lit');
9
11
  var backdrop_constants = require('../backdrop/backdrop_constants.js');
10
- var global_constants = require('../../global_constants.js');
11
12
  var click_outside_controller_messages = require('../../controllers/click_outside_controller/click_outside_controller_messages.js');
12
13
  var click_outside_controller = require('../../controllers/click_outside_controller/click_outside_controller.js');
13
- var relative_position_controller_constants = require('../../controllers/relative_position_controller/relative_position_controller_constants.js');
14
14
  var phoenix_light_lit_element = require('../../core/phoenix_light_lit_element.js');
15
15
  var relative_position_controller = require('../../controllers/relative_position_controller/relative_position_controller.js');
16
16
  var phoenix_custom_element = require('../../core/decorators/phoenix_custom_element.js');
17
17
  var decorators = require('lit/decorators');
18
+ var lodash = require('../../../../../external/lodash/lodash.js');
18
19
 
19
20
  var HDropdown_1;
20
21
  exports.HDropdown = HDropdown_1 = class HDropdown extends phoenix_light_lit_element.PhoenixLightLitElement {
@@ -45,6 +46,7 @@ exports.HDropdown = HDropdown_1 = class HDropdown extends phoenix_light_lit_elem
45
46
  var _a;
46
47
  this._dispatchShowDropdownEvent();
47
48
  (_a = this.$dropdownContent) === null || _a === void 0 ? void 0 : _a.classList.remove(`${dropdown_constants.DROPDOWN_CONTENT_SHOW}-${this.transition}-start`, `${dropdown_constants.DROPDOWN_CONTENT_SHOW}-${this.transition}-end`);
49
+ this._toggleScroll();
48
50
  resolve();
49
51
  }, transitionDuration);
50
52
  });
@@ -57,10 +59,7 @@ exports.HDropdown = HDropdown_1 = class HDropdown extends phoenix_light_lit_elem
57
59
  this.dispatchEvent(showDropdownEvent);
58
60
  if (window.innerWidth >= global_constants.BREAKPOINTS.xs)
59
61
  return;
60
- const showBackdropEvent = new Event(backdrop_constants.BACKDROP_EVENTS.show, {
61
- bubbles: true
62
- });
63
- document.dispatchEvent(showBackdropEvent);
62
+ this._showBackdrop();
64
63
  };
65
64
  this.hide = async () => new Promise((resolve) => {
66
65
  var _a;
@@ -86,11 +85,11 @@ exports.HDropdown = HDropdown_1 = class HDropdown extends phoenix_light_lit_elem
86
85
  this.dispatchEvent(hideDropdownEvent);
87
86
  if (window.innerWidth >= global_constants.BREAKPOINTS.xs)
88
87
  return;
89
- const hideBackdropEvent = new Event(backdrop_constants.BACKDROP_EVENTS.hide, {
90
- bubbles: true
91
- });
92
- document.dispatchEvent(hideBackdropEvent);
88
+ this._hideBackdrop();
93
89
  };
90
+ this._observeScrollToggling = lodash["default"].throttle(() => {
91
+ this._toggleScroll();
92
+ }, relative_position_controller_constants.DEFAULT_THROTTLE_WAIT_TIME);
94
93
  this._hoverToggle = async (ev) => {
95
94
  if (window.innerWidth < global_constants.BREAKPOINTS.xs)
96
95
  return;
@@ -138,7 +137,7 @@ exports.HDropdown = HDropdown_1 = class HDropdown extends phoenix_light_lit_elem
138
137
  direction: this.direction,
139
138
  relativeElement: this.$dropdownToggler,
140
139
  elementToPosition: this.$dropdownContent,
141
- shouldDisablePositioning: () => window.innerWidth < global_constants.BREAKPOINTS.xs,
140
+ disablePositioningOnCondition: () => window.innerWidth < global_constants.BREAKPOINTS.xs,
142
141
  portalElementsNames: [dropdown_constants.DROPDOWN_CONTENT_NAME]
143
142
  });
144
143
  if (!this._clickOutsideController)
@@ -151,6 +150,7 @@ exports.HDropdown = HDropdown_1 = class HDropdown extends phoenix_light_lit_elem
151
150
  this.$hoverableDropdownContentElements = [...this.querySelectorAll(dropdown_constants.DROPDOWN_CONTENT_NAME)];
152
151
  }
153
152
  this._setupListeners();
153
+ this._setupInitialDropdownProperties();
154
154
  }
155
155
  static _appendDropdownPortal() {
156
156
  const $dropdownPortalTarget = document.querySelector(`[name="${dropdown_constants.DEFAULT_DROPDOWN_PORTAL_NAME}"]`);
@@ -163,7 +163,10 @@ exports.HDropdown = HDropdown_1 = class HDropdown extends phoenix_light_lit_elem
163
163
  _setupListeners() {
164
164
  var _a;
165
165
  this.addEventListener(click_outside_controller_messages.CLICK_OUTSIDE_CONTROLLER_MESSAGES.clickedOutside, this._handleClickOutside);
166
+ this.addEventListener(relative_position_controller_constants.RELATIVE_POSITION_CONTROLLER_EVENTS.disabledPositioning, this._handleDisabledPositioning);
167
+ this.addEventListener(relative_position_controller_constants.RELATIVE_POSITION_CONTROLLER_EVENTS.enabledPositioning, this._hideBackdrop);
166
168
  (_a = this.$dropdownToggler) === null || _a === void 0 ? void 0 : _a.addEventListener('toggle', this.toggle);
169
+ window.addEventListener('resize', this._observeScrollToggling);
167
170
  if (this.toggleOnHover)
168
171
  document.addEventListener('mouseover', this._hoverToggle);
169
172
  }
@@ -177,6 +180,38 @@ exports.HDropdown = HDropdown_1 = class HDropdown extends phoenix_light_lit_elem
177
180
  if (shouldHideElements)
178
181
  this.hide();
179
182
  }
183
+ _handleDisabledPositioning() {
184
+ if (this.opened)
185
+ this._showBackdrop();
186
+ }
187
+ _showBackdrop() {
188
+ const showBackdropEvent = new Event(backdrop_constants.BACKDROP_EVENTS.show, {
189
+ bubbles: true
190
+ });
191
+ document.dispatchEvent(showBackdropEvent);
192
+ }
193
+ _hideBackdrop() {
194
+ const hideBackdropEvent = new Event(backdrop_constants.BACKDROP_EVENTS.hide, {
195
+ bubbles: true
196
+ });
197
+ document.dispatchEvent(hideBackdropEvent);
198
+ }
199
+ _toggleScroll() {
200
+ var _a, _b;
201
+ if (window.innerWidth >= global_constants.BREAKPOINTS.xs && this._hasScrollableClassInitially)
202
+ return;
203
+ if (window.innerWidth >= global_constants.BREAKPOINTS.xs) {
204
+ (_a = this.$dropdownContent) === null || _a === void 0 ? void 0 : _a.classList.remove(global_constants.SCROLLABLE_CLASS_NAME);
205
+ return;
206
+ }
207
+ if (!this._dropdownContentChildrenHeight && this.$dropdownContent)
208
+ this._dropdownContentChildrenHeight = [...this.$dropdownContent.children].reduce((totalHeight, currentChild) => {
209
+ return totalHeight + (parseInt(getComputedStyle(currentChild).height.replace('px', '')) || 0);
210
+ }, 0);
211
+ if (this._dropdownContentChildrenHeight > window.innerHeight && !this._hasScrollableClassInitially) {
212
+ (_b = this.$dropdownContent) === null || _b === void 0 ? void 0 : _b.classList.add(global_constants.SCROLLABLE_CLASS_NAME);
213
+ }
214
+ }
180
215
  _isHoveredWithinDropdown(element) {
181
216
  if (element === this)
182
217
  return true;
@@ -193,10 +228,17 @@ exports.HDropdown = HDropdown_1 = class HDropdown extends phoenix_light_lit_elem
193
228
  return true;
194
229
  return false;
195
230
  }
231
+ _setupInitialDropdownProperties() {
232
+ if (!this.$dropdownContent)
233
+ return;
234
+ if (!this._hasScrollableClassInitially)
235
+ this._hasScrollableClassInitially = this.$dropdownContent.classList.contains(global_constants.SCROLLABLE_CLASS_NAME);
236
+ }
196
237
  disconnectedCallback() {
197
238
  var _a;
198
239
  super.disconnectedCallback();
199
240
  (_a = this.$dropdownToggler) === null || _a === void 0 ? void 0 : _a.removeEventListener('toggle', this.toggle);
241
+ window.removeEventListener('resize', this._observeScrollToggling);
200
242
  if (this.toggleOnHover)
201
243
  document.removeEventListener('mouseover', this._hoverToggle);
202
244
  if (this.opened) {
package/build/cjs/packages/phoenix/src/components/dropdown/dropdown.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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,qBAAqB,0CAA8C;AACnE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/phoenix/src/controllers/click_outside_controller/click_outside_controller.js CHANGED
@@ -4,7 +4,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var tslib_es6 = require('../../../../../external/tslib/tslib.es6.js');
6
6
  var click_outside_controller_messages = require('./click_outside_controller_messages.js');
7
- require('lit');
8
7
 
9
8
  var _ClickOutsideController_host, _ClickOutsideController_container;
10
9
  class ClickOutsideController {
@@ -32,9 +31,21 @@ class ClickOutsideController {
32
31
  tslib_es6.__classPrivateFieldGet(this, _ClickOutsideController_host, "f").addController(this);
33
32
  }
34
33
  hostConnected() {
35
- document.addEventListener('click', this._dispatchClickedOutsideEvent);
34
+ this._setupClickEventListener();
36
35
  }
37
36
  hostDisconnected() {
37
+ this._removeClickEventListener();
38
+ }
39
+ enable() {
40
+ this._setupClickEventListener();
41
+ }
42
+ disable() {
43
+ this._removeClickEventListener();
44
+ }
45
+ _setupClickEventListener() {
46
+ document.addEventListener('click', this._dispatchClickedOutsideEvent);
47
+ }
48
+ _removeClickEventListener() {
38
49
  document.removeEventListener('click', this._dispatchClickedOutsideEvent);
39
50
  }
40
51
  }
package/build/cjs/packages/phoenix/src/controllers/click_outside_controller/click_outside_controller.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;"}
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;"}
package/build/cjs/packages/phoenix/src/controllers/relative_position_controller/relative_position_calculator.js CHANGED
@@ -5,22 +5,22 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var tslib_es6 = require('../../../../../external/tslib/tslib.es6.js');
6
6
  var relative_position_controller_constants = require('./relative_position_controller_constants.js');
7
7
 
8
- var _PositionCalculator_direction, _PositionCalculator_relativeElementRect, _PositionCalculator_positionElementRect, _PositionCalculator_nearestNonStaticElementFromElementToPositionRect, _PositionCalculator_containerRect, _PositionCalculator_documentHeight, _PositionCalculator_disableRepositioning;
8
+ var _PositionCalculator_direction, _PositionCalculator_relativeElementRect, _PositionCalculator_positionElementRect, _PositionCalculator_nearestNonStaticElementFromElementToPositionRect, _PositionCalculator_containerRect, _PositionCalculator_documentHeight, _PositionCalculator_shouldNotReposition;
9
9
  class PositionCalculator {
10
- constructor({ direction, relativeElementRect, positionElementRect, container = document.body, nearestNonStaticElementFromElementToPositionRect, disableRepositioning }) {
10
+ constructor({ direction, relativeElementRect, positionElementRect, container = document.body, nearestNonStaticElementFromElementToPositionRect, shouldNotReposition }) {
11
11
  _PositionCalculator_direction.set(this, void 0);
12
12
  _PositionCalculator_relativeElementRect.set(this, void 0);
13
13
  _PositionCalculator_positionElementRect.set(this, void 0);
14
14
  _PositionCalculator_nearestNonStaticElementFromElementToPositionRect.set(this, void 0);
15
15
  _PositionCalculator_containerRect.set(this, void 0);
16
16
  _PositionCalculator_documentHeight.set(this, void 0);
17
- _PositionCalculator_disableRepositioning.set(this, void 0);
17
+ _PositionCalculator_shouldNotReposition.set(this, void 0);
18
18
  tslib_es6.__classPrivateFieldSet(this, _PositionCalculator_direction, direction, "f");
19
19
  tslib_es6.__classPrivateFieldSet(this, _PositionCalculator_relativeElementRect, relativeElementRect, "f");
20
20
  tslib_es6.__classPrivateFieldSet(this, _PositionCalculator_positionElementRect, positionElementRect, "f");
21
21
  tslib_es6.__classPrivateFieldSet(this, _PositionCalculator_nearestNonStaticElementFromElementToPositionRect, nearestNonStaticElementFromElementToPositionRect, "f");
22
22
  tslib_es6.__classPrivateFieldSet(this, _PositionCalculator_containerRect, container.getBoundingClientRect(), "f");
23
- tslib_es6.__classPrivateFieldSet(this, _PositionCalculator_disableRepositioning, !!disableRepositioning, "f");
23
+ tslib_es6.__classPrivateFieldSet(this, _PositionCalculator_shouldNotReposition, !!shouldNotReposition, "f");
24
24
  const body = document.body;
25
25
  const documentElement = document.documentElement;
26
26
  tslib_es6.__classPrivateFieldSet(this, _PositionCalculator_documentHeight, Math.max(body.scrollHeight, body.offsetHeight, documentElement.clientHeight, documentElement.scrollHeight, documentElement.offsetHeight), "f");
@@ -52,7 +52,7 @@ class PositionCalculator {
52
52
  const centerOfRelativeElement = (topSideOfRelativeElement + bottomSideOfRelativeElement) / 2;
53
53
  switch (side) {
54
54
  case relative_position_controller_constants.CALCULATOR_DIRECTIONS.top:
55
- if (tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_disableRepositioning, "f"))
55
+ if (tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_shouldNotReposition, "f"))
56
56
  return { top: topSideOfRelativeElement, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.top };
57
57
  if (!this._canFitTopSide() && !this._canFitBottomSide() && !this._canFitCenter(centerOfRelativeElement))
58
58
  return { top: bottomSideOfRelativeElement, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.bottom, shrinkMode: true };
@@ -62,7 +62,7 @@ class PositionCalculator {
62
62
  return { top: bottomSideOfRelativeElement, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.bottom };
63
63
  return { top: topSideOfRelativeElement, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.top };
64
64
  case relative_position_controller_constants.CALCULATOR_DIRECTIONS.bottom:
65
- if (tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_disableRepositioning, "f"))
65
+ if (tslib_es6.__classPrivateFieldGet(this, _PositionCalculator_shouldNotReposition, "f"))
66
66
  return { top: bottomSideOfRelativeElement, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.bottom };
67
67
  if (!this._canFitTopSide() && !this._canFitBottomSide() && !this._canFitCenter(centerOfRelativeElement))
68
68
  return { top: bottomSideOfRelativeElement, calculatedSide: relative_position_controller_constants.CALCULATOR_DIRECTIONS.bottom, shrinkMode: true };
@@ -105,7 +105,7 @@ class PositionCalculator {
105
105
  }
106
106
  }
107
107
  }
108
- _PositionCalculator_direction = new WeakMap(), _PositionCalculator_relativeElementRect = new WeakMap(), _PositionCalculator_positionElementRect = new WeakMap(), _PositionCalculator_nearestNonStaticElementFromElementToPositionRect = new WeakMap(), _PositionCalculator_containerRect = new WeakMap(), _PositionCalculator_documentHeight = new WeakMap(), _PositionCalculator_disableRepositioning = new WeakMap();
108
+ _PositionCalculator_direction = new WeakMap(), _PositionCalculator_relativeElementRect = new WeakMap(), _PositionCalculator_positionElementRect = new WeakMap(), _PositionCalculator_nearestNonStaticElementFromElementToPositionRect = new WeakMap(), _PositionCalculator_containerRect = new WeakMap(), _PositionCalculator_documentHeight = new WeakMap(), _PositionCalculator_shouldNotReposition = new WeakMap();
109
109
 
110
110
  exports.PositionCalculator = PositionCalculator;
111
111
  //# sourceMappingURL=relative_position_calculator.js.map
package/build/cjs/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller.js CHANGED
@@ -9,9 +9,9 @@ require('lit');
9
9
  var global_constants = require('../../global_constants.js');
10
10
  var lodash = require('../../../../../external/lodash/lodash.js');
11
11
 
12
- var _RelativePositionController_host, _RelativePositionController_container, _RelativePositionController_nearestNonStaticElementFromElementToPosition, _RelativePositionController_direction, _RelativePositionController_nearestScrollableElement, _RelativePositionController_relativeElement, _RelativePositionController_elementToPosition, _RelativePositionController_shouldDisablePositioning, _RelativePositionController_portalElementsNames, _RelativePositionController_isInitiallyScrollable, _RelativePositionController_initialMaxHeight, _RelativePositionController_initialHeight, _RelativePositionController_calculatedDirection, _RelativePositionController_throttledReposition, _RelativePositionController_throttledRepositionForScroll;
12
+ var _RelativePositionController_host, _RelativePositionController_container, _RelativePositionController_nearestNonStaticElementFromElementToPosition, _RelativePositionController_direction, _RelativePositionController_nearestScrollableElement, _RelativePositionController_relativeElement, _RelativePositionController_elementToPosition, _RelativePositionController_disablePositioningOnCondition, _RelativePositionController_portalElementsNames, _RelativePositionController_isInitiallyScrollable, _RelativePositionController_initialMaxHeight, _RelativePositionController_initialHeight, _RelativePositionController_calculatedDirection, _RelativePositionController_hasPositioningBeenDisabled, _RelativePositionController_doesCurrentlyHaveShrinkMode, _RelativePositionController_throttledReposition, _RelativePositionController_throttledRepositionForScroll;
13
13
  class RelativePositionController {
14
- constructor({ host, container, direction, relativeElement, elementToPosition, shouldDisablePositioning, portalElementsNames = [] }) {
14
+ constructor({ host, container, direction, relativeElement, elementToPosition, disablePositioningOnCondition = () => true, portalElementsNames = [] }) {
15
15
  _RelativePositionController_host.set(this, void 0);
16
16
  _RelativePositionController_container.set(this, void 0);
17
17
  _RelativePositionController_nearestNonStaticElementFromElementToPosition.set(this, void 0);
@@ -19,40 +19,32 @@ class RelativePositionController {
19
19
  _RelativePositionController_nearestScrollableElement.set(this, void 0);
20
20
  _RelativePositionController_relativeElement.set(this, void 0);
21
21
  _RelativePositionController_elementToPosition.set(this, void 0);
22
- _RelativePositionController_shouldDisablePositioning.set(this, void 0);
22
+ _RelativePositionController_disablePositioningOnCondition.set(this, void 0);
23
23
  _RelativePositionController_portalElementsNames.set(this, void 0);
24
24
  _RelativePositionController_isInitiallyScrollable.set(this, void 0);
25
25
  _RelativePositionController_initialMaxHeight.set(this, void 0);
26
26
  _RelativePositionController_initialHeight.set(this, void 0);
27
27
  _RelativePositionController_calculatedDirection.set(this, void 0);
28
+ _RelativePositionController_hasPositioningBeenDisabled.set(this, void 0);
29
+ _RelativePositionController_doesCurrentlyHaveShrinkMode.set(this, void 0);
28
30
  _RelativePositionController_throttledReposition.set(this, lodash["default"].throttle(() => {
29
- if (!tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_shouldDisablePositioning, "f")) {
30
- this.position(true);
31
- return;
32
- }
33
- tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_shouldDisablePositioning, "f").call(this) ? this.disableRelativePositioning() : this.position(true);
31
+ tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_disablePositioningOnCondition, "f").call(this) ? this.disableRelativePositioning() : this.position(true);
34
32
  }, relative_position_controller_constants.DEFAULT_THROTTLE_WAIT_TIME));
35
33
  _RelativePositionController_throttledRepositionForScroll.set(this, lodash["default"].throttle(() => {
36
- if (!tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_shouldDisablePositioning, "f")) {
37
- this.position(true);
38
- return;
39
- }
40
- tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_shouldDisablePositioning, "f").call(this) ? this.disableRelativePositioning() : this.position(true);
34
+ tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_disablePositioningOnCondition, "f").call(this) ? this.disableRelativePositioning() : this.position(true);
41
35
  }, relative_position_controller_constants.DEFAULT_SCROLL_THROTTLE_WAIT_TIME));
42
36
  tslib_es6.__classPrivateFieldSet(this, _RelativePositionController_host, host, "f");
43
37
  tslib_es6.__classPrivateFieldSet(this, _RelativePositionController_container, container, "f");
44
38
  tslib_es6.__classPrivateFieldSet(this, _RelativePositionController_direction, direction, "f");
45
39
  tslib_es6.__classPrivateFieldSet(this, _RelativePositionController_relativeElement, relativeElement, "f");
46
40
  tslib_es6.__classPrivateFieldSet(this, _RelativePositionController_elementToPosition, elementToPosition, "f");
47
- tslib_es6.__classPrivateFieldSet(this, _RelativePositionController_shouldDisablePositioning, shouldDisablePositioning, "f");
41
+ tslib_es6.__classPrivateFieldSet(this, _RelativePositionController_disablePositioningOnCondition, disablePositioningOnCondition, "f");
48
42
  tslib_es6.__classPrivateFieldSet(this, _RelativePositionController_portalElementsNames, portalElementsNames, "f");
49
43
  tslib_es6.__classPrivateFieldSet(this, _RelativePositionController_isInitiallyScrollable, elementToPosition.classList.contains(global_constants.SCROLLABLE_CLASS_NAME), "f");
50
44
  tslib_es6.__classPrivateFieldSet(this, _RelativePositionController_initialMaxHeight, getComputedStyle(elementToPosition).maxHeight, "f");
51
45
  tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_host, "f").addController(this);
52
46
  }
53
47
  hostConnected() {
54
- if (!tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_relativeElement, "f"))
55
- return;
56
48
  if (!tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_nearestScrollableElement, "f")) {
57
49
  tslib_es6.__classPrivateFieldSet(this, _RelativePositionController_nearestScrollableElement, this._findNearestScrollableElement(tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_relativeElement, "f")), "f");
58
50
  }
@@ -64,29 +56,42 @@ class RelativePositionController {
64
56
  if (tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_nearestScrollableElement, "f"))
65
57
  tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_nearestScrollableElement, "f").removeEventListener('scroll', tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_throttledRepositionForScroll, "f"));
66
58
  }
67
- position(disableRepositioning = false) {
68
- if (!tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_relativeElement, "f") || !tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f"))
69
- return;
70
- tslib_es6.__classPrivateFieldSet(this, _RelativePositionController_nearestNonStaticElementFromElementToPosition, this._findContainer(tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f")), "f");
59
+ position(shouldNotReposition = false) {
60
+ if (tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_hasPositioningBeenDisabled, "f"))
61
+ this._dispatchReenabledPositioningEvent();
62
+ if (!tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_nearestNonStaticElementFromElementToPosition, "f"))
63
+ tslib_es6.__classPrivateFieldSet(this, _RelativePositionController_nearestNonStaticElementFromElementToPosition, this._findContainer(tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f")), "f");
71
64
  if (!tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_container, "f"))
72
65
  tslib_es6.__classPrivateFieldSet(this, _RelativePositionController_container, tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_nearestNonStaticElementFromElementToPosition, "f"), "f");
73
66
  const positionElementRect = tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_initialHeight, "f")
74
- ? {
75
- ...tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").getBoundingClientRect().toJSON(),
76
- height: tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_initialHeight, "f")
77
- }
67
+ ? { ...tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").getBoundingClientRect().toJSON(), height: tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_initialHeight, "f") }
78
68
  : tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").getBoundingClientRect();
79
69
  const position = new relative_position_calculator.PositionCalculator({
80
- direction: disableRepositioning && tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_calculatedDirection, "f") ? tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_calculatedDirection, "f") : tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_direction, "f"),
70
+ direction: shouldNotReposition && tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_calculatedDirection, "f") ? tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_calculatedDirection, "f") : tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_direction, "f"),
81
71
  relativeElementRect: tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_relativeElement, "f").getBoundingClientRect(),
82
72
  positionElementRect,
83
73
  nearestNonStaticElementFromElementToPositionRect: tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_nearestNonStaticElementFromElementToPosition, "f").getBoundingClientRect(),
84
74
  container: tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_container, "f"),
85
- disableRepositioning
75
+ shouldNotReposition
86
76
  }).calculatePosition();
87
- if (!disableRepositioning)
88
- tslib_es6.__classPrivateFieldSet(this, _RelativePositionController_calculatedDirection, position.calculatedSide, "f");
89
77
  this._setElementPosition(position);
78
+ const isRepositioningDisabled = shouldNotReposition && tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_doesCurrentlyHaveShrinkMode, "f");
79
+ if (isRepositioningDisabled)
80
+ return;
81
+ tslib_es6.__classPrivateFieldSet(this, _RelativePositionController_calculatedDirection, position.calculatedSide, "f");
82
+ tslib_es6.__classPrivateFieldSet(this, _RelativePositionController_doesCurrentlyHaveShrinkMode, !!position.shrinkMode, "f");
83
+ if (!position.shrinkMode) {
84
+ this._disableShrinkMode();
85
+ return;
86
+ }
87
+ this._enableShrinkMode();
88
+ }
89
+ _dispatchReenabledPositioningEvent() {
90
+ tslib_es6.__classPrivateFieldSet(this, _RelativePositionController_hasPositioningBeenDisabled, false, "f");
91
+ const enabledPositioningEvent = new CustomEvent(relative_position_controller_constants.RELATIVE_POSITION_CONTROLLER_EVENTS.enabledPositioning, {
92
+ bubbles: true
93
+ });
94
+ tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_host, "f").dispatchEvent(enabledPositioningEvent);
90
95
  }
91
96
  _findNearestScrollableElement(element) {
92
97
  const overflowArray = ['overflow', 'overflowY', 'overflowX'];
@@ -108,37 +113,37 @@ class RelativePositionController {
108
113
  return this._findParentBasedOnStyle(parent, styles, callback);
109
114
  }
110
115
  _setElementPosition(position) {
111
- if (!tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f") || !tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_relativeElement, "f"))
112
- return;
113
- const { style: elementStyle } = tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f");
114
- if (elementStyle.position !== 'absolute')
115
- elementStyle.position = 'absolute';
116
- if (elementStyle.top !== '0')
117
- elementStyle.top = '0';
118
- if (elementStyle.left !== '0')
119
- elementStyle.left = '0';
116
+ tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").style.position = 'absolute';
117
+ tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").style.top = '0';
118
+ tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").style.left = '0';
120
119
  tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").style.transform = `translate3d(${position.left}px, ${position.top}px, 0)`;
121
- if (!position.shrinkMode) {
122
- if (!tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_isInitiallyScrollable, "f"))
123
- tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").classList.remove(global_constants.SCROLLABLE_CLASS_NAME);
124
- elementStyle.maxHeight = tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_initialMaxHeight, "f") !== 'none' ? tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_initialMaxHeight, "f") : '';
125
- return;
126
- }
120
+ }
121
+ _disableShrinkMode() {
122
+ if (!tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_isInitiallyScrollable, "f"))
123
+ tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").classList.remove(global_constants.SCROLLABLE_CLASS_NAME);
124
+ tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").style.maxHeight = tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_initialMaxHeight, "f") !== 'none' ? tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_initialMaxHeight, "f") : '';
125
+ }
126
+ _enableShrinkMode() {
127
127
  if (!tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_initialHeight, "f"))
128
128
  tslib_es6.__classPrivateFieldSet(this, _RelativePositionController_initialHeight, tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").getBoundingClientRect().height, "f");
129
129
  tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").classList.add(global_constants.SCROLLABLE_CLASS_NAME);
130
130
  const shrinkModeMaxHeight = window.innerHeight - tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_relativeElement, "f").getBoundingClientRect().bottom - relative_position_controller_constants.SHRINK_MODE_BOTTOM_MARGIN;
131
- elementStyle.maxHeight = `${shrinkModeMaxHeight > relative_position_controller_constants.SHRINK_MODE_MIN_HEIGHT ? shrinkModeMaxHeight : relative_position_controller_constants.SHRINK_MODE_MIN_HEIGHT}px`;
131
+ tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").style.maxHeight = `${shrinkModeMaxHeight > relative_position_controller_constants.SHRINK_MODE_MIN_HEIGHT ? shrinkModeMaxHeight : relative_position_controller_constants.SHRINK_MODE_MIN_HEIGHT}px`;
132
132
  }
133
133
  disableRelativePositioning() {
134
- if (!tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f"))
135
- return;
134
+ if (!tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_hasPositioningBeenDisabled, "f")) {
135
+ tslib_es6.__classPrivateFieldSet(this, _RelativePositionController_hasPositioningBeenDisabled, true, "f");
136
+ const disabledPositioningEvent = new CustomEvent(relative_position_controller_constants.RELATIVE_POSITION_CONTROLLER_EVENTS.disabledPositioning, {
137
+ bubbles: true
138
+ });
139
+ tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_host, "f").dispatchEvent(disabledPositioningEvent);
140
+ }
136
141
  const { style: elementStyle } = tslib_es6.__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f");
137
142
  elementStyle.position = '';
138
143
  elementStyle.transform = '';
139
144
  }
140
145
  }
141
- _RelativePositionController_host = new WeakMap(), _RelativePositionController_container = new WeakMap(), _RelativePositionController_nearestNonStaticElementFromElementToPosition = new WeakMap(), _RelativePositionController_direction = new WeakMap(), _RelativePositionController_nearestScrollableElement = new WeakMap(), _RelativePositionController_relativeElement = new WeakMap(), _RelativePositionController_elementToPosition = new WeakMap(), _RelativePositionController_shouldDisablePositioning = new WeakMap(), _RelativePositionController_portalElementsNames = new WeakMap(), _RelativePositionController_isInitiallyScrollable = new WeakMap(), _RelativePositionController_initialMaxHeight = new WeakMap(), _RelativePositionController_initialHeight = new WeakMap(), _RelativePositionController_calculatedDirection = new WeakMap(), _RelativePositionController_throttledReposition = new WeakMap(), _RelativePositionController_throttledRepositionForScroll = new WeakMap();
146
+ _RelativePositionController_host = new WeakMap(), _RelativePositionController_container = new WeakMap(), _RelativePositionController_nearestNonStaticElementFromElementToPosition = new WeakMap(), _RelativePositionController_direction = new WeakMap(), _RelativePositionController_nearestScrollableElement = new WeakMap(), _RelativePositionController_relativeElement = new WeakMap(), _RelativePositionController_elementToPosition = new WeakMap(), _RelativePositionController_disablePositioningOnCondition = new WeakMap(), _RelativePositionController_portalElementsNames = new WeakMap(), _RelativePositionController_isInitiallyScrollable = new WeakMap(), _RelativePositionController_initialMaxHeight = new WeakMap(), _RelativePositionController_initialHeight = new WeakMap(), _RelativePositionController_calculatedDirection = new WeakMap(), _RelativePositionController_hasPositioningBeenDisabled = new WeakMap(), _RelativePositionController_doesCurrentlyHaveShrinkMode = new WeakMap(), _RelativePositionController_throttledReposition = new WeakMap(), _RelativePositionController_throttledRepositionForScroll = new WeakMap();
142
147
 
143
148
  exports.RelativePositionController = RelativePositionController;
144
149
  //# sourceMappingURL=relative_position_controller.js.map
package/build/cjs/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller.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,qBAAqB,0CAA8C;AACnE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,qBAAqB,0CAA8C;AACnE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/phoenix/src/controllers/relative_position_controller/relative_position_controller_constants.js CHANGED
@@ -29,7 +29,12 @@ const OVERFLOW_AUTO = 'auto';
29
29
  const DEFAULT_THROTTLE_WAIT_TIME = 300;
30
30
  const DEFAULT_SCROLL_THROTTLE_WAIT_TIME = 15;
31
31
  const SHRINK_MODE_BOTTOM_MARGIN = 20;
32
- const SHRINK_MODE_MIN_HEIGHT = 80;
32
+ const SHRINK_MODE_MIN_HEIGHT = 80;
33
+ const RELATIVE_POSITION_CONTROLLER_EVENT_NAME = 'relative_position_controller';
34
+ const RELATIVE_POSITION_CONTROLLER_EVENTS = {
35
+ enabledPositioning: `${RELATIVE_POSITION_CONTROLLER_EVENT_NAME}.enabledPositioning`,
36
+ disabledPositioning: `${RELATIVE_POSITION_CONTROLLER_EVENT_NAME}.disabledPositioning`
37
+ };
33
38
 
34
39
  exports.CALCULATOR_DIRECTIONS = CALCULATOR_DIRECTIONS;
35
40
  exports.DEFAULT_SCROLL_THROTTLE_WAIT_TIME = DEFAULT_SCROLL_THROTTLE_WAIT_TIME;
@@ -38,6 +43,7 @@ exports.DIRECTIONS = DIRECTIONS;
38
43
  exports.NON_STATIC_POSITIONS = NON_STATIC_POSITIONS;
39
44
  exports.OVERFLOW_AUTO = OVERFLOW_AUTO;
40
45
  exports.OVERFLOW_SCROLL = OVERFLOW_SCROLL;
46
+ exports.RELATIVE_POSITION_CONTROLLER_EVENTS = RELATIVE_POSITION_CONTROLLER_EVENTS;
41
47
  exports.SHRINK_MODE_BOTTOM_MARGIN = SHRINK_MODE_BOTTOM_MARGIN;
42
48
  exports.SHRINK_MODE_MIN_HEIGHT = SHRINK_MODE_MIN_HEIGHT;
43
49
  //# sourceMappingURL=relative_position_controller_constants.js.map
package/build/cjs/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller_constants.js.map CHANGED
@@ -1 +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;"}
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;"}
package/build/esm/packages/phoenix/src/components/dropdown/dropdown.d.ts CHANGED
@@ -15,6 +15,8 @@ export declare class HDropdown extends PhoenixLightLitElement implements IDropdo
15
15
  $hoverableDropdownContentElements: HDropdownContent[];
16
16
  private _positionController;
17
17
  private _clickOutsideController;
18
+ private _dropdownContentChildrenHeight;
19
+ private _hasScrollableClassInitially;
18
20
  connectedCallback(): void;
19
21
  private static _appendDropdownPortal;
20
22
  private _setupListeners;
@@ -24,8 +26,14 @@ export declare class HDropdown extends PhoenixLightLitElement implements IDropdo
24
26
  private _dispatchShowDropdownEvent;
25
27
  hide: () => Promise<void>;
26
28
  private _dispatchHideDropdownEvent;
29
+ private _handleDisabledPositioning;
30
+ private _showBackdrop;
31
+ private _hideBackdrop;
32
+ private _observeScrollToggling;
33
+ private _toggleScroll;
27
34
  private _hoverToggle;
28
35
  private _isHoveredWithinDropdown;
36
+ private _setupInitialDropdownProperties;
29
37
  private _positionDropdownContent;
30
38
  disconnectedCallback(): void;
31
39
  render(): TemplateResult;
package/build/esm/packages/phoenix/src/components/dropdown/dropdown.js CHANGED
@@ -1,16 +1,17 @@
1
1
  import { __decorate, __metadata } from '../../../../../external/tslib/tslib.es6.js';
2
+ import { BREAKPOINTS, SCROLLABLE_CLASS_NAME } from '../../global_constants.js';
2
3
  import { DEFAULT_DROPDOWN_PORTAL_NAME, DROPDOWN_CONTENT_VISIBLE_CLASS, DROPDOWN_CONTENT_SHOW, DROPDOWN_EVENTS, DROPDOWN_CONTENT_HIDE, DROPDOWN_CONTAINER_NAME, DROPDOWN_CONTENT_NAME, DROPDOWN_TOGGLER_NAME } from './dropdown_constants.js';
4
+ import { DIRECTIONS, DEFAULT_THROTTLE_WAIT_TIME, RELATIVE_POSITION_CONTROLLER_EVENTS } from '../../controllers/relative_position_controller/relative_position_controller_constants.js';
3
5
  import { PORTAL_TARGET_COMPONENT_NAME, PORTAL_TARGET_NAME_PROP } from '../portal/portal_constants.js';
4
6
  import { html } from 'lit';
5
7
  import { BACKDROP_EVENTS } from '../backdrop/backdrop_constants.js';
6
- import { BREAKPOINTS } from '../../global_constants.js';
7
8
  import { CLICK_OUTSIDE_CONTROLLER_MESSAGES } from '../../controllers/click_outside_controller/click_outside_controller_messages.js';
8
9
  import { ClickOutsideController } from '../../controllers/click_outside_controller/click_outside_controller.js';
9
- import { DIRECTIONS } from '../../controllers/relative_position_controller/relative_position_controller_constants.js';
10
10
  import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element.js';
11
11
  import { RelativePositionController } from '../../controllers/relative_position_controller/relative_position_controller.js';
12
12
  import { phoenixCustomElement } from '../../core/decorators/phoenix_custom_element.js';
13
13
  import { property } from 'lit/decorators';
14
+ import lodash from '../../../../../external/lodash/lodash.js';
14
15
 
15
16
  var HDropdown_1;
16
17
  let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
@@ -41,6 +42,7 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
41
42
  var _a;
42
43
  this._dispatchShowDropdownEvent();
43
44
  (_a = this.$dropdownContent) === null || _a === void 0 ? void 0 : _a.classList.remove(`${DROPDOWN_CONTENT_SHOW}-${this.transition}-start`, `${DROPDOWN_CONTENT_SHOW}-${this.transition}-end`);
45
+ this._toggleScroll();
44
46
  resolve();
45
47
  }, transitionDuration);
46
48
  });
@@ -53,10 +55,7 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
53
55
  this.dispatchEvent(showDropdownEvent);
54
56
  if (window.innerWidth >= BREAKPOINTS.xs)
55
57
  return;
56
- const showBackdropEvent = new Event(BACKDROP_EVENTS.show, {
57
- bubbles: true
58
- });
59
- document.dispatchEvent(showBackdropEvent);
58
+ this._showBackdrop();
60
59
  };
61
60
  this.hide = async () => new Promise((resolve) => {
62
61
  var _a;
@@ -82,11 +81,11 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
82
81
  this.dispatchEvent(hideDropdownEvent);
83
82
  if (window.innerWidth >= BREAKPOINTS.xs)
84
83
  return;
85
- const hideBackdropEvent = new Event(BACKDROP_EVENTS.hide, {
86
- bubbles: true
87
- });
88
- document.dispatchEvent(hideBackdropEvent);
84
+ this._hideBackdrop();
89
85
  };
86
+ this._observeScrollToggling = lodash.throttle(() => {
87
+ this._toggleScroll();
88
+ }, DEFAULT_THROTTLE_WAIT_TIME);
90
89
  this._hoverToggle = async (ev) => {
91
90
  if (window.innerWidth < BREAKPOINTS.xs)
92
91
  return;
@@ -134,7 +133,7 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
134
133
  direction: this.direction,
135
134
  relativeElement: this.$dropdownToggler,
136
135
  elementToPosition: this.$dropdownContent,
137
- shouldDisablePositioning: () => window.innerWidth < BREAKPOINTS.xs,
136
+ disablePositioningOnCondition: () => window.innerWidth < BREAKPOINTS.xs,
138
137
  portalElementsNames: [DROPDOWN_CONTENT_NAME]
139
138
  });
140
139
  if (!this._clickOutsideController)
@@ -147,6 +146,7 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
147
146
  this.$hoverableDropdownContentElements = [...this.querySelectorAll(DROPDOWN_CONTENT_NAME)];
148
147
  }
149
148
  this._setupListeners();
149
+ this._setupInitialDropdownProperties();
150
150
  }
151
151
  static _appendDropdownPortal() {
152
152
  const $dropdownPortalTarget = document.querySelector(`[name="${DEFAULT_DROPDOWN_PORTAL_NAME}"]`);
@@ -159,7 +159,10 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
159
159
  _setupListeners() {
160
160
  var _a;
161
161
  this.addEventListener(CLICK_OUTSIDE_CONTROLLER_MESSAGES.clickedOutside, this._handleClickOutside);
162
+ this.addEventListener(RELATIVE_POSITION_CONTROLLER_EVENTS.disabledPositioning, this._handleDisabledPositioning);
163
+ this.addEventListener(RELATIVE_POSITION_CONTROLLER_EVENTS.enabledPositioning, this._hideBackdrop);
162
164
  (_a = this.$dropdownToggler) === null || _a === void 0 ? void 0 : _a.addEventListener('toggle', this.toggle);
165
+ window.addEventListener('resize', this._observeScrollToggling);
163
166
  if (this.toggleOnHover)
164
167
  document.addEventListener('mouseover', this._hoverToggle);
165
168
  }
@@ -173,6 +176,38 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
173
176
  if (shouldHideElements)
174
177
  this.hide();
175
178
  }
179
+ _handleDisabledPositioning() {
180
+ if (this.opened)
181
+ this._showBackdrop();
182
+ }
183
+ _showBackdrop() {
184
+ const showBackdropEvent = new Event(BACKDROP_EVENTS.show, {
185
+ bubbles: true
186
+ });
187
+ document.dispatchEvent(showBackdropEvent);
188
+ }
189
+ _hideBackdrop() {
190
+ const hideBackdropEvent = new Event(BACKDROP_EVENTS.hide, {
191
+ bubbles: true
192
+ });
193
+ document.dispatchEvent(hideBackdropEvent);
194
+ }
195
+ _toggleScroll() {
196
+ var _a, _b;
197
+ if (window.innerWidth >= BREAKPOINTS.xs && this._hasScrollableClassInitially)
198
+ return;
199
+ if (window.innerWidth >= BREAKPOINTS.xs) {
200
+ (_a = this.$dropdownContent) === null || _a === void 0 ? void 0 : _a.classList.remove(SCROLLABLE_CLASS_NAME);
201
+ return;
202
+ }
203
+ if (!this._dropdownContentChildrenHeight && this.$dropdownContent)
204
+ this._dropdownContentChildrenHeight = [...this.$dropdownContent.children].reduce((totalHeight, currentChild) => {
205
+ return totalHeight + (parseInt(getComputedStyle(currentChild).height.replace('px', '')) || 0);
206
+ }, 0);
207
+ if (this._dropdownContentChildrenHeight > window.innerHeight && !this._hasScrollableClassInitially) {
208
+ (_b = this.$dropdownContent) === null || _b === void 0 ? void 0 : _b.classList.add(SCROLLABLE_CLASS_NAME);
209
+ }
210
+ }
176
211
  _isHoveredWithinDropdown(element) {
177
212
  if (element === this)
178
213
  return true;
@@ -189,10 +224,17 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
189
224
  return true;
190
225
  return false;
191
226
  }
227
+ _setupInitialDropdownProperties() {
228
+ if (!this.$dropdownContent)
229
+ return;
230
+ if (!this._hasScrollableClassInitially)
231
+ this._hasScrollableClassInitially = this.$dropdownContent.classList.contains(SCROLLABLE_CLASS_NAME);
232
+ }
192
233
  disconnectedCallback() {
193
234
  var _a;
194
235
  super.disconnectedCallback();
195
236
  (_a = this.$dropdownToggler) === null || _a === void 0 ? void 0 : _a.removeEventListener('toggle', this.toggle);
237
+ window.removeEventListener('resize', this._observeScrollToggling);
196
238
  if (this.toggleOnHover)
197
239
  document.removeEventListener('mouseover', this._hoverToggle);
198
240
  if (this.opened) {
package/build/esm/packages/phoenix/src/components/dropdown/dropdown.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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,mBAAmB,0CAA8C;AACjE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/controllers/click_outside_controller/click_outside_controller.d.ts CHANGED
@@ -1,10 +1,13 @@
1
- import { ReactiveController } from 'lit';
2
- import { TClickOutsideControllerProps } from './click_outside_controller_types';
3
- export declare class ClickOutsideController implements ReactiveController {
1
+ import { IClickOutsideController, TClickOutsideControllerProps } from './click_outside_controller_types';
2
+ export declare class ClickOutsideController implements IClickOutsideController {
4
3
  #private;
5
4
  private _name?;
6
5
  constructor({ host, container, name }: TClickOutsideControllerProps);
7
6
  hostConnected(): void;
8
7
  hostDisconnected(): void;
8
+ enable(): void;
9
+ disable(): void;
10
+ private _setupClickEventListener;
11
+ private _removeClickEventListener;
9
12
  private _dispatchClickedOutsideEvent;
10
13
  }
package/build/esm/packages/phoenix/src/controllers/click_outside_controller/click_outside_controller.js CHANGED
@@ -1,6 +1,5 @@
1
1
  import { __classPrivateFieldGet, __classPrivateFieldSet } from '../../../../../external/tslib/tslib.es6.js';
2
2
  import { CLICK_OUTSIDE_CONTROLLER_MESSAGES } from './click_outside_controller_messages.js';
3
- import 'lit';
4
3
 
5
4
  var _ClickOutsideController_host, _ClickOutsideController_container;
6
5
  class ClickOutsideController {
@@ -28,9 +27,21 @@ class ClickOutsideController {
28
27
  __classPrivateFieldGet(this, _ClickOutsideController_host, "f").addController(this);
29
28
  }
30
29
  hostConnected() {
31
- document.addEventListener('click', this._dispatchClickedOutsideEvent);
30
+ this._setupClickEventListener();
32
31
  }
33
32
  hostDisconnected() {
33
+ this._removeClickEventListener();
34
+ }
35
+ enable() {
36
+ this._setupClickEventListener();
37
+ }
38
+ disable() {
39
+ this._removeClickEventListener();
40
+ }
41
+ _setupClickEventListener() {
42
+ document.addEventListener('click', this._dispatchClickedOutsideEvent);
43
+ }
44
+ _removeClickEventListener() {
34
45
  document.removeEventListener('click', this._dispatchClickedOutsideEvent);
35
46
  }
36
47
  }
package/build/esm/packages/phoenix/src/controllers/click_outside_controller/click_outside_controller.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,+DAA+D,4CAAgD;AAC/G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,+DAA+D,4CAAgD;AAC/G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/controllers/click_outside_controller/click_outside_controller_types.d.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  import { TWebComponentsContextControllerHost } from "../../core/context/context_controller_types";
2
+ import { ReactiveController } from 'lit';
2
3
  export declare type TClickOutsideControllerProps = {
3
4
  host: TWebComponentsContextControllerHost;
4
5
  container: HTMLElement;
@@ -8,3 +9,7 @@ export declare type TClickOutsideEvent = {
8
9
  target: EventTarget | null;
9
10
  name?: string;
10
11
  };
12
+ export interface IClickOutsideController extends ReactiveController {
13
+ enable(): void;
14
+ disable(): void;
15
+ }
package/build/esm/packages/phoenix/src/controllers/click_outside_controller/click_outside_controller_types.js CHANGED
@@ -1,2 +1,3 @@
1
1
  import '@phoenixRoot/core/context/context_controller_types';
2
+ import 'lit';
2
3
  //# sourceMappingURL=click_outside_controller_types.js.map
package/build/esm/packages/phoenix/src/controllers/click_outside_controller/click_outside_controller_types.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"click_outside_controller_types.js","sourceRoot":"","sources":["../../../../../../../src/controllers/click_outside_controller/click_outside_controller_types.ts"],"names":[],"mappings":"AAAA,OAAoD,oDAAoD,CAAC"}
1
+ {"version":3,"file":"click_outside_controller_types.js","sourceRoot":"","sources":["../../../../../../../src/controllers/click_outside_controller/click_outside_controller_types.ts"],"names":[],"mappings":"AAAA,OAAoD,oDAAoD,CAAC;AACzG,OAAmC,KAAK,CAAC"}
package/build/esm/packages/phoenix/src/controllers/relative_position_controller/relative_position_calculator.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import { TRelativePositionCalculatorConstructorOptions, TRelativePositionControllerPositionData } from "./relative_position_controller_types";
2
2
  export declare class PositionCalculator {
3
3
  #private;
4
- constructor({ direction, relativeElementRect, positionElementRect, container, nearestNonStaticElementFromElementToPositionRect, disableRepositioning }: TRelativePositionCalculatorConstructorOptions);
4
+ constructor({ direction, relativeElementRect, positionElementRect, container, nearestNonStaticElementFromElementToPositionRect, shouldNotReposition }: TRelativePositionCalculatorConstructorOptions);
5
5
  calculatePosition(): TRelativePositionControllerPositionData;
6
6
  private _canFitTopSide;
7
7
  private _canFitBottomSide;
package/build/esm/packages/phoenix/src/controllers/relative_position_controller/relative_position_calculator.js CHANGED
@@ -1,22 +1,22 @@
1
1
  import { __classPrivateFieldSet, __classPrivateFieldGet } from '../../../../../external/tslib/tslib.es6.js';
2
2
  import { CALCULATOR_DIRECTIONS } from './relative_position_controller_constants.js';
3
3
 
4
- var _PositionCalculator_direction, _PositionCalculator_relativeElementRect, _PositionCalculator_positionElementRect, _PositionCalculator_nearestNonStaticElementFromElementToPositionRect, _PositionCalculator_containerRect, _PositionCalculator_documentHeight, _PositionCalculator_disableRepositioning;
4
+ var _PositionCalculator_direction, _PositionCalculator_relativeElementRect, _PositionCalculator_positionElementRect, _PositionCalculator_nearestNonStaticElementFromElementToPositionRect, _PositionCalculator_containerRect, _PositionCalculator_documentHeight, _PositionCalculator_shouldNotReposition;
5
5
  class PositionCalculator {
6
- constructor({ direction, relativeElementRect, positionElementRect, container = document.body, nearestNonStaticElementFromElementToPositionRect, disableRepositioning }) {
6
+ constructor({ direction, relativeElementRect, positionElementRect, container = document.body, nearestNonStaticElementFromElementToPositionRect, shouldNotReposition }) {
7
7
  _PositionCalculator_direction.set(this, void 0);
8
8
  _PositionCalculator_relativeElementRect.set(this, void 0);
9
9
  _PositionCalculator_positionElementRect.set(this, void 0);
10
10
  _PositionCalculator_nearestNonStaticElementFromElementToPositionRect.set(this, void 0);
11
11
  _PositionCalculator_containerRect.set(this, void 0);
12
12
  _PositionCalculator_documentHeight.set(this, void 0);
13
- _PositionCalculator_disableRepositioning.set(this, void 0);
13
+ _PositionCalculator_shouldNotReposition.set(this, void 0);
14
14
  __classPrivateFieldSet(this, _PositionCalculator_direction, direction, "f");
15
15
  __classPrivateFieldSet(this, _PositionCalculator_relativeElementRect, relativeElementRect, "f");
16
16
  __classPrivateFieldSet(this, _PositionCalculator_positionElementRect, positionElementRect, "f");
17
17
  __classPrivateFieldSet(this, _PositionCalculator_nearestNonStaticElementFromElementToPositionRect, nearestNonStaticElementFromElementToPositionRect, "f");
18
18
  __classPrivateFieldSet(this, _PositionCalculator_containerRect, container.getBoundingClientRect(), "f");
19
- __classPrivateFieldSet(this, _PositionCalculator_disableRepositioning, !!disableRepositioning, "f");
19
+ __classPrivateFieldSet(this, _PositionCalculator_shouldNotReposition, !!shouldNotReposition, "f");
20
20
  const body = document.body;
21
21
  const documentElement = document.documentElement;
22
22
  __classPrivateFieldSet(this, _PositionCalculator_documentHeight, Math.max(body.scrollHeight, body.offsetHeight, documentElement.clientHeight, documentElement.scrollHeight, documentElement.offsetHeight), "f");
@@ -48,7 +48,7 @@ class PositionCalculator {
48
48
  const centerOfRelativeElement = (topSideOfRelativeElement + bottomSideOfRelativeElement) / 2;
49
49
  switch (side) {
50
50
  case CALCULATOR_DIRECTIONS.top:
51
- if (__classPrivateFieldGet(this, _PositionCalculator_disableRepositioning, "f"))
51
+ if (__classPrivateFieldGet(this, _PositionCalculator_shouldNotReposition, "f"))
52
52
  return { top: topSideOfRelativeElement, calculatedSide: CALCULATOR_DIRECTIONS.top };
53
53
  if (!this._canFitTopSide() && !this._canFitBottomSide() && !this._canFitCenter(centerOfRelativeElement))
54
54
  return { top: bottomSideOfRelativeElement, calculatedSide: CALCULATOR_DIRECTIONS.bottom, shrinkMode: true };
@@ -58,7 +58,7 @@ class PositionCalculator {
58
58
  return { top: bottomSideOfRelativeElement, calculatedSide: CALCULATOR_DIRECTIONS.bottom };
59
59
  return { top: topSideOfRelativeElement, calculatedSide: CALCULATOR_DIRECTIONS.top };
60
60
  case CALCULATOR_DIRECTIONS.bottom:
61
- if (__classPrivateFieldGet(this, _PositionCalculator_disableRepositioning, "f"))
61
+ if (__classPrivateFieldGet(this, _PositionCalculator_shouldNotReposition, "f"))
62
62
  return { top: bottomSideOfRelativeElement, calculatedSide: CALCULATOR_DIRECTIONS.bottom };
63
63
  if (!this._canFitTopSide() && !this._canFitBottomSide() && !this._canFitCenter(centerOfRelativeElement))
64
64
  return { top: bottomSideOfRelativeElement, calculatedSide: CALCULATOR_DIRECTIONS.bottom, shrinkMode: true };
@@ -101,7 +101,7 @@ class PositionCalculator {
101
101
  }
102
102
  }
103
103
  }
104
- _PositionCalculator_direction = new WeakMap(), _PositionCalculator_relativeElementRect = new WeakMap(), _PositionCalculator_positionElementRect = new WeakMap(), _PositionCalculator_nearestNonStaticElementFromElementToPositionRect = new WeakMap(), _PositionCalculator_containerRect = new WeakMap(), _PositionCalculator_documentHeight = new WeakMap(), _PositionCalculator_disableRepositioning = new WeakMap();
104
+ _PositionCalculator_direction = new WeakMap(), _PositionCalculator_relativeElementRect = new WeakMap(), _PositionCalculator_positionElementRect = new WeakMap(), _PositionCalculator_nearestNonStaticElementFromElementToPositionRect = new WeakMap(), _PositionCalculator_containerRect = new WeakMap(), _PositionCalculator_documentHeight = new WeakMap(), _PositionCalculator_shouldNotReposition = new WeakMap();
105
105
 
106
106
  export { PositionCalculator };
107
107
  //# sourceMappingURL=relative_position_calculator.js.map
package/build/esm/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller.d.ts CHANGED
@@ -1,13 +1,16 @@
1
1
  import { IRelativePositionController, TRelativePositionControllerConstructorOptions } from "./relative_position_controller_types";
2
2
  export declare class RelativePositionController implements IRelativePositionController {
3
3
  #private;
4
- constructor({ host, container, direction, relativeElement, elementToPosition, shouldDisablePositioning, portalElementsNames }: TRelativePositionControllerConstructorOptions);
4
+ constructor({ host, container, direction, relativeElement, elementToPosition, disablePositioningOnCondition, portalElementsNames }: TRelativePositionControllerConstructorOptions);
5
5
  hostConnected(): void;
6
6
  hostDisconnected(): void;
7
- position(disableRepositioning?: boolean): void;
7
+ position(shouldNotReposition?: boolean): void;
8
+ private _dispatchReenabledPositioningEvent;
8
9
  private _findNearestScrollableElement;
9
10
  private _findContainer;
10
11
  private _findParentBasedOnStyle;
11
12
  private _setElementPosition;
13
+ private _disableShrinkMode;
14
+ private _enableShrinkMode;
12
15
  disableRelativePositioning(): void;
13
16
  }
package/build/esm/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller.js CHANGED
@@ -1,13 +1,13 @@
1
1
  import { __classPrivateFieldGet, __classPrivateFieldSet } from '../../../../../external/tslib/tslib.es6.js';
2
- import { DEFAULT_THROTTLE_WAIT_TIME, DEFAULT_SCROLL_THROTTLE_WAIT_TIME, OVERFLOW_SCROLL, OVERFLOW_AUTO, NON_STATIC_POSITIONS, SHRINK_MODE_BOTTOM_MARGIN, SHRINK_MODE_MIN_HEIGHT } from './relative_position_controller_constants.js';
2
+ import { DEFAULT_THROTTLE_WAIT_TIME, DEFAULT_SCROLL_THROTTLE_WAIT_TIME, RELATIVE_POSITION_CONTROLLER_EVENTS, OVERFLOW_SCROLL, OVERFLOW_AUTO, NON_STATIC_POSITIONS, SHRINK_MODE_BOTTOM_MARGIN, SHRINK_MODE_MIN_HEIGHT } from './relative_position_controller_constants.js';
3
3
  import { PositionCalculator } from './relative_position_calculator.js';
4
4
  import 'lit';
5
5
  import { SCROLLABLE_CLASS_NAME } from '../../global_constants.js';
6
6
  import lodash from '../../../../../external/lodash/lodash.js';
7
7
 
8
- var _RelativePositionController_host, _RelativePositionController_container, _RelativePositionController_nearestNonStaticElementFromElementToPosition, _RelativePositionController_direction, _RelativePositionController_nearestScrollableElement, _RelativePositionController_relativeElement, _RelativePositionController_elementToPosition, _RelativePositionController_shouldDisablePositioning, _RelativePositionController_portalElementsNames, _RelativePositionController_isInitiallyScrollable, _RelativePositionController_initialMaxHeight, _RelativePositionController_initialHeight, _RelativePositionController_calculatedDirection, _RelativePositionController_throttledReposition, _RelativePositionController_throttledRepositionForScroll;
8
+ var _RelativePositionController_host, _RelativePositionController_container, _RelativePositionController_nearestNonStaticElementFromElementToPosition, _RelativePositionController_direction, _RelativePositionController_nearestScrollableElement, _RelativePositionController_relativeElement, _RelativePositionController_elementToPosition, _RelativePositionController_disablePositioningOnCondition, _RelativePositionController_portalElementsNames, _RelativePositionController_isInitiallyScrollable, _RelativePositionController_initialMaxHeight, _RelativePositionController_initialHeight, _RelativePositionController_calculatedDirection, _RelativePositionController_hasPositioningBeenDisabled, _RelativePositionController_doesCurrentlyHaveShrinkMode, _RelativePositionController_throttledReposition, _RelativePositionController_throttledRepositionForScroll;
9
9
  class RelativePositionController {
10
- constructor({ host, container, direction, relativeElement, elementToPosition, shouldDisablePositioning, portalElementsNames = [] }) {
10
+ constructor({ host, container, direction, relativeElement, elementToPosition, disablePositioningOnCondition = () => true, portalElementsNames = [] }) {
11
11
  _RelativePositionController_host.set(this, void 0);
12
12
  _RelativePositionController_container.set(this, void 0);
13
13
  _RelativePositionController_nearestNonStaticElementFromElementToPosition.set(this, void 0);
@@ -15,40 +15,32 @@ class RelativePositionController {
15
15
  _RelativePositionController_nearestScrollableElement.set(this, void 0);
16
16
  _RelativePositionController_relativeElement.set(this, void 0);
17
17
  _RelativePositionController_elementToPosition.set(this, void 0);
18
- _RelativePositionController_shouldDisablePositioning.set(this, void 0);
18
+ _RelativePositionController_disablePositioningOnCondition.set(this, void 0);
19
19
  _RelativePositionController_portalElementsNames.set(this, void 0);
20
20
  _RelativePositionController_isInitiallyScrollable.set(this, void 0);
21
21
  _RelativePositionController_initialMaxHeight.set(this, void 0);
22
22
  _RelativePositionController_initialHeight.set(this, void 0);
23
23
  _RelativePositionController_calculatedDirection.set(this, void 0);
24
+ _RelativePositionController_hasPositioningBeenDisabled.set(this, void 0);
25
+ _RelativePositionController_doesCurrentlyHaveShrinkMode.set(this, void 0);
24
26
  _RelativePositionController_throttledReposition.set(this, lodash.throttle(() => {
25
- if (!__classPrivateFieldGet(this, _RelativePositionController_shouldDisablePositioning, "f")) {
26
- this.position(true);
27
- return;
28
- }
29
- __classPrivateFieldGet(this, _RelativePositionController_shouldDisablePositioning, "f").call(this) ? this.disableRelativePositioning() : this.position(true);
27
+ __classPrivateFieldGet(this, _RelativePositionController_disablePositioningOnCondition, "f").call(this) ? this.disableRelativePositioning() : this.position(true);
30
28
  }, DEFAULT_THROTTLE_WAIT_TIME));
31
29
  _RelativePositionController_throttledRepositionForScroll.set(this, lodash.throttle(() => {
32
- if (!__classPrivateFieldGet(this, _RelativePositionController_shouldDisablePositioning, "f")) {
33
- this.position(true);
34
- return;
35
- }
36
- __classPrivateFieldGet(this, _RelativePositionController_shouldDisablePositioning, "f").call(this) ? this.disableRelativePositioning() : this.position(true);
30
+ __classPrivateFieldGet(this, _RelativePositionController_disablePositioningOnCondition, "f").call(this) ? this.disableRelativePositioning() : this.position(true);
37
31
  }, DEFAULT_SCROLL_THROTTLE_WAIT_TIME));
38
32
  __classPrivateFieldSet(this, _RelativePositionController_host, host, "f");
39
33
  __classPrivateFieldSet(this, _RelativePositionController_container, container, "f");
40
34
  __classPrivateFieldSet(this, _RelativePositionController_direction, direction, "f");
41
35
  __classPrivateFieldSet(this, _RelativePositionController_relativeElement, relativeElement, "f");
42
36
  __classPrivateFieldSet(this, _RelativePositionController_elementToPosition, elementToPosition, "f");
43
- __classPrivateFieldSet(this, _RelativePositionController_shouldDisablePositioning, shouldDisablePositioning, "f");
37
+ __classPrivateFieldSet(this, _RelativePositionController_disablePositioningOnCondition, disablePositioningOnCondition, "f");
44
38
  __classPrivateFieldSet(this, _RelativePositionController_portalElementsNames, portalElementsNames, "f");
45
39
  __classPrivateFieldSet(this, _RelativePositionController_isInitiallyScrollable, elementToPosition.classList.contains(SCROLLABLE_CLASS_NAME), "f");
46
40
  __classPrivateFieldSet(this, _RelativePositionController_initialMaxHeight, getComputedStyle(elementToPosition).maxHeight, "f");
47
41
  __classPrivateFieldGet(this, _RelativePositionController_host, "f").addController(this);
48
42
  }
49
43
  hostConnected() {
50
- if (!__classPrivateFieldGet(this, _RelativePositionController_relativeElement, "f"))
51
- return;
52
44
  if (!__classPrivateFieldGet(this, _RelativePositionController_nearestScrollableElement, "f")) {
53
45
  __classPrivateFieldSet(this, _RelativePositionController_nearestScrollableElement, this._findNearestScrollableElement(__classPrivateFieldGet(this, _RelativePositionController_relativeElement, "f")), "f");
54
46
  }
@@ -60,29 +52,42 @@ class RelativePositionController {
60
52
  if (__classPrivateFieldGet(this, _RelativePositionController_nearestScrollableElement, "f"))
61
53
  __classPrivateFieldGet(this, _RelativePositionController_nearestScrollableElement, "f").removeEventListener('scroll', __classPrivateFieldGet(this, _RelativePositionController_throttledRepositionForScroll, "f"));
62
54
  }
63
- position(disableRepositioning = false) {
64
- if (!__classPrivateFieldGet(this, _RelativePositionController_relativeElement, "f") || !__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f"))
65
- return;
66
- __classPrivateFieldSet(this, _RelativePositionController_nearestNonStaticElementFromElementToPosition, this._findContainer(__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f")), "f");
55
+ position(shouldNotReposition = false) {
56
+ if (__classPrivateFieldGet(this, _RelativePositionController_hasPositioningBeenDisabled, "f"))
57
+ this._dispatchReenabledPositioningEvent();
58
+ if (!__classPrivateFieldGet(this, _RelativePositionController_nearestNonStaticElementFromElementToPosition, "f"))
59
+ __classPrivateFieldSet(this, _RelativePositionController_nearestNonStaticElementFromElementToPosition, this._findContainer(__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f")), "f");
67
60
  if (!__classPrivateFieldGet(this, _RelativePositionController_container, "f"))
68
61
  __classPrivateFieldSet(this, _RelativePositionController_container, __classPrivateFieldGet(this, _RelativePositionController_nearestNonStaticElementFromElementToPosition, "f"), "f");
69
62
  const positionElementRect = __classPrivateFieldGet(this, _RelativePositionController_initialHeight, "f")
70
- ? {
71
- ...__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").getBoundingClientRect().toJSON(),
72
- height: __classPrivateFieldGet(this, _RelativePositionController_initialHeight, "f")
73
- }
63
+ ? { ...__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").getBoundingClientRect().toJSON(), height: __classPrivateFieldGet(this, _RelativePositionController_initialHeight, "f") }
74
64
  : __classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").getBoundingClientRect();
75
65
  const position = new PositionCalculator({
76
- direction: disableRepositioning && __classPrivateFieldGet(this, _RelativePositionController_calculatedDirection, "f") ? __classPrivateFieldGet(this, _RelativePositionController_calculatedDirection, "f") : __classPrivateFieldGet(this, _RelativePositionController_direction, "f"),
66
+ direction: shouldNotReposition && __classPrivateFieldGet(this, _RelativePositionController_calculatedDirection, "f") ? __classPrivateFieldGet(this, _RelativePositionController_calculatedDirection, "f") : __classPrivateFieldGet(this, _RelativePositionController_direction, "f"),
77
67
  relativeElementRect: __classPrivateFieldGet(this, _RelativePositionController_relativeElement, "f").getBoundingClientRect(),
78
68
  positionElementRect,
79
69
  nearestNonStaticElementFromElementToPositionRect: __classPrivateFieldGet(this, _RelativePositionController_nearestNonStaticElementFromElementToPosition, "f").getBoundingClientRect(),
80
70
  container: __classPrivateFieldGet(this, _RelativePositionController_container, "f"),
81
- disableRepositioning
71
+ shouldNotReposition
82
72
  }).calculatePosition();
83
- if (!disableRepositioning)
84
- __classPrivateFieldSet(this, _RelativePositionController_calculatedDirection, position.calculatedSide, "f");
85
73
  this._setElementPosition(position);
74
+ const isRepositioningDisabled = shouldNotReposition && __classPrivateFieldGet(this, _RelativePositionController_doesCurrentlyHaveShrinkMode, "f");
75
+ if (isRepositioningDisabled)
76
+ return;
77
+ __classPrivateFieldSet(this, _RelativePositionController_calculatedDirection, position.calculatedSide, "f");
78
+ __classPrivateFieldSet(this, _RelativePositionController_doesCurrentlyHaveShrinkMode, !!position.shrinkMode, "f");
79
+ if (!position.shrinkMode) {
80
+ this._disableShrinkMode();
81
+ return;
82
+ }
83
+ this._enableShrinkMode();
84
+ }
85
+ _dispatchReenabledPositioningEvent() {
86
+ __classPrivateFieldSet(this, _RelativePositionController_hasPositioningBeenDisabled, false, "f");
87
+ const enabledPositioningEvent = new CustomEvent(RELATIVE_POSITION_CONTROLLER_EVENTS.enabledPositioning, {
88
+ bubbles: true
89
+ });
90
+ __classPrivateFieldGet(this, _RelativePositionController_host, "f").dispatchEvent(enabledPositioningEvent);
86
91
  }
87
92
  _findNearestScrollableElement(element) {
88
93
  const overflowArray = ['overflow', 'overflowY', 'overflowX'];
@@ -104,37 +109,37 @@ class RelativePositionController {
104
109
  return this._findParentBasedOnStyle(parent, styles, callback);
105
110
  }
106
111
  _setElementPosition(position) {
107
- if (!__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f") || !__classPrivateFieldGet(this, _RelativePositionController_relativeElement, "f"))
108
- return;
109
- const { style: elementStyle } = __classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f");
110
- if (elementStyle.position !== 'absolute')
111
- elementStyle.position = 'absolute';
112
- if (elementStyle.top !== '0')
113
- elementStyle.top = '0';
114
- if (elementStyle.left !== '0')
115
- elementStyle.left = '0';
112
+ __classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").style.position = 'absolute';
113
+ __classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").style.top = '0';
114
+ __classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").style.left = '0';
116
115
  __classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").style.transform = `translate3d(${position.left}px, ${position.top}px, 0)`;
117
- if (!position.shrinkMode) {
118
- if (!__classPrivateFieldGet(this, _RelativePositionController_isInitiallyScrollable, "f"))
119
- __classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").classList.remove(SCROLLABLE_CLASS_NAME);
120
- elementStyle.maxHeight = __classPrivateFieldGet(this, _RelativePositionController_initialMaxHeight, "f") !== 'none' ? __classPrivateFieldGet(this, _RelativePositionController_initialMaxHeight, "f") : '';
121
- return;
122
- }
116
+ }
117
+ _disableShrinkMode() {
118
+ if (!__classPrivateFieldGet(this, _RelativePositionController_isInitiallyScrollable, "f"))
119
+ __classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").classList.remove(SCROLLABLE_CLASS_NAME);
120
+ __classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").style.maxHeight = __classPrivateFieldGet(this, _RelativePositionController_initialMaxHeight, "f") !== 'none' ? __classPrivateFieldGet(this, _RelativePositionController_initialMaxHeight, "f") : '';
121
+ }
122
+ _enableShrinkMode() {
123
123
  if (!__classPrivateFieldGet(this, _RelativePositionController_initialHeight, "f"))
124
124
  __classPrivateFieldSet(this, _RelativePositionController_initialHeight, __classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").getBoundingClientRect().height, "f");
125
125
  __classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").classList.add(SCROLLABLE_CLASS_NAME);
126
126
  const shrinkModeMaxHeight = window.innerHeight - __classPrivateFieldGet(this, _RelativePositionController_relativeElement, "f").getBoundingClientRect().bottom - SHRINK_MODE_BOTTOM_MARGIN;
127
- elementStyle.maxHeight = `${shrinkModeMaxHeight > SHRINK_MODE_MIN_HEIGHT ? shrinkModeMaxHeight : SHRINK_MODE_MIN_HEIGHT}px`;
127
+ __classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f").style.maxHeight = `${shrinkModeMaxHeight > SHRINK_MODE_MIN_HEIGHT ? shrinkModeMaxHeight : SHRINK_MODE_MIN_HEIGHT}px`;
128
128
  }
129
129
  disableRelativePositioning() {
130
- if (!__classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f"))
131
- return;
130
+ if (!__classPrivateFieldGet(this, _RelativePositionController_hasPositioningBeenDisabled, "f")) {
131
+ __classPrivateFieldSet(this, _RelativePositionController_hasPositioningBeenDisabled, true, "f");
132
+ const disabledPositioningEvent = new CustomEvent(RELATIVE_POSITION_CONTROLLER_EVENTS.disabledPositioning, {
133
+ bubbles: true
134
+ });
135
+ __classPrivateFieldGet(this, _RelativePositionController_host, "f").dispatchEvent(disabledPositioningEvent);
136
+ }
132
137
  const { style: elementStyle } = __classPrivateFieldGet(this, _RelativePositionController_elementToPosition, "f");
133
138
  elementStyle.position = '';
134
139
  elementStyle.transform = '';
135
140
  }
136
141
  }
137
- _RelativePositionController_host = new WeakMap(), _RelativePositionController_container = new WeakMap(), _RelativePositionController_nearestNonStaticElementFromElementToPosition = new WeakMap(), _RelativePositionController_direction = new WeakMap(), _RelativePositionController_nearestScrollableElement = new WeakMap(), _RelativePositionController_relativeElement = new WeakMap(), _RelativePositionController_elementToPosition = new WeakMap(), _RelativePositionController_shouldDisablePositioning = new WeakMap(), _RelativePositionController_portalElementsNames = new WeakMap(), _RelativePositionController_isInitiallyScrollable = new WeakMap(), _RelativePositionController_initialMaxHeight = new WeakMap(), _RelativePositionController_initialHeight = new WeakMap(), _RelativePositionController_calculatedDirection = new WeakMap(), _RelativePositionController_throttledReposition = new WeakMap(), _RelativePositionController_throttledRepositionForScroll = new WeakMap();
142
+ _RelativePositionController_host = new WeakMap(), _RelativePositionController_container = new WeakMap(), _RelativePositionController_nearestNonStaticElementFromElementToPosition = new WeakMap(), _RelativePositionController_direction = new WeakMap(), _RelativePositionController_nearestScrollableElement = new WeakMap(), _RelativePositionController_relativeElement = new WeakMap(), _RelativePositionController_elementToPosition = new WeakMap(), _RelativePositionController_disablePositioningOnCondition = new WeakMap(), _RelativePositionController_portalElementsNames = new WeakMap(), _RelativePositionController_isInitiallyScrollable = new WeakMap(), _RelativePositionController_initialMaxHeight = new WeakMap(), _RelativePositionController_initialHeight = new WeakMap(), _RelativePositionController_calculatedDirection = new WeakMap(), _RelativePositionController_hasPositioningBeenDisabled = new WeakMap(), _RelativePositionController_doesCurrentlyHaveShrinkMode = new WeakMap(), _RelativePositionController_throttledReposition = new WeakMap(), _RelativePositionController_throttledRepositionForScroll = new WeakMap();
138
143
 
139
144
  export { RelativePositionController };
140
145
  //# sourceMappingURL=relative_position_controller.js.map
package/build/esm/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,+DAA+D,4CAAgD;AAC/G;AACA;AACA;AACA;AACA,mBAAmB,0CAA8C;AACjE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,+DAA+D,4CAAgD;AAC/G;AACA;AACA;AACA;AACA,mBAAmB,0CAA8C;AACjE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/controllers/relative_position_controller/relative_position_controller_constants.d.ts CHANGED
@@ -26,3 +26,7 @@ export declare const DEFAULT_THROTTLE_WAIT_TIME = 300;
26
26
  export declare const DEFAULT_SCROLL_THROTTLE_WAIT_TIME = 15;
27
27
  export declare const SHRINK_MODE_BOTTOM_MARGIN = 20;
28
28
  export declare const SHRINK_MODE_MIN_HEIGHT = 80;
29
+ export declare const RELATIVE_POSITION_CONTROLLER_EVENTS: {
30
+ enabledPositioning: string;
31
+ disabledPositioning: string;
32
+ };
package/build/esm/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller_constants.js CHANGED
@@ -25,7 +25,12 @@ const OVERFLOW_AUTO = 'auto';
25
25
  const DEFAULT_THROTTLE_WAIT_TIME = 300;
26
26
  const DEFAULT_SCROLL_THROTTLE_WAIT_TIME = 15;
27
27
  const SHRINK_MODE_BOTTOM_MARGIN = 20;
28
- const SHRINK_MODE_MIN_HEIGHT = 80;
28
+ const SHRINK_MODE_MIN_HEIGHT = 80;
29
+ const RELATIVE_POSITION_CONTROLLER_EVENT_NAME = 'relative_position_controller';
30
+ const RELATIVE_POSITION_CONTROLLER_EVENTS = {
31
+ enabledPositioning: `${RELATIVE_POSITION_CONTROLLER_EVENT_NAME}.enabledPositioning`,
32
+ disabledPositioning: `${RELATIVE_POSITION_CONTROLLER_EVENT_NAME}.disabledPositioning`
33
+ };
29
34
 
30
- export { CALCULATOR_DIRECTIONS, DEFAULT_SCROLL_THROTTLE_WAIT_TIME, DEFAULT_THROTTLE_WAIT_TIME, DIRECTIONS, NON_STATIC_POSITIONS, OVERFLOW_AUTO, OVERFLOW_SCROLL, SHRINK_MODE_BOTTOM_MARGIN, SHRINK_MODE_MIN_HEIGHT };
35
+ export { CALCULATOR_DIRECTIONS, DEFAULT_SCROLL_THROTTLE_WAIT_TIME, DEFAULT_THROTTLE_WAIT_TIME, DIRECTIONS, NON_STATIC_POSITIONS, OVERFLOW_AUTO, OVERFLOW_SCROLL, RELATIVE_POSITION_CONTROLLER_EVENTS, SHRINK_MODE_BOTTOM_MARGIN, SHRINK_MODE_MIN_HEIGHT };
31
36
  //# sourceMappingURL=relative_position_controller_constants.js.map
package/build/esm/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller_constants.js.map CHANGED
@@ -1 +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;"}
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;"}
package/build/esm/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller_types.d.ts CHANGED
@@ -9,7 +9,7 @@ export declare type TRelativePositionControllerConstructorOptions = {
9
9
  container?: HTMLElement;
10
10
  relativeElement: HTMLElement;
11
11
  elementToPosition: HTMLElement;
12
- shouldDisablePositioning?: () => boolean;
12
+ disablePositioningOnCondition?: () => boolean;
13
13
  portalElementsNames?: string[];
14
14
  };
15
15
  export interface IRelativePositionController extends ReactiveController {
@@ -30,5 +30,5 @@ export declare type TRelativePositionCalculatorConstructorOptions = {
30
30
  positionElementRect: DOMRect;
31
31
  nearestNonStaticElementFromElementToPositionRect: DOMRect;
32
32
  container?: HTMLElement;
33
- disableRepositioning?: boolean;
33
+ shouldNotReposition?: boolean;
34
34
  };
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": "0.14.1",
5
+ "version": "0.14.3",
6
6
  "description": "phoenix design system",
7
7
  "author": "zefirek",
8
8
  "license": "MIT",