@shoper/phoenix_design_system 1.1.2 → 1.1.3-0

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 (18) hide show
  1. package/build/cjs/packages/phoenix/src/components/dropdown/dropdown.js +1 -2
  2. package/build/cjs/packages/phoenix/src/components/dropdown/dropdown.js.map +1 -1
  3. package/build/cjs/packages/phoenix/src/components/dropdown/dropdown_constants.js +3 -1
  4. package/build/cjs/packages/phoenix/src/components/dropdown/dropdown_constants.js.map +1 -1
  5. package/build/cjs/packages/phoenix/src/components/dropdown/dropdown_toggler.js +13 -8
  6. package/build/cjs/packages/phoenix/src/components/dropdown/dropdown_toggler.js.map +1 -1
  7. package/build/cjs/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller_constants.js +1 -1
  8. package/build/esm/packages/phoenix/src/components/dropdown/dropdown.js +1 -2
  9. package/build/esm/packages/phoenix/src/components/dropdown/dropdown.js.map +1 -1
  10. package/build/esm/packages/phoenix/src/components/dropdown/dropdown_constants.d.ts +1 -0
  11. package/build/esm/packages/phoenix/src/components/dropdown/dropdown_constants.js +3 -2
  12. package/build/esm/packages/phoenix/src/components/dropdown/dropdown_constants.js.map +1 -1
  13. package/build/esm/packages/phoenix/src/components/dropdown/dropdown_toggler.d.ts +1 -1
  14. package/build/esm/packages/phoenix/src/components/dropdown/dropdown_toggler.js +15 -10
  15. package/build/esm/packages/phoenix/src/components/dropdown/dropdown_toggler.js.map +1 -1
  16. package/build/esm/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller_constants.d.ts +1 -1
  17. package/build/esm/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller_constants.js +1 -1
  18. package/package.json +1 -1
package/build/cjs/packages/phoenix/src/components/dropdown/dropdown.js CHANGED
@@ -273,10 +273,9 @@ exports.HDropdown = HDropdown_1 = class HDropdown extends phoenix_light_lit_elem
273
273
  return this._findRootDropdown(element.parentElement || document.body);
274
274
  }
