@shoper/phoenix_design_system 1.15.6-2 → 1.15.6-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 (41) hide show
  1. package/build/cjs/packages/phoenix/src/components/dropdown/dropdown.js +2 -9
  2. package/build/cjs/packages/phoenix/src/components/dropdown/dropdown.js.map +1 -1
  3. package/build/cjs/packages/phoenix/src/components/dropdown/dropdown_toggler.js +1 -6
  4. package/build/cjs/packages/phoenix/src/components/dropdown/dropdown_toggler.js.map +1 -1
  5. package/build/cjs/packages/phoenix/src/components/form/input/input_copy_button.js +2 -1
  6. package/build/cjs/packages/phoenix/src/components/form/input/input_copy_button.js.map +1 -1
  7. package/build/cjs/packages/phoenix/src/components/form/select/components/search/select_search.js +0 -30
  8. package/build/cjs/packages/phoenix/src/components/form/select/components/search/select_search.js.map +1 -1
  9. package/build/cjs/packages/phoenix/src/components/form/select/components/select_options.js +2 -1
  10. package/build/cjs/packages/phoenix/src/components/form/select/components/select_options.js.map +1 -1
  11. package/build/cjs/packages/phoenix/src/components/form/select/select.js +8 -41
  12. package/build/cjs/packages/phoenix/src/components/form/select/select.js.map +1 -1
  13. package/build/cjs/packages/phoenix/src/components/navigator/navigator_share/navigator_share.js +2 -2
  14. package/build/cjs/packages/phoenix/src/controllers/list_box_controller/list_box_keyboard_controller.js +15 -62
  15. package/build/cjs/packages/phoenix/src/controllers/list_box_controller/list_box_keyboard_controller.js.map +1 -1
  16. package/build/esm/packages/phoenix/src/components/dropdown/dropdown.d.ts +0 -1
  17. package/build/esm/packages/phoenix/src/components/dropdown/dropdown.js +2 -9
  18. package/build/esm/packages/phoenix/src/components/dropdown/dropdown.js.map +1 -1
  19. package/build/esm/packages/phoenix/src/components/dropdown/dropdown_toggler.d.ts +0 -1
  20. package/build/esm/packages/phoenix/src/components/dropdown/dropdown_toggler.js +1 -6
  21. package/build/esm/packages/phoenix/src/components/dropdown/dropdown_toggler.js.map +1 -1
  22. package/build/esm/packages/phoenix/src/components/form/input/input_copy_button.d.ts +1 -0
  23. package/build/esm/packages/phoenix/src/components/form/input/input_copy_button.js +2 -1
  24. package/build/esm/packages/phoenix/src/components/form/input/input_copy_button.js.map +1 -1
  25. package/build/esm/packages/phoenix/src/components/form/select/components/search/select_search.d.ts +0 -4
  26. package/build/esm/packages/phoenix/src/components/form/select/components/search/select_search.js +0 -30
  27. package/build/esm/packages/phoenix/src/components/form/select/components/search/select_search.js.map +1 -1
  28. package/build/esm/packages/phoenix/src/components/form/select/components/select_options.js +2 -1
  29. package/build/esm/packages/phoenix/src/components/form/select/components/select_options.js.map +1 -1
  30. package/build/esm/packages/phoenix/src/components/form/select/select.d.ts +2 -6
  31. package/build/esm/packages/phoenix/src/components/form/select/select.js +8 -41
  32. package/build/esm/packages/phoenix/src/components/form/select/select.js.map +1 -1
  33. package/build/esm/packages/phoenix/src/components/navigator/navigator_share/navigator_share.d.ts +1 -0
  34. package/build/esm/packages/phoenix/src/components/navigator/navigator_share/navigator_share.js +2 -2
  35. package/build/esm/packages/phoenix/src/controllers/list_box_controller/list_box_controller_types.d.ts +2 -6
  36. package/build/esm/packages/phoenix/src/controllers/list_box_controller/list_box_controller_types.js +0 -1
  37. package/build/esm/packages/phoenix/src/controllers/list_box_controller/list_box_controller_types.js.map +1 -1
  38. package/build/esm/packages/phoenix/src/controllers/list_box_controller/list_box_keyboard_controller.d.ts +3 -7
  39. package/build/esm/packages/phoenix/src/controllers/list_box_controller/list_box_keyboard_controller.js +15 -62
  40. package/build/esm/packages/phoenix/src/controllers/list_box_controller/list_box_keyboard_controller.js.map +1 -1
  41. package/package.json +1 -1
@@ -32,7 +32,6 @@ exports.HDropdown = HDropdown_1 = class HDropdown extends phoenix_light_lit_elem
32
32
  this.portalTarget = dropdown_constants.DEFAULT_DROPDOWN_PORTAL_NAME;
33
33
  this.id = v4['default']();
34
34
  this.preventFocusTrap = false;
35
- this.noAutoFocus = false;
36
35
  this._backdropController = new backdrop_controller.BackdropController();
37
36
  this._handleClickOutside = async (target) => {
38
37
  var _a, _b;
@@ -49,8 +48,7 @@ exports.HDropdown = HDropdown_1 = class HDropdown extends phoenix_light_lit_elem
49
48
  return;
50
49
  }
51
50
  await this.show();
52
- if (!this.noAutoFocus)
53
- this._focusOnFirstContentElement();
51
+ this._focusOnFirstContentElement();
54
52
  };
