@shoper/phoenix_design_system 0.15.0-4 → 0.15.0-6

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 (11) hide show
  1. package/build/cjs/packages/phoenix/src/components/dropdown/dropdown.js +22 -13
  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 +14 -18
  4. package/build/cjs/packages/phoenix/src/controllers/click_outside_controller/click_outside_controller.js.map +1 -1
  5. package/build/esm/packages/phoenix/src/components/dropdown/dropdown.js +22 -13
  6. package/build/esm/packages/phoenix/src/components/dropdown/dropdown.js.map +1 -1
  7. package/build/esm/packages/phoenix/src/controllers/click_outside_controller/click_outside_controller.d.ts +2 -3
  8. package/build/esm/packages/phoenix/src/controllers/click_outside_controller/click_outside_controller.js +14 -18
  9. package/build/esm/packages/phoenix/src/controllers/click_outside_controller/click_outside_controller.js.map +1 -1
  10. package/build/esm/packages/phoenix/src/controllers/click_outside_controller/click_outside_controller_types.d.ts +2 -0
  11. package/package.json +1 -1
package/build/cjs/packages/phoenix/src/components/dropdown/dropdown.js CHANGED
@@ -12,7 +12,6 @@ var backdrop_controller = require('../backdrop/controller/backdrop_controller.js
12
12
  var global_constants = require('../../global_constants.js');
13
13
  var dropdown_constants = require('./dropdown_constants.js');
14
14
  var relative_position_controller_constants = require('../../controllers/relative_position_controller/relative_position_controller_constants.js');
15
- var click_outside_controller_messages = require('../../controllers/click_outside_controller/click_outside_controller_messages.js');
16
15
  var click_outside_controller = require('../../controllers/click_outside_controller/click_outside_controller.js');
17
16
  var lodash = require('../../../../../external/lodash/lodash.js');
18
17
  var relative_position_controller = require('../../controllers/relative_position_controller/relative_position_controller.js');
@@ -28,6 +27,25 @@ exports.HDropdown = HDropdown_1 = class HDropdown extends phoenix_light_lit_elem
28
27
  this.transition = 'direction';
29
28
  this.portalTarget = dropdown_constants.DEFAULT_DROPDOWN_PORTAL_NAME;
30
29
  this._backdropController = new backdrop_controller.BackdropController();
30
+ this._handleClickOutside = (target) => {
31
+ var _a, _b;
32
+ if (!this.opened)
33
+ return;
34
+ //
35
+ // const target = ev.detail.target as HTMLElement;
36
+ const clickedWithinNestedDropdown = (_a = this.$nestedDropdownContentElements) === null || _a === void 0 ? void 0 : _a.find((element) => element.contains(target));
37
+ const shouldHideElements = !((_b = this.$dropdownContent) === null || _b === void 0 ? void 0 : _b.contains(target)) && !this.contains(target) && !clickedWithinNestedDropdown;
38
+ if (shouldHideElements)
39
+ this.hide();
40
+ };
41
+ // private _handleClickOutside = (ev: CustomEvent<TClickOutsideEvent>): void => {
42
+ // if (!this.opened) return;
43
+ //
44
+ // const target = ev.detail.target as HTMLElement;
45
+ //
46
+ // const clickedWithinNestedDropdown = this.$nestedDropdownContentElements?.find((element) =>
47
+ // element.contains(target)); const shouldHideElements = !this.$dropdownContent?.contains(target) &&
48
+ // !this.contains(target) && !clickedWithinNestedDropdown; if (shouldHideElements) this.hide(); }
31
49
  this.toggle = () => {
32
50
  this.opened ? this.hide() : this.show();
33
51
  };
@@ -152,7 +170,8 @@ exports.HDropdown = HDropdown_1 = class HDropdown extends phoenix_light_lit_elem
152
170
  this._clickOutsideController = new click_outside_controller.ClickOutsideController({
153
171
  host: this,
154
172
  container: this,
155
- name: this.name
173
+ name: this.name,
174
+ action: this._handleClickOutside
156
175
  });
157
176
  if (this.toggleOnHover && !this.$hoverableDropdownContentElements) {
158
177
  this.$hoverableDropdownContentElements = [...this.querySelectorAll(dropdown_constants.DROPDOWN_CONTENT_NAME)];
@@ -169,8 +188,8 @@ exports.HDropdown = HDropdown_1 = class HDropdown extends phoenix_light_lit_elem
169
188
  }
170
189
  }