275
275
  _setupListeners() {
276
- var _a;
277
276
  this.addEventListener(relative_position_controller_constants.RELATIVE_POSITION_CONTROLLER_EVENTS.disabledPositioning, this._handleDisabledPositioning);
278
277
  this.addEventListener(relative_position_controller_constants.RELATIVE_POSITION_CONTROLLER_EVENTS.enabledPositioning, this._handleEnabledPositioning);
279
- (_a = this.$dropdownToggler) === null || _a === void 0 ? void 0 : _a.addEventListener(dropdown_constants.DROPDOWN_EVENTS.toggle, this.toggle);
278
+ this.addEventListener(dropdown_constants.DROPDOWN_EVENTS.toggle, this.toggle);
280
279
  document.addEventListener(dropdown_constants.DROPDOWN_EVENTS.hide, this.hide);
281
280
  window.addEventListener('resize', this._observeScrollToggling);
282
281
  document.addEventListener('keydown', this._closeDropdownOnEscape);
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,uBAAuB,4CAAgD;AACvE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,uBAAuB,4CAAgD;AACvE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/components/dropdown/dropdown_constants.js CHANGED
@@ -20,7 +20,8 @@ const DROPDOWN_CONTENT_CSS_CLASS = `${DROPDOWN_CSS_CLASS}__content`;
20
20
  const DROPDOWN_TOGGLER_CSS_CLASS = `${DROPDOWN_CSS_CLASS}__toggler`;
21
21
  const DROPDOWN_CONTENT_VISIBLE_CLASS = `${DROPDOWN_CONTENT_CSS_CLASS}_visible`;
22
22
  const DROPDOWN_CONTENT_SHOW = `${DROPDOWN_CONTENT_CSS_CLASS}_show`;
23
- const DROPDOWN_CONTENT_HIDE = `${DROPDOWN_CONTENT_CSS_CLASS}_hide`;
23
+ const DROPDOWN_CONTENT_HIDE = `${DROPDOWN_CONTENT_CSS_CLASS}_hide`;
24
+ const DROPDOWN_TOGGLE_ON_HOVER_ATTRIBUTE_NAME = 'toggleOnHover';
24
25
 
25
26
  exports.DEFAULT_DROPDOWN_PORTAL_NAME = DEFAULT_DROPDOWN_PORTAL_NAME;
26
27
  exports.DROPDOWN_CONTAINER_NAME = DROPDOWN_CONTAINER_NAME;
@@ -34,4 +35,5 @@ exports.DROPDOWN_EVENTS = DROPDOWN_EVENTS;
34
35
  exports.DROPDOWN_NAME = DROPDOWN_NAME;
35
36
  exports.DROPDOWN_TOGGLER_CSS_CLASS = DROPDOWN_TOGGLER_CSS_CLASS;
36
37
  exports.DROPDOWN_TOGGLER_NAME = DROPDOWN_TOGGLER_NAME;
38
+ exports.DROPDOWN_TOGGLE_ON_HOVER_ATTRIBUTE_NAME = DROPDOWN_TOGGLE_ON_HOVER_ATTRIBUTE_NAME;
37
39
  //# sourceMappingURL=dropdown_constants.js.map
package/build/cjs/packages/phoenix/src/components/dropdown/dropdown_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;"}
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;"}
package/build/cjs/packages/phoenix/src/components/dropdown/dropdown_toggler.js CHANGED
@@ -8,6 +8,7 @@ var utilities = require('@dreamcommerce/utilities');
8
8
  var phoenix_light_lit_element = require('../../core/phoenix_light_lit_element/phoenix_light_lit_element.js');
9
9
  var phoenix_custom_element = require('../../core/decorators/phoenix_custom_element.js');
10
10
  var btn_controller = require('../../controllers/btn_controller/btn_controller.js');
11
+ var global_constants = require('../../global_constants.js');
11
12
  var dropdown_constants = require('./dropdown_constants.js');
12
13
  var toggle_element_aria_controller = require('../../controllers/toggle_element_aria_controller/toggle_element_aria_controller.js');
13
14
 
@@ -15,11 +16,15 @@ exports.HDropdownToggler = class HDropdownToggler extends phoenix_light_lit_elem
15
16
  constructor() {
16
17
  super();
17
18
  this.name = '';
18
- this.toggleOnHover = false;
19
19
  this._dispatchToggleDropdownEventWithKeyboard = (ev) => {
20
20
  ev.stopImmediatePropagation();
21
21
  this._dispatchToggleDropdownEvent(ev);
22
22
  };
23
+ this._dispatchToggleDropdownEventOnMobile = (ev) => {
24
+ if (window.innerWidth > global_constants.BREAKPOINTS.xs)
25
+ return;
26
+ this._dispatchToggleDropdownEvent(ev);
27
+ };
23
28
  this._dispatchToggleDropdownEvent = (ev) => {
24
29
  ev.preventDefault();
25
30
  const toggleDropdownEvent = new CustomEvent(dropdown_constants.DROPDOWN_EVENTS.toggle, {
@@ -46,15 +51,19 @@ exports.HDropdownToggler = class HDropdownToggler extends phoenix_light_lit_elem
46
51
  var _a;
47
52
  super.connectedCallback();
48
53
  this._btnController = new btn_controller.BtnController(this, this._dispatchToggleDropdownEventWithKeyboard);
49
- this._$dropdown = this.parentElement;
54
+ this._$dropdown = this.closest(dropdown_constants.DROPDOWN_CONTAINER_NAME);
50
55
  if (this._$dropdown.isOpened)
51
56
  this._toggleElementAriaController = new toggle_element_aria_controller.ToggleElementAriaController({
52
57
  host: this,
53
58
  initialAriaExpandedValue: this._$dropdown.isOpened()
54
59
  });
55
- this.toggleOnHover = ((_a = this._$dropdown) === null || _a === void 0 ? void 0 : _a.getAttribute('toggleOnHover')) !== null;
56
- this.addEventListener('click', this._dispatchToggleDropdownEvent);
57
60
  document.addEventListener('keydown', this._handleFocusToOpenedDropdown);
61
+ const hasToggleOnHover = ((_a = this._$dropdown) === null || _a === void 0 ? void 0 : _a.getAttribute(dropdown_constants.DROPDOWN_TOGGLE_ON_HOVER_ATTRIBUTE_NAME)) !== null;
62
+ if (hasToggleOnHover) {
63
+ this.addEventListener('click', this._dispatchToggleDropdownEventOnMobile);
64
+ return;
65
+ }
66
+ this.addEventListener('click', this._dispatchToggleDropdownEvent);
58
67
  }
59
68
  disconnectedCallback() {
60
69
  super.disconnectedCallback();
@@ -65,10 +74,6 @@ tslib_es6.__decorate([
65
74
  decorators.property({ type: String, reflect: true }),
66
75
  tslib_es6.__metadata("design:type", Object)
67
76
  ], exports.HDropdownToggler.prototype, "name", void 0);
68
- tslib_es6.__decorate([
69
- decorators.state(),
70
- tslib_es6.__metadata("design:type", Object)
71
- ], exports.HDropdownToggler.prototype, "toggleOnHover", void 0);
72
77
  exports.HDropdownToggler = tslib_es6.__decorate([
73
78
  phoenix_custom_element.phoenixCustomElement('h-dropdown-toggler'),
74
79
  tslib_es6.__metadata("design:paramtypes", [])
package/build/cjs/packages/phoenix/src/components/dropdown/dropdown_toggler.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;"}
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;"}
package/build/cjs/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller_constants.js CHANGED
@@ -43,7 +43,7 @@ const CALCULATOR_DIRECTIONS = {
43
43
  const NON_STATIC_POSITIONS = ['relative', 'absolute', 'fixed', 'sticky'];
44
44
  const OVERFLOW_SCROLL = 'scroll';
45
45
  const OVERFLOW_AUTO = 'auto';
46
- const DEFAULT_THROTTLE_WAIT_TIME = 300;
46
+ const DEFAULT_THROTTLE_WAIT_TIME = 150;
47
47
  const DEFAULT_SCROLL_THROTTLE_WAIT_TIME = 15;
48
48
  const SHRINK_MODE_BOTTOM_MARGIN = 20;
49
49
  const SHRINK_MODE_MIN_HEIGHT = 80;
package/build/esm/packages/phoenix/src/components/dropdown/dropdown.js CHANGED
@@ -269,10 +269,9 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
269
269
  return this._findRootDropdown(element.parentElement || document.body);
270
270
  }
271
271
  _setupListeners() {
272
- var _a;
273
272
  this.addEventListener(RELATIVE_POSITION_CONTROLLER_EVENTS.disabledPositioning, this._handleDisabledPositioning);
274
273
  this.addEventListener(RELATIVE_POSITION_CONTROLLER_EVENTS.enabledPositioning, this._handleEnabledPositioning);
275
- (_a = this.$dropdownToggler) === null || _a === void 0 ? void 0 : _a.addEventListener(DROPDOWN_EVENTS.toggle, this.toggle);
274
+ this.addEventListener(DROPDOWN_EVENTS.toggle, this.toggle);
276
275
  document.addEventListener(DROPDOWN_EVENTS.hide, this.hide);
277
276
  window.addEventListener('resize', this._observeScrollToggling);
278
277
  document.addEventListener('keydown', this._closeDropdownOnEscape);
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,uBAAuB,4CAAgD;AACvE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,uBAAuB,4CAAgD;AACvE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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_constants.d.ts CHANGED
@@ -16,3 +16,4 @@ export declare const DROPDOWN_TOGGLER_CSS_CLASS: string;
16
16
  export declare const DROPDOWN_CONTENT_VISIBLE_CLASS: string;
17
17
  export declare const DROPDOWN_CONTENT_SHOW: string;
18
18
  export declare const DROPDOWN_CONTENT_HIDE: string;
19
+ export declare const DROPDOWN_TOGGLE_ON_HOVER_ATTRIBUTE_NAME = "toggleOnHover";
package/build/esm/packages/phoenix/src/components/dropdown/dropdown_constants.js CHANGED
@@ -16,7 +16,8 @@ const DROPDOWN_CONTENT_CSS_CLASS = `${DROPDOWN_CSS_CLASS}__content`;
16
16
  const DROPDOWN_TOGGLER_CSS_CLASS = `${DROPDOWN_CSS_CLASS}__toggler`;
17
17
  const DROPDOWN_CONTENT_VISIBLE_CLASS = `${DROPDOWN_CONTENT_CSS_CLASS}_visible`;
18
18
  const DROPDOWN_CONTENT_SHOW = `${DROPDOWN_CONTENT_CSS_CLASS}_show`;
19
- const DROPDOWN_CONTENT_HIDE = `${DROPDOWN_CONTENT_CSS_CLASS}_hide`;
19
+ const DROPDOWN_CONTENT_HIDE = `${DROPDOWN_CONTENT_CSS_CLASS}_hide`;
20
+ const DROPDOWN_TOGGLE_ON_HOVER_ATTRIBUTE_NAME = 'toggleOnHover';
20
21
 
21
- export { DEFAULT_DROPDOWN_PORTAL_NAME, DROPDOWN_CONTAINER_NAME, DROPDOWN_CONTENT_CSS_CLASS, DROPDOWN_CONTENT_HIDE, DROPDOWN_CONTENT_NAME, DROPDOWN_CONTENT_SHOW, DROPDOWN_CONTENT_VISIBLE_CLASS, DROPDOWN_CSS_CLASS, DROPDOWN_EVENTS, DROPDOWN_NAME, DROPDOWN_TOGGLER_CSS_CLASS, DROPDOWN_TOGGLER_NAME };
22
+ export { DEFAULT_DROPDOWN_PORTAL_NAME, DROPDOWN_CONTAINER_NAME, DROPDOWN_CONTENT_CSS_CLASS, DROPDOWN_CONTENT_HIDE, DROPDOWN_CONTENT_NAME, DROPDOWN_CONTENT_SHOW, DROPDOWN_CONTENT_VISIBLE_CLASS, DROPDOWN_CSS_CLASS, DROPDOWN_EVENTS, DROPDOWN_NAME, DROPDOWN_TOGGLER_CSS_CLASS, DROPDOWN_TOGGLER_NAME, DROPDOWN_TOGGLE_ON_HOVER_ATTRIBUTE_NAME };
22
23
  //# sourceMappingURL=dropdown_constants.js.map
package/build/esm/packages/phoenix/src/components/dropdown/dropdown_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;"}
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;"}
package/build/esm/packages/phoenix/src/components/dropdown/dropdown_toggler.d.ts CHANGED
@@ -4,10 +4,10 @@ export declare class HDropdownToggler extends PhoenixLightLitElement {
4
4
  private _btnController;
5
5
  private _toggleElementAriaController;
6
6
  private _$dropdown;
7
- toggleOnHover: boolean;
8
7
  constructor();
9
8
  connectedCallback(): void;
10
9
  private _dispatchToggleDropdownEventWithKeyboard;
10
+ private _dispatchToggleDropdownEventOnMobile;
11
11
  private _dispatchToggleDropdownEvent;
12
12
  private _handleFocusToOpenedDropdown;
13
13
  disconnectedCallback(): void;
package/build/esm/packages/phoenix/src/components/dropdown/dropdown_toggler.js CHANGED
@@ -1,21 +1,26 @@
1
1
  import { __decorate, __metadata } from '../../../../../external/tslib/tslib.es6.js';
2
- import { property, state } from 'lit/decorators';
2
+ import { property } from 'lit/decorators';
3
3
  import { UiDomUtils } from '@dreamcommerce/utilities';
4
4
  import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
5
5
  import { phoenixCustomElement } from '../../core/decorators/phoenix_custom_element.js';
6
6
  import { BtnController } from '../../controllers/btn_controller/btn_controller.js';
7
- import { DROPDOWN_EVENTS, DROPDOWN_CONTENT_NAME, DROPDOWN_TOGGLER_CSS_CLASS } from './dropdown_constants.js';
7
+ import { BREAKPOINTS } from '../../global_constants.js';
8
+ import { DROPDOWN_EVENTS, DROPDOWN_CONTENT_NAME, DROPDOWN_TOGGLER_CSS_CLASS, DROPDOWN_CONTAINER_NAME, DROPDOWN_TOGGLE_ON_HOVER_ATTRIBUTE_NAME } from './dropdown_constants.js';
8
9
  import { ToggleElementAriaController } from '../../controllers/toggle_element_aria_controller/toggle_element_aria_controller.js';
9
10
 
10
11
  let HDropdownToggler = class HDropdownToggler extends PhoenixLightLitElement {
11
12
  constructor() {
12
13
  super();
13
14
  this.name = '';
14
- this.toggleOnHover = false;
15
15
  this._dispatchToggleDropdownEventWithKeyboard = (ev) => {
16
16
  ev.stopImmediatePropagation();
17
17
  this._dispatchToggleDropdownEvent(ev);
18
18
  };
19
+ this._dispatchToggleDropdownEventOnMobile = (ev) => {
20
+ if (window.innerWidth > BREAKPOINTS.xs)
21
+ return;
22
+ this._dispatchToggleDropdownEvent(ev);
23
+ };
19
24
  this._dispatchToggleDropdownEvent = (ev) => {
20
25
  ev.preventDefault();
21
26
  const toggleDropdownEvent = new CustomEvent(DROPDOWN_EVENTS.toggle, {
@@ -42,15 +47,19 @@ let HDropdownToggler = class HDropdownToggler extends PhoenixLightLitElement {
42
47
  var _a;
43
48
  super.connectedCallback();
44
49
  this._btnController = new BtnController(this, this._dispatchToggleDropdownEventWithKeyboard);
45
- this._$dropdown = this.parentElement;
50
+ this._$dropdown = this.closest(DROPDOWN_CONTAINER_NAME);
46
51
  if (this._$dropdown.isOpened)
47
52
  this._toggleElementAriaController = new ToggleElementAriaController({
48
53
  host: this,
49
54
  initialAriaExpandedValue: this._$dropdown.isOpened()
50
55
  });
51
- this.toggleOnHover = ((_a = this._$dropdown) === null || _a === void 0 ? void 0 : _a.getAttribute('toggleOnHover')) !== null;
52
- this.addEventListener('click', this._dispatchToggleDropdownEvent);
53
56
  document.addEventListener('keydown', this._handleFocusToOpenedDropdown);
57
+ const hasToggleOnHover = ((_a = this._$dropdown) === null || _a === void 0 ? void 0 : _a.getAttribute(DROPDOWN_TOGGLE_ON_HOVER_ATTRIBUTE_NAME)) !== null;
58
+ if (hasToggleOnHover) {
59
+ this.addEventListener('click', this._dispatchToggleDropdownEventOnMobile);
60
+ return;
61
+ }
62
+ this.addEventListener('click', this._dispatchToggleDropdownEvent);
54
63
  }
55
64
  disconnectedCallback() {
56
65
  super.disconnectedCallback();
@@ -61,10 +70,6 @@ __decorate([
61
70
  property({ type: String, reflect: true }),
62
71
  __metadata("design:type", Object)
63
72
  ], HDropdownToggler.prototype, "name", void 0);
64
- __decorate([
65
- state(),
66
- __metadata("design:type", Object)
67
- ], HDropdownToggler.prototype, "toggleOnHover", void 0);
68
73
  HDropdownToggler = __decorate([
69
74
  phoenixCustomElement('h-dropdown-toggler'),
70
75
  __metadata("design:paramtypes", [])
package/build/esm/packages/phoenix/src/components/dropdown/dropdown_toggler.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;"}
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;"}
package/build/esm/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller_constants.d.ts CHANGED
@@ -56,7 +56,7 @@ export declare const CALCULATOR_DIRECTIONS: {
56
56
  export declare const NON_STATIC_POSITIONS: string[];
57
57
  export declare const OVERFLOW_SCROLL = "scroll";
58
58
  export declare const OVERFLOW_AUTO = "auto";
59
- export declare const DEFAULT_THROTTLE_WAIT_TIME = 300;
59
+ export declare const DEFAULT_THROTTLE_WAIT_TIME = 150;
60
60
  export declare const DEFAULT_SCROLL_THROTTLE_WAIT_TIME = 15;
61
61
  export declare const SHRINK_MODE_BOTTOM_MARGIN = 20;
62
62
  export declare const SHRINK_MODE_MIN_HEIGHT = 80;
package/build/esm/packages/phoenix/src/controllers/relative_position_controller/relative_position_controller_constants.js CHANGED
@@ -39,7 +39,7 @@ const CALCULATOR_DIRECTIONS = {
39
39
  const NON_STATIC_POSITIONS = ['relative', 'absolute', 'fixed', 'sticky'];
40
40
  const OVERFLOW_SCROLL = 'scroll';
41
41
  const OVERFLOW_AUTO = 'auto';
42
- const DEFAULT_THROTTLE_WAIT_TIME = 300;
42
+ const DEFAULT_THROTTLE_WAIT_TIME = 150;
43
43
  const DEFAULT_SCROLL_THROTTLE_WAIT_TIME = 15;
44
44
  const SHRINK_MODE_BOTTOM_MARGIN = 20;
45
45
  const SHRINK_MODE_MIN_HEIGHT = 80;
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@shoper/phoenix_design_system",
3
3
  "packageManager": "yarn@3.2.0",
4
4
  "sideEffects": false,
5
- "version": "1.1.2",
5
+ "version": "1.1.3-0",
6
6
  "description": "phoenix design system",
7
7
  "author": "zefirek",
8
8
  "license": "MIT",