55
53
  this.show = async () => {
56
54
  if (this.opened)
@@ -178,8 +176,7 @@ exports.HDropdown = HDropdown_1 = class HDropdown extends phoenix_light_lit_elem
178
176
  const isHoveredWithinDropdown = this._isHoveredWithinDropdown(ev.target);
179
177
  if (isHoveredWithinDropdown && !this.opened) {
180
178
  await this.show();
181
- if (!this.noAutoFocus)
182
- this._focusOnFirstContentElement();
179
+ this._focusOnFirstContentElement();
183
180
  return;
184
181
  }
185
182
  if (!isHoveredWithinDropdown && this.opened)
@@ -469,10 +466,6 @@ tslib_es6.__decorate([
469
466
  decorators_js.property({ type: Boolean, attribute: 'prevent-focus-trap' }),
470
467
  tslib_es6.__metadata("design:type", Object)
471
468
  ], exports.HDropdown.prototype, "preventFocusTrap", void 0);
472
- tslib_es6.__decorate([
473
- decorators_js.property({ type: Boolean, attribute: 'no-autofocus' }),
474
- tslib_es6.__metadata("design:type", Object)
475
- ], exports.HDropdown.prototype, "noAutoFocus", void 0);
476
469
  exports.HDropdown = HDropdown_1 = tslib_es6.__decorate([
477
470
  phoenix_custom_element.phoenixCustomElement('h-dropdown'),
478
471
  tslib_es6.__metadata("design:paramtypes", [])
@@ -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,iBAAiB,qDAAyD;AAC1E;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,iBAAiB,qDAAyD;AAC1E;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -16,7 +16,6 @@ exports.HDropdownToggler = class HDropdownToggler extends phoenix_light_lit_elem
16
16
  constructor() {
17
17
  super();
18
18
  this.name = '';
19
- this.ariaHasPopup = 'menu';
20
19
  this._setupTogglerAria = () => {
21
20
  this._$dropdown = this.closest(dropdown_constants.DROPDOWN_CONTAINER_NAME);
22
21
  if (this._$dropdown.isOpened)
@@ -24,7 +23,7 @@ exports.HDropdownToggler = class HDropdownToggler extends phoenix_light_lit_elem
24
23
  host: this,
25
24
  initialAriaExpandedValue: this._$dropdown.isOpened()
26
25
  });
27
- this.setAttribute('aria-haspopup', this.ariaHasPopup);
26
+ this.setAttribute('aria-haspopup', 'true');
28
27
  if (this._$dropdown.id)
29
28
  this.setAttribute('aria-controls', this._$dropdown.id);
30
29
  };
@@ -61,10 +60,6 @@ tslib_es6.__decorate([
61
60
  decorators.property({ type: String, reflect: true }),
62
61
  tslib_es6.__metadata("design:type", Object)
63
62
  ], exports.HDropdownToggler.prototype, "name", void 0);
64
- tslib_es6.__decorate([
65
- decorators.property({ type: String, attribute: 'aria-haspopup' }),
66
- tslib_es6.__metadata("design:type", Object)
67
- ], exports.HDropdownToggler.prototype, "ariaHasPopup", void 0);
68
63
  exports.HDropdownToggler = tslib_es6.__decorate([
69
64
  phoenix_custom_element.phoenixCustomElement('h-dropdown-toggler'),
70
65
  tslib_es6.__metadata("design:paramtypes", [])
@@ -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;"}
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;"}
@@ -7,6 +7,7 @@ var lit = require('lit');
7
7
  var decorators = require('lit/decorators');
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
+ var btn_controller = require('../../../controllers/btn_controller/btn_controller.js');
10
11
  var input_constants = require('./input_constants.js');
11
12
 
12
13
  exports.HInputCopyButton = class HInputCopyButton extends phoenix_light_lit_element.PhoenixLightLitElement {
@@ -39,7 +40,7 @@ exports.HInputCopyButton = class HInputCopyButton extends phoenix_light_lit_elem
39
40
  this._$inputToCopy = document.querySelector(`#${this.inputId}`);
40
41
  if (!this._$inputToCopy)
41
42
  return;
42
- this.setAttribute('tabindex', '0');
43
+ this._btnController = new btn_controller.BtnController(this, this._handleCopyToClipboard);
43
44
  this.addEventListener('click', this._handleCopyToClipboard);
44
45
  }
45
46
  async _copyToClipboard() {
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,+CAAmD;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,+CAAmD;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -5,7 +5,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var tslib_es6 = require('../../../../../../../../external/tslib/tslib.es6.js');
6
6
  var lit = require('lit');
7
7
  var decorators = require('lit/decorators');
8
- require('@dreamcommerce/utilities');
9
8
  var phoenix_light_lit_element = require('../../../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js');
10
9
  var phoenix_custom_element = require('../../../../../core/decorators/phoenix_custom_element.js');
11
10
  var select_components_constatns = require('../select_components_constatns.js');
@@ -16,32 +15,6 @@ exports.HSelectSearch = class HSelectSearch extends phoenix_light_lit_element.Ph
16
15
  constructor() {
17
16
  super(...arguments);
18
17
  this.value = '';
19
- this._$selectOptions = null;
20
- this._handleSearchKeydown = (ev) => {
21
- if (ev.key !== 'ArrowDown' && ev.key !== 'ArrowUp')
22
- return;
23
- this._handleFocusOptionOnArrowNavigation();
24
- this._handleDispatchEventOnOptionsList(ev);
25
- };
26
- this._handleDispatchEventOnOptionsList = (ev) => {
27
- var _a;
28
- const arrowNavigationEvent = new KeyboardEvent('keydown', {
29
- key: ev.key
30
- });
31
- (_a = this._$selectOptions) === null || _a === void 0 ? void 0 : _a.dispatchEvent(arrowNavigationEvent);
32
- };
33
- this._handleFocusOptionOnArrowNavigation = () => {
34
- const $options = this._$selectOptions ? [...this._$selectOptions.querySelectorAll('h-option')] : [];
35
- const $availableOptions = $options.filter(($option) => {
36
- return !$option.getAttribute('inactive') && !$option.getAttribute('disabled') && !$option.hidden;
37
- });
38
- const $firstOption = $availableOptions.find(($option) => {
39
- return !$option.getAttribute('inactive') && !$option.getAttribute('disabled') && !$option.getAttribute('hidden');
40
- });
41
- const $selectedOption = $availableOptions.find(($option) => $option.getAttribute('aria-selected'));
42
- const $optionToFocus = $selectedOption || $firstOption;
43
- $optionToFocus === null || $optionToFocus === void 0 ? void 0 : $optionToFocus.focus();
44
- };
45
18
  this._handleInputChange = debounce['default'](({ target }) => {
46
19
  this.value = target.value;
47
20
  this.emitCustomEvent(select_components_constatns.SELECT_SEARCH_EVENT_NAMES.search, {
@@ -52,9 +25,6 @@ exports.HSelectSearch = class HSelectSearch extends phoenix_light_lit_element.Ph
52
25
  connectedCallback() {
53
26
  super.connectedCallback();
54
27
  this.classList.add(select_search_constants.SELECT_SEARCH_CSS_CLASSES.selectSearch);
55
- // to musisz zrobić inaczej, bo jest kilka selectów na stronie
56
- this._$selectOptions = document.querySelector('h-options');
57
- this.addEventListener('keydown', this._handleSearchKeydown);
58
28
  }
59
29
  render() {
60
30
  return lit.html `
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,qDAAyD;AACjF;AACA;AACA;AACA;AACA;AACA;AACA,uBAAuB,qDAAyD;AAChF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,qDAAyD;AACjF;AACA;AACA;AACA;AACA;AACA,uBAAuB,qDAAyD;AAChF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var tslib_es6 = require('../../../../../../../external/tslib/tslib.es6.js');
6
- require('@dreamcommerce/utilities');
6
+ var utilities = require('@dreamcommerce/utilities');
7
7
  var phoenix_light_lit_element = require('../../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js');
8
8
  var phoenix_custom_element = require('../../../../core/decorators/phoenix_custom_element.js');
9
9
  var select_components_constatns = require('./select_components_constatns.js');
@@ -26,6 +26,7 @@ exports.HOptions = class HOptions extends phoenix_light_lit_element.PhoenixLight
26
26
  });
27
27
  };
28
28
  this.setAttribute('role', 'listbox');
29
+ utilities.UiDomUtils.makeNavigable(this);
29
30
  this.addEventListener(select_components_constatns.SELECT_OPTION_EVENT_NAMES.clicked, this._dispatchClickedEvent);
30
31
  this.addEventListener(select_components_constatns.SELECT_OPTION_EVENT_NAMES.updated, this._dispatchUpdatedEvent);
31
32
  }
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,kDAAsD;AAC9E;AACA;AACA;AACA;AACA;AACA;AACA;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,kDAAsD;AAC9E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -44,7 +44,7 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
44
44
  this._searchValue = '';
45
45
  this._$options = new Map();
46
46
  this._$dropdown = ref_js.createRef();
47
- this.$search = ref_js.createRef();
47
+ this._$search = ref_js.createRef();
48
48
  this._$optionsList = ref_js.createRef();
49
49
  this._$dropdownContent = ref_js.createRef();
50
50
  this._$dropdownToggler = ref_js.createRef();
@@ -105,19 +105,6 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
105
105
  this.updateOptionAriaAttribute($option);
106
106
  });
107
107
  };
108
- this._updateLabelAria = (options) => {
109
- var _a;
110
- const ariaLabel = document.querySelector(`[id="${this.ariaLabelledby}"]`);
111
- (_a = ariaLabel === null || ariaLabel === void 0 ? void 0 : ariaLabel.querySelector(`[id="value-label"]`)) === null || _a === void 0 ? void 0 : _a.remove();
112
- if (ariaLabel) {
113
- ariaLabel.innerHTML = `
114
- ${ariaLabel === null || ariaLabel === void 0 ? void 0 : ariaLabel.innerHTML}
115
- <span id="value-label" class="sr-only">
116
- ${options.reduce((totalSelectedContent, currentOption) => (totalSelectedContent += currentOption.content), '')}
117
- </span>
118
- `;
119
- }
120
- };
121
108
  this._handleOptionClicked = ({ detail }) => {
122
109
  if (!(detail === null || detail === void 0 ? void 0 : detail.$option))
123
110
  return;
@@ -133,11 +120,10 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
133
120
  });
134
121
  };
135
122
  this._handleDropdownHidden = () => {
136
- var _a, _b;
123
+ var _a;
137
124
  this._searchValue = '';
138
125
  this.opened = false;
139
126
  (_a = this._$dropdownToggler.value) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-activedescendant', '');
140
- (_b = this._$dropdownToggler.value) === null || _b === void 0 ? void 0 : _b.focus();
141
127
  };
142
128
  this._manageSelectFocusAria = (ev) => {
143
129
  var _a;
@@ -197,7 +183,6 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
197
183
  return Array.from(this._$options.values());
198
184
  }
199
185
  updated(changedProperties) {
200
- var _a;
201
186
  super.updated(changedProperties);
202
187
  if (changedProperties.has('opened')) {
203
188
  if (this.opened) {
@@ -211,27 +196,16 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
211
196
  if (changedProperties.has('optionsList')) {
212
197
  this._updateOptions();
213
198
  }
214
- if (this._$optionsList.value) {
215
- (_a = this.listBoxController) === null || _a === void 0 ? void 0 : _a.hostDisconnected();
216
- this.listBoxController = new list_box_keyboard_controller.ListBoxKeyboardController({
199
+ if (this._$optionsList.value && !this._listBoxController)
200
+ this._listBoxController = new list_box_keyboard_controller.ListBoxKeyboardController({
217
201
  host: this,
218
202
  $list: this._$optionsList.value
219
203
  });
220
- }
221
- if (this.listBoxController) {
222
- this.listBoxController.calculateSelectedOptionIndex();
223
- }
224
204
  }
225
205
  _focusElementAfterSelectOpened() {
226
- var _a;
227
- const $searchInput = (_a = this.$search.value) === null || _a === void 0 ? void 0 : _a.querySelector('[role="search"]');
228
- const $options = this._$optionsList.value ? [...this._$optionsList.value.querySelectorAll('h-option')] : [];
229
- const $firstOption = $options.find(($option) => {
230
- return !$option.getAttribute('inactive') && !$option.getAttribute('disabled') && !$option.getAttribute('hidden');
231
- });
232
- const $selectedOption = this.selectedOptions[0];
233
- const $optionToFocus = $selectedOption || $firstOption;
234
- $searchInput ? $searchInput.focus() : $optionToFocus === null || $optionToFocus === void 0 ? void 0 : $optionToFocus.focus();
206
+ var _a, _b;
207
+ const $searchInput = (_a = this._$search.value) === null || _a === void 0 ? void 0 : _a.querySelector('[role="search"]');
208
+ $searchInput ? $searchInput.focus() : (_b = this._$optionsList.value) === null || _b === void 0 ? void 0 : _b.focus();
235
209
  }
236
210
  connectedCallback() {
237
211
  super.connectedCallback();
@@ -244,8 +218,6 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
244
218
  this._selectContext.provide(select_constants.SELECT_CONTEXTS.isMultiselect, this.multiple);
245
219
  this._optionsObserver = new observer.Observer((selectedOptions) => this._updateOptionsView(selectedOptions));
246
220
  this._selectController.options$.subscribe(this._optionsObserver);
247
- this._selectedOptionsAriaObserver = new observer.Observer((selectedOptions) => this._updateLabelAria(selectedOptions));
248
- this._selectController.selectedOptions$.subscribe(this._selectedOptionsAriaObserver);
249
221
  this._updateOptions();
250
222
  this._setupEvents();
251
223
  }
@@ -275,10 +247,6 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
275
247
  select_utils.SelectControlUtils.appendHTMLOption($option, $list, position);
276
248
  }
277
249
  updateOptionAriaAttribute($option) {
278
- if (!this.multiple) {
279
- const $options = this._$optionsList.value ? [...this._$optionsList.value.querySelectorAll('h-option')] : [];
280
- $options.forEach(($option) => ($option.removeAttribute('aria-selected')));
281
- }
282
250
  $option.setAttribute(this.multiple ? 'aria-checked' : 'aria-selected', String($option.selected));
283
251
  }
284
252
  _removeHTMLOptions(optionsValues) {
@@ -345,7 +313,6 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
345
313
  offset=${this.offset}
346
314
  content-width="full"
347
315
  prevent-focus-trap
348
- no-autofocus
349
316
  >
350
317
  <h-dropdown-toggler
351
318
  ${ref_js.ref(this._$dropdownToggler)}
@@ -373,7 +340,7 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
373
340
  ${isSearchEnabled
374
341
  ? lit.html ` <h-select-search
375
342
  class=${select_constants.SELECT_CSS_CLASSES.selectSearch}
376
- ${ref_js.ref(this.$search)}
343
+ ${ref_js.ref(this._$search)}
377
344
  .value=${this._searchValue}
378
345
  @search=${this._handleSearch}
379
346
  ></h-select-search>`
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,+CAAmD;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,+CAAmD;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -7,6 +7,7 @@ var lit = require('lit');
7
7
  var decorators = require('lit/decorators');
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
+ var btn_controller = require('../../../controllers/btn_controller/btn_controller.js');
10
11
  var navigator_share_constants = require('./navigator_share_constants.js');
11
12
 
12
13
  exports.NavigatorShare = class NavigatorShare extends phoenix_light_lit_element.PhoenixLightLitElement {
@@ -29,8 +30,7 @@ exports.NavigatorShare = class NavigatorShare extends phoenix_light_lit_element.
29
30
  });
30
31
  }
31
32
  };
32
- this.setAttribute('tabindex', '0');
33
- this.setAttribute('role', 'button');
33
+ this._btnController = new btn_controller.BtnController(this, this._handleShare);
34
34
  }
35
35
  get shareData() {
36
36
  return {
@@ -5,6 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var tslib_es6 = require('../../../../../external/tslib/tslib.es6.js');
6
6
  require('lit');
7
7
  var utilities = require('@dreamcommerce/utilities');
8
+ var keystrokes_controller = require('../keystrokes_controller/keystrokes_controller.js');
8
9
  var list_box_controller_constants = require('./list_box_controller_constants.js');
9
10
 
10
11
  var _ListBoxKeyboardController_host, _ListBoxKeyboardController__$list, _ListBoxKeyboardController_currentOptionIndex, _ListBoxKeyboardController__$options, _ListBoxKeyboardController_listItemSelector, _ListBoxKeyboardController_keys;
@@ -16,54 +17,25 @@ class ListBoxKeyboardController {
16
17
  _ListBoxKeyboardController__$options.set(this, void 0);
17
18
  _ListBoxKeyboardController_listItemSelector.set(this, void 0);
18
19
  _ListBoxKeyboardController_keys.set(this, void 0);
19
- this._handleKeyboardNavigation = (ev) => {
20
- if (tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_keys, "f").find((key) => key === ev.key)) {
21
- this._handleArrowNavigation(ev);
22
- return;
23
- }
24
- this._handleWriteableCharacter(ev);
25
- };
26
20
  this._handleArrowNavigation = (event) => {
27
21
  event.preventDefault();
28
22
  const { key } = event;
29
- const $availableOptions = tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f").filter(($option) => {
30
- return !$option.getAttribute('inactive') && !$option.getAttribute('disabled') && !$option.hidden;
31
- });
32
- const prevOptionIndex = this._findCurrentIndex();
23
+ const prevOptionIndex = tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f");
33
24
  let newOptionIndex = key === 'ArrowDown' || key === 'ArrowRight' ? this._getNextOptionIndex() : this._getPrevOptionIndex();
34
25
  if (newOptionIndex === undefined) {
35
- newOptionIndex = this._findCurrentIndex();
26
+ const selectedOptionIndex = tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f").findIndex(($option) => $option.selected);
27
+ newOptionIndex = selectedOptionIndex !== -1 ? selectedOptionIndex : 0;
36
28
  }
37
29
  if (newOptionIndex === tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f"))
38
30
  return;
39
31
  if (prevOptionIndex !== undefined) {
40
32
  const $prevOption = tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f")[prevOptionIndex];
41
- $prevOption && utilities.UiDomUtils.makeUnnavigable($prevOption);
33
+ utilities.UiDomUtils.makeUnnavigable($prevOption);
42
34
  }
43
35
  tslib_es6.__classPrivateFieldSet(this, _ListBoxKeyboardController_currentOptionIndex, newOptionIndex, "f");
44
- const $focusedOption = $availableOptions[newOptionIndex];
45
- if ($focusedOption) {
46
- utilities.UiDomUtils.makeNavigable($focusedOption);
47
- $focusedOption.focus();
48
- }
49
- };
50
- this._findCurrentIndex = () => {
51
- const $availableOptions = tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f").filter(($option) => {
52
- return !$option.getAttribute('inactive') && !$option.getAttribute('disabled') && !$option.hidden;
53
- });
54
- const selectedOptionIndex = $availableOptions.findIndex(($option) => $option.selected);
55
- return selectedOptionIndex !== -1 ? selectedOptionIndex : 0;
56
- };
57
- this._handleWriteableCharacter = (ev) => {
58
- var _a;
59
- const $searchInput = (_a = tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_host, "f").$search.value) === null || _a === void 0 ? void 0 : _a.querySelector('[role="search"]');
60
- if (!$searchInput)
61
- return;
62
- $searchInput === null || $searchInput === void 0 ? void 0 : $searchInput.focus();
63
- };
64
- this.calculateSelectedOptionIndex = () => {
65
- const selectedOptionIndex = tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f").findIndex(($option) => $option.selected);
66
- tslib_es6.__classPrivateFieldSet(this, _ListBoxKeyboardController_currentOptionIndex, selectedOptionIndex !== -1 ? selectedOptionIndex : 0, "f");
36
+ const $focusedOption = tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f")[newOptionIndex];
37
+ utilities.UiDomUtils.makeNavigable($focusedOption);
38
+ $focusedOption.focus();
67
39
  };
68
40
  tslib_es6.__classPrivateFieldSet(this, _ListBoxKeyboardController_host, host, "f");
69
41
  tslib_es6.__classPrivateFieldSet(this, _ListBoxKeyboardController__$list, $list, "f");
@@ -73,7 +45,12 @@ class ListBoxKeyboardController {
73
45
  tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_host, "f").addController(this);
74
46
  }
75
47
  hostConnected() {
76
- tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f").addEventListener('keydown', this._handleKeyboardNavigation);
48
+ new keystrokes_controller.KeystrokesController({
49
+ host: tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_host, "f"),
50
+ keys: tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_keys, "f"),
51
+ callback: this._handleArrowNavigation,
52
+ target: tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f")
53
+ });
77
54
  utilities.UiDomUtils.makeNavigable(tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f"));
78
55
  tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f").addEventListener('focusin', (event) => {
79
56
  if (event.target !== tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f"))
@@ -91,39 +68,15 @@ class ListBoxKeyboardController {
91
68
  return undefined;
92
69
  if (tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") <= 0)
93
70
  return tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f");
94
- if (tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") <= 0)
95
- return tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f");
96
- const $availableOptions = tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f").filter(($option) => {
97
- return !$option.getAttribute('inactive') && !$option.getAttribute('disabled') && !$option.hidden;
98
- });
99
- if (!!$availableOptions[tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") - 1])
100
- return tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") - 1;
101
- // bo ktoś wpisał coś w searcha i index obecnie wybranej opcji jest inny
102
- const newIndexOfCurrentlySelectedOption = $availableOptions.findIndex(($option) => $option.selected);
103
- if (newIndexOfCurrentlySelectedOption)
104
- return newIndexOfCurrentlySelectedOption - 1;
105
71
  return tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") - 1;
106
72
  }
107
73
  _getNextOptionIndex() {
108
74
  if (tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") === undefined)
109
75
  return undefined;
110
- const $availableOptions = tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f").filter(($option) => {
111
- return !$option.getAttribute('inactive') && !$option.getAttribute('disabled') && !$option.hidden;
112
- });
113
- if (tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") === $availableOptions.length - 1)
76
+ if (tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") >= tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f").length - 1)
114
77
  return tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f");
115
- if (tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") > $availableOptions.length - 1) {
116
- // bo ktoś wpisał coś w searcha i index obecnie wybranej opcji jest inny
117
- const newIndexOfCurrentlySelectedOption = $availableOptions.findIndex(($option) => $option.selected);
118
- if (newIndexOfCurrentlySelectedOption)
119
- return newIndexOfCurrentlySelectedOption + 1;
120
- return 0;
121
- }
122
78
  return tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") + 1;
123
79
  }
124
- hostDisconnected() {
125
- tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f").removeEventListener('keydown', this._handleKeyboardNavigation);
126
- }
127
80
  }
128
81
  _ListBoxKeyboardController_host = new WeakMap(), _ListBoxKeyboardController__$list = new WeakMap(), _ListBoxKeyboardController_currentOptionIndex = new WeakMap(), _ListBoxKeyboardController__$options = new WeakMap(), _ListBoxKeyboardController_listItemSelector = new WeakMap(), _ListBoxKeyboardController_keys = new WeakMap();
129
82
 
@@ -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;"}
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;"}
@@ -17,7 +17,6 @@ export declare class HDropdown extends PhoenixLightLitElement implements IDropdo
17
17
  mobilePosition: TMobileElementPosition;
18
18
  id: string;
19
19
  preventFocusTrap: boolean;
20
- noAutoFocus: boolean;
21
20
  $dropdownToggler: HDropdownToggler | null;
22
21
  $dropdownContent: HDropdownContent | null;
23
22
  $nestedDropdownContentElements?: HDropdownContent[];
@@ -28,7 +28,6 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
28
28
  this.portalTarget = DEFAULT_DROPDOWN_PORTAL_NAME;
29
29
  this.id = v4();
30
30
  this.preventFocusTrap = false;
31
- this.noAutoFocus = false;
32
31
  this._backdropController = new BackdropController();
33
32
  this._handleClickOutside = async (target) => {
34
33
  var _a, _b;
@@ -45,8 +44,7 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
45
44
  return;
46
45
  }
47
46
  await this.show();
48
- if (!this.noAutoFocus)
49
- this._focusOnFirstContentElement();
47
+ this._focusOnFirstContentElement();
50
48
  };
51
49
  this.show = async () => {
52
50
  if (this.opened)
@@ -174,8 +172,7 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
174
172
  const isHoveredWithinDropdown = this._isHoveredWithinDropdown(ev.target);
175
173
  if (isHoveredWithinDropdown && !this.opened) {
176
174
  await this.show();
177
- if (!this.noAutoFocus)
178
- this._focusOnFirstContentElement();
175
+ this._focusOnFirstContentElement();
179
176
  return;
180
177
  }
181
178
  if (!isHoveredWithinDropdown && this.opened)
@@ -465,10 +462,6 @@ __decorate([
465
462
  property({ type: Boolean, attribute: 'prevent-focus-trap' }),
466
463
  __metadata("design:type", Object)
467
464
  ], HDropdown.prototype, "preventFocusTrap", void 0);
468
- __decorate([
469
- property({ type: Boolean, attribute: 'no-autofocus' }),
470
- __metadata("design:type", Object)
471
- ], HDropdown.prototype, "noAutoFocus", void 0);
472
465
  HDropdown = HDropdown_1 = __decorate([
473
466
  phoenixCustomElement('h-dropdown'),
474
467
  __metadata("design:paramtypes", [])
@@ -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,eAAe,qDAAyD;AACxE;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,eAAe,qDAAyD;AACxE;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,7 +1,6 @@
1
1
  import { PhoenixLightLitElement } from "../../core/phoenix_light_lit_element/phoenix_light_lit_element";
2
2
  export declare class HDropdownToggler extends PhoenixLightLitElement {
3
3
  name: string;
4
- ariaHasPopup: string;
5
4
  private _btnController;
6
5
  private _toggleElementAriaController;
7
6
  private _$dropdown;
@@ -12,7 +12,6 @@ let HDropdownToggler = class HDropdownToggler extends PhoenixLightLitElement {
12
12
  constructor() {
13
13
  super();
14
14
  this.name = '';
15
- this.ariaHasPopup = 'menu';
16
15
  this._setupTogglerAria = () => {
17
16
  this._$dropdown = this.closest(DROPDOWN_CONTAINER_NAME);
18
17
  if (this._$dropdown.isOpened)
@@ -20,7 +19,7 @@ let HDropdownToggler = class HDropdownToggler extends PhoenixLightLitElement {
20
19
  host: this,
21
20
  initialAriaExpandedValue: this._$dropdown.isOpened()
22
21
  });
23
- this.setAttribute('aria-haspopup', this.ariaHasPopup);
22
+ this.setAttribute('aria-haspopup', 'true');
24
23
  if (this._$dropdown.id)
25
24
  this.setAttribute('aria-controls', this._$dropdown.id);
26
25
  };
@@ -57,10 +56,6 @@ __decorate([
57
56
  property({ type: String, reflect: true }),
58
57
  __metadata("design:type", Object)
59
58
  ], HDropdownToggler.prototype, "name", void 0);
60
- __decorate([
61
- property({ type: String, attribute: 'aria-haspopup' }),
62
- __metadata("design:type", Object)
63
- ], HDropdownToggler.prototype, "ariaHasPopup", void 0);
64
59
  HDropdownToggler = __decorate([
65
60
  phoenixCustomElement('h-dropdown-toggler'),
66
61
  __metadata("design:paramtypes", [])
@@ -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;"}
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;"}
@@ -6,6 +6,7 @@ export declare class HInputCopyButton extends PhoenixLightLitElement {
6
6
  hasBeenCopied: boolean;
7
7
  copyValue: string;
8
8
  private _$inputToCopy;
9
+ private _btnController;
9
10
  connectedCallback(): void;
10
11
  private _handleCopyToClipboard;
11
12
  private _copyToClipboard;
@@ -3,6 +3,7 @@ import { html } from 'lit';
3
3
  import { property, state } from 'lit/decorators';
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
+ import { BtnController } from '../../../controllers/btn_controller/btn_controller.js';
6
7
  import { INPUT_CONTROL_EVENTS } from './input_constants.js';
7
8
 
8
9
  let HInputCopyButton = class HInputCopyButton extends PhoenixLightLitElement {
@@ -35,7 +36,7 @@ let HInputCopyButton = class HInputCopyButton extends PhoenixLightLitElement {
35
36
  this._$inputToCopy = document.querySelector(`#${this.inputId}`);
36
37
  if (!this._$inputToCopy)
37
38
  return;
38
- this.setAttribute('tabindex', '0');
39
+ this._btnController = new BtnController(this, this._handleCopyToClipboard);
39
40
  this.addEventListener('click', this._handleCopyToClipboard);
40
41
  }
41
42
  async _copyToClipboard() {
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,+CAAmD;AAC1F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,+CAAmD;AAC1F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -2,11 +2,7 @@ import { PhoenixLightLitElement } from "../../../../../core/phoenix_light_lit_el
2
2
  import { TemplateResult } from 'lit';
3
3
  export declare class HSelectSearch extends PhoenixLightLitElement {
4
4
  value: string;
5
- private _$selectOptions;
6
5
  connectedCallback(): void;
7
- private _handleSearchKeydown;
8
- private _handleDispatchEventOnOptionsList;
9
- private _handleFocusOptionOnArrowNavigation;
10
6
  private _handleInputChange;
11
7
  protected render(): TemplateResult;
12
8
  }
@@ -1,7 +1,6 @@
1
1
  import { __decorate, __metadata } from '../../../../../../../../external/tslib/tslib.es6.js';
2
2
  import { html } from 'lit';
3
3
  import { property } from 'lit/decorators';
4
- import '@dreamcommerce/utilities';
5
4
  import { PhoenixLightLitElement } from '../../../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
6
5
  import { phoenixCustomElement } from '../../../../../core/decorators/phoenix_custom_element.js';
7
6
  import { SELECT_SEARCH_EVENT_NAMES, SELECT_RELATED_COMPONENTS_NAMES } from '../select_components_constatns.js';
@@ -12,32 +11,6 @@ let HSelectSearch = class HSelectSearch extends PhoenixLightLitElement {
12
11
  constructor() {
13
12
  super(...arguments);
14
13
  this.value = '';
15
- this._$selectOptions = null;
16
- this._handleSearchKeydown = (ev) => {
17
- if (ev.key !== 'ArrowDown' && ev.key !== 'ArrowUp')
18
- return;
19
- this._handleFocusOptionOnArrowNavigation();
20
- this._handleDispatchEventOnOptionsList(ev);
21
- };
22
- this._handleDispatchEventOnOptionsList = (ev) => {
23
- var _a;
24
- const arrowNavigationEvent = new KeyboardEvent('keydown', {
25
- key: ev.key
26
- });
27
- (_a = this._$selectOptions) === null || _a === void 0 ? void 0 : _a.dispatchEvent(arrowNavigationEvent);
28
- };
29
- this._handleFocusOptionOnArrowNavigation = () => {
30
- const $options = this._$selectOptions ? [...this._$selectOptions.querySelectorAll('h-option')] : [];
31
- const $availableOptions = $options.filter(($option) => {
32
- return !$option.getAttribute('inactive') && !$option.getAttribute('disabled') && !$option.hidden;
33
- });
34
- const $firstOption = $availableOptions.find(($option) => {
35
- return !$option.getAttribute('inactive') && !$option.getAttribute('disabled') && !$option.getAttribute('hidden');
36
- });
37
- const $selectedOption = $availableOptions.find(($option) => $option.getAttribute('aria-selected'));
38
- const $optionToFocus = $selectedOption || $firstOption;
39
- $optionToFocus === null || $optionToFocus === void 0 ? void 0 : $optionToFocus.focus();
40
- };
41
14
  this._handleInputChange = debounce_1(({ target }) => {
42
15
  this.value = target.value;
43
16
  this.emitCustomEvent(SELECT_SEARCH_EVENT_NAMES.search, {
@@ -48,9 +21,6 @@ let HSelectSearch = class HSelectSearch extends PhoenixLightLitElement {
48
21
  connectedCallback() {
49
22
  super.connectedCallback();
50
23
  this.classList.add(SELECT_SEARCH_CSS_CLASSES.selectSearch);
51
- // to musisz zrobić inaczej, bo jest kilka selectów na stronie
52
- this._$selectOptions = document.querySelector('h-options');
53
- this.addEventListener('keydown', this._handleSearchKeydown);
54
24
  }
55
25
  render() {
56
26
  return html `
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,qDAAyD;AAChG;AACA;AACA;AACA;AACA;AACA;AACA,uBAAuB,qDAAyD;AAChF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,qDAAyD;AAChG;AACA;AACA;AACA;AACA;AACA,uBAAuB,qDAAyD;AAChF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,5 +1,5 @@
1
1
  import { __decorate, __metadata } from '../../../../../../../external/tslib/tslib.es6.js';
2
- import '@dreamcommerce/utilities';
2
+ import { UiDomUtils } from '@dreamcommerce/utilities';
3
3
  import { PhoenixLightLitElement } from '../../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
4
4
  import { phoenixCustomElement } from '../../../../core/decorators/phoenix_custom_element.js';
5
5
  import { SELECT_OPTIONS_EVENT_NAMES, SELECT_OPTION_EVENT_NAMES, SELECT_RELATED_COMPONENTS_NAMES } from './select_components_constatns.js';
@@ -22,6 +22,7 @@ let HOptions = class HOptions extends PhoenixLightLitElement {
22
22
  });
23
23
  };
24
24
  this.setAttribute('role', 'listbox');
25
+ UiDomUtils.makeNavigable(this);
25
26
  this.addEventListener(SELECT_OPTION_EVENT_NAMES.clicked, this._dispatchClickedEvent);
26
27
  this.addEventListener(SELECT_OPTION_EVENT_NAMES.updated, this._dispatchUpdatedEvent);
27
28
  }
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,kDAAsD;AAC7F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,kDAAsD;AAC7F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,7 +1,5 @@
1
1
  import { PropertyValues, TemplateResult } from 'lit';
2
2
  import { HOption } from "./components/option/select_option";
3
- import { HSelectSearch } from "./components/search/select_search";
4
- import { ListBoxKeyboardController } from "../../../controllers/list_box_controller/list_box_keyboard_controller";
5
3
  import { PhoenixLightLitElement } from "../../../core/phoenix_light_lit_element/phoenix_light_lit_element";
6
4
  import { SelectOption } from "./model/select_option";
7
5
  import type { TSelectType } from "./select_types";
@@ -31,14 +29,13 @@ export declare class HSelect extends PhoenixLightLitElement {
31
29
  private _selectController;
32
30
  private _$options;
33
31
  private _$dropdown;
34
- $search: import("lit-html/directives/ref.js").Ref<HSelectSearch>;
32
+ private _$search;
35
33
  private _$optionsList;
36
34
  private _$dropdownContent;
37
35
  private _$dropdownToggler;
38
36
  private _selectContext;
39
- listBoxController: ListBoxKeyboardController;
37
+ private _listBoxController;
40
38
  private _optionsObserver;
41
- private _selectedOptionsAriaObserver;
42
39
  private $placeholder;
43
40
  constructor();
44
41
  updated(changedProperties: PropertyValues): void;
@@ -50,7 +47,6 @@ export declare class HSelect extends PhoenixLightLitElement {
50
47
  private _setupEvents;
51
48
  private _handleOptionDeselect;
52
49
  private _updateOptionsView;
53
- private _updateLabelAria;
54
50
  private _appendNewHTMLOption;
55
51
  updateOptionAriaAttribute($option: HOption): void;
56
52
  private _removeHTMLOptions;
@@ -40,7 +40,7 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
40
40
  this._searchValue = '';
41
41
  this._$options = new Map();
42
42
  this._$dropdown = createRef();
43
- this.$search = createRef();
43
+ this._$search = createRef();
44
44
  this._$optionsList = createRef();
45
45
  this._$dropdownContent = createRef();
46
46
  this._$dropdownToggler = createRef();
@@ -101,19 +101,6 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
101
101
  this.updateOptionAriaAttribute($option);
102
102
  });
103
103
  };
104
- this._updateLabelAria = (options) => {
105
- var _a;
106
- const ariaLabel = document.querySelector(`[id="${this.ariaLabelledby}"]`);
107
- (_a = ariaLabel === null || ariaLabel === void 0 ? void 0 : ariaLabel.querySelector(`[id="value-label"]`)) === null || _a === void 0 ? void 0 : _a.remove();
108
- if (ariaLabel) {
109
- ariaLabel.innerHTML = `
110
- ${ariaLabel === null || ariaLabel === void 0 ? void 0 : ariaLabel.innerHTML}
111
- <span id="value-label" class="sr-only">
112
- ${options.reduce((totalSelectedContent, currentOption) => (totalSelectedContent += currentOption.content), '')}
113
- </span>
114
- `;
115
- }
116
- };
117
104
  this._handleOptionClicked = ({ detail }) => {
118
105
  if (!(detail === null || detail === void 0 ? void 0 : detail.$option))
119
106
  return;
@@ -129,11 +116,10 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
129
116
  });
130
117
  };
131
118
  this._handleDropdownHidden = () => {
132
- var _a, _b;
119
+ var _a;
133
120
  this._searchValue = '';
134
121
  this.opened = false;
135
122
  (_a = this._$dropdownToggler.value) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-activedescendant', '');
136
- (_b = this._$dropdownToggler.value) === null || _b === void 0 ? void 0 : _b.focus();
137
123
  };
138
124
  this._manageSelectFocusAria = (ev) => {
139
125
  var _a;
@@ -193,7 +179,6 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
193
179
  return Array.from(this._$options.values());
194
180
  }
195
181
  updated(changedProperties) {
196
- var _a;
197
182
  super.updated(changedProperties);
198
183
  if (changedProperties.has('opened')) {
199
184
  if (this.opened) {
@@ -207,27 +192,16 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
207
192
  if (changedProperties.has('optionsList')) {
208
193
  this._updateOptions();
209
194
  }
210
- if (this._$optionsList.value) {
211
- (_a = this.listBoxController) === null || _a === void 0 ? void 0 : _a.hostDisconnected();
212
- this.listBoxController = new ListBoxKeyboardController({
195
+ if (this._$optionsList.value && !this._listBoxController)
196
+ this._listBoxController = new ListBoxKeyboardController({
213
197
  host: this,
214
198
  $list: this._$optionsList.value
215
199
  });
216
- }
217
- if (this.listBoxController) {
218
- this.listBoxController.calculateSelectedOptionIndex();
219
- }
220
200
  }
221
201
  _focusElementAfterSelectOpened() {
222
- var _a;
223
- const $searchInput = (_a = this.$search.value) === null || _a === void 0 ? void 0 : _a.querySelector('[role="search"]');
224
- const $options = this._$optionsList.value ? [...this._$optionsList.value.querySelectorAll('h-option')] : [];
225
- const $firstOption = $options.find(($option) => {
226
- return !$option.getAttribute('inactive') && !$option.getAttribute('disabled') && !$option.getAttribute('hidden');
227
- });
228
- const $selectedOption = this.selectedOptions[0];
229
- const $optionToFocus = $selectedOption || $firstOption;
230
- $searchInput ? $searchInput.focus() : $optionToFocus === null || $optionToFocus === void 0 ? void 0 : $optionToFocus.focus();
202
+ var _a, _b;
203
+ const $searchInput = (_a = this._$search.value) === null || _a === void 0 ? void 0 : _a.querySelector('[role="search"]');
204
+ $searchInput ? $searchInput.focus() : (_b = this._$optionsList.value) === null || _b === void 0 ? void 0 : _b.focus();
231
205
  }
232
206
  connectedCallback() {
233
207
  super.connectedCallback();
@@ -240,8 +214,6 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
240
214
  this._selectContext.provide(SELECT_CONTEXTS.isMultiselect, this.multiple);
241
215
  this._optionsObserver = new Observer((selectedOptions) => this._updateOptionsView(selectedOptions));
242
216
  this._selectController.options$.subscribe(this._optionsObserver);
243
- this._selectedOptionsAriaObserver = new Observer((selectedOptions) => this._updateLabelAria(selectedOptions));
244
- this._selectController.selectedOptions$.subscribe(this._selectedOptionsAriaObserver);
245
217
  this._updateOptions();
246
218
  this._setupEvents();
247
219
  }
@@ -271,10 +243,6 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
271
243
  SelectControlUtils.appendHTMLOption($option, $list, position);
272
244
  }
273
245
  updateOptionAriaAttribute($option) {
274
- if (!this.multiple) {
275
- const $options = this._$optionsList.value ? [...this._$optionsList.value.querySelectorAll('h-option')] : [];
276
- $options.forEach(($option) => ($option.removeAttribute('aria-selected')));
277
- }
278
246
  $option.setAttribute(this.multiple ? 'aria-checked' : 'aria-selected', String($option.selected));
279
247
  }
280
248
  _removeHTMLOptions(optionsValues) {
@@ -341,7 +309,6 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
341
309
  offset=${this.offset}
342
310
  content-width="full"
343
311
  prevent-focus-trap
344
- no-autofocus
345
312
  >
346
313
  <h-dropdown-toggler
347
314
  ${ref(this._$dropdownToggler)}
@@ -369,7 +336,7 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
369
336
  ${isSearchEnabled
370
337
  ? html ` <h-select-search
371
338
  class=${SELECT_CSS_CLASSES.selectSearch}
372
- ${ref(this.$search)}
339
+ ${ref(this._$search)}
373
340
  .value=${this._searchValue}
374
341
  @search=${this._handleSearch}
375
342
  ></h-select-search>`
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,+CAAmD;AAC1F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,+CAAmD;AAC1F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -5,6 +5,7 @@ export declare class NavigatorShare extends PhoenixLightLitElement {
5
5
  text: string;
6
6
  title: string;
7
7
  files: File[];
8
+ private _btnController;
8
9
  private get shareData();
9
10
  constructor();
10
11
  connectedCallback(): void;
@@ -3,6 +3,7 @@ import { html } from 'lit';
3
3
  import { property } from 'lit/decorators';
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
+ import { BtnController } from '../../../controllers/btn_controller/btn_controller.js';
6
7
  import { NAVIGATOR_SHARE_EVENTS } from './navigator_share_constants.js';
7
8
 
8
9
  let NavigatorShare = class NavigatorShare extends PhoenixLightLitElement {
@@ -25,8 +26,7 @@ let NavigatorShare = class NavigatorShare extends PhoenixLightLitElement {
25
26
  });
26
27
  }
27
28
  };
28
- this.setAttribute('tabindex', '0');
29
- this.setAttribute('role', 'button');
29
+ this._btnController = new BtnController(this, this._handleShare);
30
30
  }
31
31
  get shareData() {
32
32
  return {
@@ -1,14 +1,10 @@
1
1
  import { Any } from 'ts-toolbelt';
2
- import { ReactiveController, ReactiveControllerHost } from 'lit';
2
+ import { ReactiveControllerHost } from 'lit';
3
3
  import { LIST_BOX_KEYBOARD_NAVIGATION_DIRECTIONS } from "./list_box_controller_constants";
4
- import { HSelect } from "../../components/form/select/select";
5
4
  export declare type TListBoxKeyboardNavigationDirection = Any.Keys<typeof LIST_BOX_KEYBOARD_NAVIGATION_DIRECTIONS>;
6
5
  export declare type TListBoxKeyboardControllerConstructorOptions = {
7
- host: ReactiveControllerHost & HSelect;
6
+ host: ReactiveControllerHost & HTMLElement;
8
7
  $list: HTMLElement;
9
8
  listItemSelector?: string;
10
9
  orientation?: TListBoxKeyboardNavigationDirection;
11
10
  };
12
- export interface IListboxController extends ReactiveController {
13
- calculateSelectedOptionIndex(): void;
14
- }
@@ -1,5 +1,4 @@
1
1
  import 'ts-toolbelt';
2
2
  import 'lit';
3
3
  import '@phoenixRoot/controllers/list_box_controller/list_box_controller_constants';
4
- import '@phoenixRoot/components/form/select/select';
5
4
  //# sourceMappingURL=list_box_controller_types.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"list_box_controller_types.js","sourceRoot":"","sources":["../../../../../../../src/controllers/list_box_controller/list_box_controller_types.ts"],"names":[],"mappings":"AAAA,OAAoB,aAAa,CAAC;AAClC,OAA2D,KAAK,CAAC;AACjE,OAAwD,4EAA4E,CAAC;AACrI,OAAwB,4CAA4C,CAAC"}
1
+ {"version":3,"file":"list_box_controller_types.js","sourceRoot":"","sources":["../../../../../../../src/controllers/list_box_controller/list_box_controller_types.ts"],"names":[],"mappings":"AAAA,OAAoB,aAAa,CAAC;AAClC,OAAuC,KAAK,CAAC;AAC7C,OAAwD,4EAA4E,CAAC"}
@@ -1,14 +1,10 @@
1
- import { IListboxController, TListBoxKeyboardControllerConstructorOptions } from "./list_box_controller_types";
2
- export declare class ListBoxKeyboardController implements IListboxController {
1
+ import { ReactiveController } from 'lit';
2
+ import { TListBoxKeyboardControllerConstructorOptions } from "./list_box_controller_types";
3
+ export declare class ListBoxKeyboardController implements ReactiveController {
3
4
  #private;
4
5
  constructor({ host, $list, listItemSelector, orientation }: TListBoxKeyboardControllerConstructorOptions);
5
6
  hostConnected(): void;
6
- private _handleKeyboardNavigation;
7
7
  private _handleArrowNavigation;
8
- private _findCurrentIndex;
9
- private _handleWriteableCharacter;
10
- calculateSelectedOptionIndex: () => void;
11
8
  private _getPrevOptionIndex;
12
9
  private _getNextOptionIndex;
13
- hostDisconnected(): void;
14
10
  }
@@ -1,6 +1,7 @@
1
1
  import { __classPrivateFieldGet, __classPrivateFieldSet } from '../../../../../external/tslib/tslib.es6.js';
2
2
  import 'lit';
3
3
  import { UiDomUtils } from '@dreamcommerce/utilities';
4
+ import { KeystrokesController } from '../keystrokes_controller/keystrokes_controller.js';
4
5
  import { LIST_BOX_KEYBOARD_NAVIGATION_DIRECTIONS } from './list_box_controller_constants.js';
5
6
 
6
7
  var _ListBoxKeyboardController_host, _ListBoxKeyboardController__$list, _ListBoxKeyboardController_currentOptionIndex, _ListBoxKeyboardController__$options, _ListBoxKeyboardController_listItemSelector, _ListBoxKeyboardController_keys;
@@ -12,54 +13,25 @@ class ListBoxKeyboardController {
12
13
  _ListBoxKeyboardController__$options.set(this, void 0);
13
14
  _ListBoxKeyboardController_listItemSelector.set(this, void 0);
14
15
  _ListBoxKeyboardController_keys.set(this, void 0);
15
- this._handleKeyboardNavigation = (ev) => {
16
- if (__classPrivateFieldGet(this, _ListBoxKeyboardController_keys, "f").find((key) => key === ev.key)) {
17
- this._handleArrowNavigation(ev);
18
- return;
19
- }
20
- this._handleWriteableCharacter(ev);
21
- };
22
16
  this._handleArrowNavigation = (event) => {
23
17
  event.preventDefault();
24
18
  const { key } = event;
25
- const $availableOptions = __classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f").filter(($option) => {
26
- return !$option.getAttribute('inactive') && !$option.getAttribute('disabled') && !$option.hidden;
27
- });
28
- const prevOptionIndex = this._findCurrentIndex();
19
+ const prevOptionIndex = __classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f");
29
20
  let newOptionIndex = key === 'ArrowDown' || key === 'ArrowRight' ? this._getNextOptionIndex() : this._getPrevOptionIndex();
30
21
  if (newOptionIndex === undefined) {
31
- newOptionIndex = this._findCurrentIndex();
22
+ const selectedOptionIndex = __classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f").findIndex(($option) => $option.selected);
23
+ newOptionIndex = selectedOptionIndex !== -1 ? selectedOptionIndex : 0;
32
24
  }
33
25
  if (newOptionIndex === __classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f"))
34
26
  return;
35
27
  if (prevOptionIndex !== undefined) {
36
28
  const $prevOption = __classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f")[prevOptionIndex];
37
- $prevOption && UiDomUtils.makeUnnavigable($prevOption);
29
+ UiDomUtils.makeUnnavigable($prevOption);
38
30
  }
39
31
  __classPrivateFieldSet(this, _ListBoxKeyboardController_currentOptionIndex, newOptionIndex, "f");
40
- const $focusedOption = $availableOptions[newOptionIndex];
41
- if ($focusedOption) {
42
- UiDomUtils.makeNavigable($focusedOption);
43
- $focusedOption.focus();
44
- }
45
- };
46
- this._findCurrentIndex = () => {
47
- const $availableOptions = __classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f").filter(($option) => {
48
- return !$option.getAttribute('inactive') && !$option.getAttribute('disabled') && !$option.hidden;
49
- });
50
- const selectedOptionIndex = $availableOptions.findIndex(($option) => $option.selected);
51
- return selectedOptionIndex !== -1 ? selectedOptionIndex : 0;
52
- };
53
- this._handleWriteableCharacter = (ev) => {
54
- var _a;
55
- const $searchInput = (_a = __classPrivateFieldGet(this, _ListBoxKeyboardController_host, "f").$search.value) === null || _a === void 0 ? void 0 : _a.querySelector('[role="search"]');
56
- if (!$searchInput)
57
- return;
58
- $searchInput === null || $searchInput === void 0 ? void 0 : $searchInput.focus();
59
- };
60
- this.calculateSelectedOptionIndex = () => {
61
- const selectedOptionIndex = __classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f").findIndex(($option) => $option.selected);
62
- __classPrivateFieldSet(this, _ListBoxKeyboardController_currentOptionIndex, selectedOptionIndex !== -1 ? selectedOptionIndex : 0, "f");
32
+ const $focusedOption = __classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f")[newOptionIndex];
33
+ UiDomUtils.makeNavigable($focusedOption);
34
+ $focusedOption.focus();
63
35
  };
64
36
  __classPrivateFieldSet(this, _ListBoxKeyboardController_host, host, "f");
65
37
  __classPrivateFieldSet(this, _ListBoxKeyboardController__$list, $list, "f");
@@ -69,7 +41,12 @@ class ListBoxKeyboardController {
69
41
  __classPrivateFieldGet(this, _ListBoxKeyboardController_host, "f").addController(this);
70
42
  }
71
43
  hostConnected() {
72
- __classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f").addEventListener('keydown', this._handleKeyboardNavigation);
44
+ new KeystrokesController({
45
+ host: __classPrivateFieldGet(this, _ListBoxKeyboardController_host, "f"),
46
+ keys: __classPrivateFieldGet(this, _ListBoxKeyboardController_keys, "f"),
47
+ callback: this._handleArrowNavigation,
48
+ target: __classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f")
49
+ });
73
50
  UiDomUtils.makeNavigable(__classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f"));
74
51
  __classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f").addEventListener('focusin', (event) => {
75
52
  if (event.target !== __classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f"))
@@ -87,39 +64,15 @@ class ListBoxKeyboardController {
87
64
  return undefined;
88
65
  if (__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") <= 0)
89
66
  return __classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f");
90
- if (__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") <= 0)
91
- return __classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f");
92
- const $availableOptions = __classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f").filter(($option) => {
93
- return !$option.getAttribute('inactive') && !$option.getAttribute('disabled') && !$option.hidden;
94
- });
95
- if (!!$availableOptions[__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") - 1])
96
- return __classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") - 1;
97
- // bo ktoś wpisał coś w searcha i index obecnie wybranej opcji jest inny
98
- const newIndexOfCurrentlySelectedOption = $availableOptions.findIndex(($option) => $option.selected);
99
- if (newIndexOfCurrentlySelectedOption)
100
- return newIndexOfCurrentlySelectedOption - 1;
101
67
  return __classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") - 1;
102
68
  }
103
69
  _getNextOptionIndex() {
104
70
  if (__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") === undefined)
105
71
  return undefined;
106
- const $availableOptions = __classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f").filter(($option) => {
107
- return !$option.getAttribute('inactive') && !$option.getAttribute('disabled') && !$option.hidden;
108
- });
109
- if (__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") === $availableOptions.length - 1)
72
+ if (__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") >= __classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f").length - 1)
110
73
  return __classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f");
111
- if (__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") > $availableOptions.length - 1) {
112
- // bo ktoś wpisał coś w searcha i index obecnie wybranej opcji jest inny
113
- const newIndexOfCurrentlySelectedOption = $availableOptions.findIndex(($option) => $option.selected);
114
- if (newIndexOfCurrentlySelectedOption)
115
- return newIndexOfCurrentlySelectedOption + 1;
116
- return 0;
117
- }
118
74
  return __classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") + 1;
119
75
  }
120
- hostDisconnected() {
121
- __classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f").removeEventListener('keydown', this._handleKeyboardNavigation);
122
- }
123
76
  }
124
77
  _ListBoxKeyboardController_host = new WeakMap(), _ListBoxKeyboardController__$list = new WeakMap(), _ListBoxKeyboardController_currentOptionIndex = new WeakMap(), _ListBoxKeyboardController__$options = new WeakMap(), _ListBoxKeyboardController_listItemSelector = new WeakMap(), _ListBoxKeyboardController_keys = new WeakMap();
125
78
 
@@ -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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@shoper/phoenix_design_system",
3
3
  "packageManager": "yarn@3.2.0",
4
4
  "sideEffects": false,
5
- "version": "1.15.6-2",
5
+ "version": "1.15.6-3",
6
6
  "description": "phoenix design system",
7
7
  "author": "zefirek",
8
8
  "license": "MIT",