171
190
  _setupListeners() {
191
+ // this.addEventListener(CLICK_OUTSIDE_CONTROLLER_MESSAGES.clickedOutside, this._handleClickOutside);
172
192
  var _a;
173
- this.addEventListener(click_outside_controller_messages.CLICK_OUTSIDE_CONTROLLER_MESSAGES.clickedOutside, this._handleClickOutside);
174
193
  this.addEventListener(relative_position_controller_constants.RELATIVE_POSITION_CONTROLLER_EVENTS.disabledPositioning, this._handleDisabledPositioning);
175
194
  this.addEventListener(relative_position_controller_constants.RELATIVE_POSITION_CONTROLLER_EVENTS.enabledPositioning, this._handleEnabledPositioning);
176
195
  (_a = this.$dropdownToggler) === null || _a === void 0 ? void 0 : _a.addEventListener('toggle', this.toggle);
@@ -178,16 +197,6 @@ exports.HDropdown = HDropdown_1 = class HDropdown extends phoenix_light_lit_elem
178
197
  if (this.toggleOnHover)
179
198
  document.addEventListener('mouseover', this._hoverToggle);
180
199
  }
181
- _handleClickOutside(ev) {
182
- var _a, _b;
183
- if (!this.opened)
184
- return;
185
- const target = ev.detail.target;
186
- const clickedWithinNestedDropdown = (_a = this.$nestedDropdownContentElements) === null || _a === void 0 ? void 0 : _a.find((element) => element.contains(target));
187
- const shouldHideElements = !((_b = this.$dropdownContent) === null || _b === void 0 ? void 0 : _b.contains(target)) && !this.contains(target) && !clickedWithinNestedDropdown;
188
- if (shouldHideElements)
189
- this.hide();
190
- }
191
200
  _toggleScroll() {
192
201
  var _a, _b;
193
202
  if (window.innerWidth >= global_constants.BREAKPOINTS.xs && this._hasScrollableClassInitially)
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,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;"}
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,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;AACA;AACA;AACA;"}
package/build/cjs/packages/phoenix/src/controllers/click_outside_controller/click_outside_controller.js CHANGED
@@ -3,44 +3,37 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var tslib_es6 = require('../../../../../external/tslib/tslib.es6.js');
6
- var click_outside_controller_messages = require('./click_outside_controller_messages.js');
7
6
 
8
- var _ClickOutsideController_host, _ClickOutsideController_container;
7
+ var _ClickOutsideController_host, _ClickOutsideController_container, _ClickOutsideController_name, _ClickOutsideController_enabled, _ClickOutsideController_action;
9
8
  class ClickOutsideController {
10
- constructor({ host, container, name }) {
9
+ constructor({ host, container, name, action }) {
11
10
  _ClickOutsideController_host.set(this, void 0);
12
11
  _ClickOutsideController_container.set(this, void 0);
12
+ _ClickOutsideController_name.set(this, void 0);
13
+ _ClickOutsideController_enabled.set(this, true);
14
+ _ClickOutsideController_action.set(this, void 0);
13
15
  this._dispatchClickedOutsideEvent = (ev) => {
14
- const clickedOutsideEvent = new CustomEvent(click_outside_controller_messages.CLICK_OUTSIDE_CONTROLLER_MESSAGES.clickedOutside, {
15
- bubbles: true,
16
- detail: {
17
- target: ev.target,
18
- name: this._name
19
- }
20
- });
21
16
  const target = ev.target;
22
17
  const isContainerWithinTarget = target.contains(tslib_es6.__classPrivateFieldGet(this, _ClickOutsideController_container, "f")) && target !== tslib_es6.__classPrivateFieldGet(this, _ClickOutsideController_container, "f");
23
18
  const isTargetWithinContainer = tslib_es6.__classPrivateFieldGet(this, _ClickOutsideController_container, "f").contains(target);
24
19
  if (isContainerWithinTarget || !isTargetWithinContainer) {
25
- tslib_es6.__classPrivateFieldGet(this, _ClickOutsideController_host, "f").dispatchEvent(clickedOutsideEvent);
20
+ tslib_es6.__classPrivateFieldGet(this, _ClickOutsideController_enabled, "f") && tslib_es6.__classPrivateFieldGet(this, _ClickOutsideController_action, "f").call(this, target);
26
21
  }
27
22
  };
28
23
  tslib_es6.__classPrivateFieldSet(this, _ClickOutsideController_host, host, "f");
29
24
  tslib_es6.__classPrivateFieldSet(this, _ClickOutsideController_container, container, "f");
30
- this._name = name;
25
+ tslib_es6.__classPrivateFieldSet(this, _ClickOutsideController_name, name, "f");
26
+ tslib_es6.__classPrivateFieldSet(this, _ClickOutsideController_action, action, "f");
31
27
  tslib_es6.__classPrivateFieldGet(this, _ClickOutsideController_host, "f").addController(this);
32
28
  }
33
29
  hostConnected() {
34
30
  this._setupClickEventListener();
35
31
  }
36
- hostDisconnected() {
37
- this._removeClickEventListener();
38
- }
39
32
  enable() {
40
- this._setupClickEventListener();
33
+ tslib_es6.__classPrivateFieldSet(this, _ClickOutsideController_enabled, true, "f");
41
34
  }
42
35
  disable() {
43
- this._removeClickEventListener();
36
+ tslib_es6.__classPrivateFieldSet(this, _ClickOutsideController_enabled, false, "f");
44
37
  }
45
38
  _setupClickEventListener() {
46
39
  document.addEventListener('click', this._dispatchClickedOutsideEvent);
@@ -48,8 +41,11 @@ class ClickOutsideController {
48
41
  _removeClickEventListener() {
49
42
  document.removeEventListener('click', this._dispatchClickedOutsideEvent);
50
43
  }
44
+ hostDisconnected() {
45
+ this._removeClickEventListener();
46
+ }
51
47
  }
52
- _ClickOutsideController_host = new WeakMap(), _ClickOutsideController_container = new WeakMap();
48
+ _ClickOutsideController_host = new WeakMap(), _ClickOutsideController_container = new WeakMap(), _ClickOutsideController_name = new WeakMap(), _ClickOutsideController_enabled = new WeakMap(), _ClickOutsideController_action = new WeakMap();
53
49
 
54
50
  exports.ClickOutsideController = ClickOutsideController;
55
51
  //# sourceMappingURL=click_outside_controller.js.map
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;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;"}
package/build/esm/packages/phoenix/src/components/dropdown/dropdown.js CHANGED
@@ -8,7 +8,6 @@ import { BackdropController } from '../backdrop/controller/backdrop_controller.j
8
8
  import { BREAKPOINTS, SCROLLABLE_CLASS_NAME } from '../../global_constants.js';
9
9
  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';
10
10
  import { DIRECTIONS, DEFAULT_THROTTLE_WAIT_TIME, RELATIVE_POSITION_CONTROLLER_EVENTS } from '../../controllers/relative_position_controller/relative_position_controller_constants.js';
11
- import { CLICK_OUTSIDE_CONTROLLER_MESSAGES } from '../../controllers/click_outside_controller/click_outside_controller_messages.js';
12
11
  import { ClickOutsideController } from '../../controllers/click_outside_controller/click_outside_controller.js';
13
12
  import lodash from '../../../../../external/lodash/lodash.js';
14
13
  import { RelativePositionController } from '../../controllers/relative_position_controller/relative_position_controller.js';
@@ -24,6 +23,25 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
24
23
  this.transition = 'direction';
25
24
  this.portalTarget = DEFAULT_DROPDOWN_PORTAL_NAME;
26
25
  this._backdropController = new BackdropController();
26
+ this._handleClickOutside = (target) => {
27
+ var _a, _b;
28
+ if (!this.opened)
29
+ return;
30
+ //
31
+ // const target = ev.detail.target as HTMLElement;
32
+ const clickedWithinNestedDropdown = (_a = this.$nestedDropdownContentElements) === null || _a === void 0 ? void 0 : _a.find((element) => element.contains(target));
33
+ const shouldHideElements = !((_b = this.$dropdownContent) === null || _b === void 0 ? void 0 : _b.contains(target)) && !this.contains(target) && !clickedWithinNestedDropdown;
34
+ if (shouldHideElements)
35
+ this.hide();
36
+ };
37
+ // private _handleClickOutside = (ev: CustomEvent<TClickOutsideEvent>): void => {
38
+ // if (!this.opened) return;
39
+ //
40
+ // const target = ev.detail.target as HTMLElement;
41
+ //
42
+ // const clickedWithinNestedDropdown = this.$nestedDropdownContentElements?.find((element) =>
43
+ // element.contains(target)); const shouldHideElements = !this.$dropdownContent?.contains(target) &&
44
+ // !this.contains(target) && !clickedWithinNestedDropdown; if (shouldHideElements) this.hide(); }
27
45
  this.toggle = () => {
28
46
  this.opened ? this.hide() : this.show();
29
47
  };
@@ -148,7 +166,8 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
148
166
  this._clickOutsideController = new ClickOutsideController({
149
167
  host: this,
150
168
  container: this,
151
- name: this.name
169
+ name: this.name,
170
+ action: this._handleClickOutside
152
171
  });
153
172
  if (this.toggleOnHover && !this.$hoverableDropdownContentElements) {
154
173
  this.$hoverableDropdownContentElements = [...this.querySelectorAll(DROPDOWN_CONTENT_NAME)];
@@ -165,8 +184,8 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
165
184
  }
166
185
  }
167
186
  _setupListeners() {
187
+ // this.addEventListener(CLICK_OUTSIDE_CONTROLLER_MESSAGES.clickedOutside, this._handleClickOutside);
168
188
  var _a;
169
- this.addEventListener(CLICK_OUTSIDE_CONTROLLER_MESSAGES.clickedOutside, this._handleClickOutside);
170
189
  this.addEventListener(RELATIVE_POSITION_CONTROLLER_EVENTS.disabledPositioning, this._handleDisabledPositioning);
171
190
  this.addEventListener(RELATIVE_POSITION_CONTROLLER_EVENTS.enabledPositioning, this._handleEnabledPositioning);
172
191
  (_a = this.$dropdownToggler) === null || _a === void 0 ? void 0 : _a.addEventListener('toggle', this.toggle);
@@ -174,16 +193,6 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
174
193
  if (this.toggleOnHover)
175
194
  document.addEventListener('mouseover', this._hoverToggle);
176
195
  }
177
- _handleClickOutside(ev) {
178
- var _a, _b;
179
- if (!this.opened)
180
- return;
181
- const target = ev.detail.target;
182
- const clickedWithinNestedDropdown = (_a = this.$nestedDropdownContentElements) === null || _a === void 0 ? void 0 : _a.find((element) => element.contains(target));
183
- const shouldHideElements = !((_b = this.$dropdownContent) === null || _b === void 0 ? void 0 : _b.contains(target)) && !this.contains(target) && !clickedWithinNestedDropdown;
184
- if (shouldHideElements)
185
- this.hide();
186
- }
187
196
  _toggleScroll() {
188
197
  var _a, _b;
189
198
  if (window.innerWidth >= BREAKPOINTS.xs && this._hasScrollableClassInitially)
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,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;"}
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,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;AACA;AACA;AACA;"}
package/build/esm/packages/phoenix/src/controllers/click_outside_controller/click_outside_controller.d.ts CHANGED
@@ -1,13 +1,12 @@
1
1
  import { IClickOutsideController, TClickOutsideControllerProps } from './click_outside_controller_types';
2
2
  export declare class ClickOutsideController implements IClickOutsideController {
3
3
  #private;
4
- private _name?;
5
- constructor({ host, container, name }: TClickOutsideControllerProps);
4
+ constructor({ host, container, name, action }: TClickOutsideControllerProps);
6
5
  hostConnected(): void;
7
- hostDisconnected(): void;
8
6
  enable(): void;
9
7
  disable(): void;
10
8
  private _setupClickEventListener;
11
9
  private _removeClickEventListener;
12
10
  private _dispatchClickedOutsideEvent;
11
+ hostDisconnected(): void;
13
12
  }
package/build/esm/packages/phoenix/src/controllers/click_outside_controller/click_outside_controller.js CHANGED
@@ -1,42 +1,35 @@
1
1
  import { __classPrivateFieldGet, __classPrivateFieldSet } from '../../../../../external/tslib/tslib.es6.js';
2
- import { CLICK_OUTSIDE_CONTROLLER_MESSAGES } from './click_outside_controller_messages.js';
3
2
 
4
- var _ClickOutsideController_host, _ClickOutsideController_container;
3
+ var _ClickOutsideController_host, _ClickOutsideController_container, _ClickOutsideController_name, _ClickOutsideController_enabled, _ClickOutsideController_action;
5
4
  class ClickOutsideController {
6
- constructor({ host, container, name }) {
5
+ constructor({ host, container, name, action }) {
7
6
  _ClickOutsideController_host.set(this, void 0);
8
7
  _ClickOutsideController_container.set(this, void 0);
8
+ _ClickOutsideController_name.set(this, void 0);
9
+ _ClickOutsideController_enabled.set(this, true);
10
+ _ClickOutsideController_action.set(this, void 0);
9
11
  this._dispatchClickedOutsideEvent = (ev) => {
10
- const clickedOutsideEvent = new CustomEvent(CLICK_OUTSIDE_CONTROLLER_MESSAGES.clickedOutside, {
11
- bubbles: true,
12
- detail: {
13
- target: ev.target,
14
- name: this._name
15
- }
16
- });
17
12
  const target = ev.target;
18
13
  const isContainerWithinTarget = target.contains(__classPrivateFieldGet(this, _ClickOutsideController_container, "f")) && target !== __classPrivateFieldGet(this, _ClickOutsideController_container, "f");
19
14
  const isTargetWithinContainer = __classPrivateFieldGet(this, _ClickOutsideController_container, "f").contains(target);
20
15
  if (isContainerWithinTarget || !isTargetWithinContainer) {
21
- __classPrivateFieldGet(this, _ClickOutsideController_host, "f").dispatchEvent(clickedOutsideEvent);
16
+ __classPrivateFieldGet(this, _ClickOutsideController_enabled, "f") && __classPrivateFieldGet(this, _ClickOutsideController_action, "f").call(this, target);
22
17
  }
23
18
  };
24
19
  __classPrivateFieldSet(this, _ClickOutsideController_host, host, "f");
25
20
  __classPrivateFieldSet(this, _ClickOutsideController_container, container, "f");
26
- this._name = name;
21
+ __classPrivateFieldSet(this, _ClickOutsideController_name, name, "f");
22
+ __classPrivateFieldSet(this, _ClickOutsideController_action, action, "f");
27
23
  __classPrivateFieldGet(this, _ClickOutsideController_host, "f").addController(this);
28
24
  }
29
25
  hostConnected() {
30
26
  this._setupClickEventListener();
31
27
  }
32
- hostDisconnected() {
33
- this._removeClickEventListener();
34
- }
35
28
  enable() {
36
- this._setupClickEventListener();
29
+ __classPrivateFieldSet(this, _ClickOutsideController_enabled, true, "f");
37
30
  }
38
31
  disable() {
39
- this._removeClickEventListener();
32
+ __classPrivateFieldSet(this, _ClickOutsideController_enabled, false, "f");
40
33
  }
41
34
  _setupClickEventListener() {
42
35
  document.addEventListener('click', this._dispatchClickedOutsideEvent);
@@ -44,8 +37,11 @@ class ClickOutsideController {
44
37
  _removeClickEventListener() {
45
38
  document.removeEventListener('click', this._dispatchClickedOutsideEvent);
46
39
  }
40
+ hostDisconnected() {
41
+ this._removeClickEventListener();
42
+ }
47
43
  }
48
- _ClickOutsideController_host = new WeakMap(), _ClickOutsideController_container = new WeakMap();
44
+ _ClickOutsideController_host = new WeakMap(), _ClickOutsideController_container = new WeakMap(), _ClickOutsideController_name = new WeakMap(), _ClickOutsideController_enabled = new WeakMap(), _ClickOutsideController_action = new WeakMap();
49
45
 
50
46
  export { ClickOutsideController };
51
47
  //# sourceMappingURL=click_outside_controller.js.map
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;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;"}
package/build/esm/packages/phoenix/src/controllers/click_outside_controller/click_outside_controller_types.d.ts CHANGED
@@ -3,8 +3,10 @@ import { ReactiveController } from 'lit';
3
3
  export declare type TClickOutsideControllerProps = {
4
4
  host: TWebComponentsContextControllerHost;
5
5
  container: HTMLElement;
6
+ action: TClickOutsideAction;
6
7
  name?: string;
7
8
  };
9
+ export declare type TClickOutsideAction = (target: HTMLElement) => void;
8
10
  export declare type TClickOutsideEvent = {
9
11
  target: EventTarget | null;
10
12
  name?: string;
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.15.0-4",
5
+ "version": "0.15.0-6",
6
6
  "description": "phoenix design system",
7
7
  "author": "zefirek",
8
8
  "license": "MIT",