@shoper/phoenix_design_system 1.15.3-3 → 1.15.3-30
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.
- package/build/cjs/packages/phoenix/src/components/dropdown/dropdown.js +9 -2
- package/build/cjs/packages/phoenix/src/components/dropdown/dropdown.js.map +1 -1
- package/build/cjs/packages/phoenix/src/components/dropdown/dropdown_toggler.js +6 -1
- package/build/cjs/packages/phoenix/src/components/dropdown/dropdown_toggler.js.map +1 -1
- package/build/cjs/packages/phoenix/src/components/form/search/search.js +1 -12
- package/build/cjs/packages/phoenix/src/components/form/search/search.js.map +1 -1
- package/build/cjs/packages/phoenix/src/components/form/select/components/search/select_search.js +30 -0
- package/build/cjs/packages/phoenix/src/components/form/select/components/search/select_search.js.map +1 -1
- package/build/cjs/packages/phoenix/src/components/form/select/components/select_options.js +1 -2
- package/build/cjs/packages/phoenix/src/components/form/select/components/select_options.js.map +1 -1
- package/build/cjs/packages/phoenix/src/components/form/select/select.js +26 -8
- package/build/cjs/packages/phoenix/src/components/form/select/select.js.map +1 -1
- package/build/cjs/packages/phoenix/src/components/modal/modal.js +8 -12
- package/build/cjs/packages/phoenix/src/components/modal/modal.js.map +1 -1
- package/build/cjs/packages/phoenix/src/controllers/list_box_controller/list_box_keyboard_controller.js +62 -15
- package/build/cjs/packages/phoenix/src/controllers/list_box_controller/list_box_keyboard_controller.js.map +1 -1
- package/build/esm/packages/phoenix/src/components/dropdown/dropdown.d.ts +1 -0
- package/build/esm/packages/phoenix/src/components/dropdown/dropdown.js +9 -2
- package/build/esm/packages/phoenix/src/components/dropdown/dropdown.js.map +1 -1
- package/build/esm/packages/phoenix/src/components/dropdown/dropdown_toggler.d.ts +1 -0
- package/build/esm/packages/phoenix/src/components/dropdown/dropdown_toggler.js +6 -1
- package/build/esm/packages/phoenix/src/components/dropdown/dropdown_toggler.js.map +1 -1
- package/build/esm/packages/phoenix/src/components/form/search/search.d.ts +0 -1
- package/build/esm/packages/phoenix/src/components/form/search/search.js +1 -12
- package/build/esm/packages/phoenix/src/components/form/search/search.js.map +1 -1
- package/build/esm/packages/phoenix/src/components/form/select/components/search/select_search.d.ts +4 -0
- package/build/esm/packages/phoenix/src/components/form/select/components/search/select_search.js +30 -0
- package/build/esm/packages/phoenix/src/components/form/select/components/search/select_search.js.map +1 -1
- package/build/esm/packages/phoenix/src/components/form/select/components/select_options.js +1 -2
- package/build/esm/packages/phoenix/src/components/form/select/components/select_options.js.map +1 -1
- package/build/esm/packages/phoenix/src/components/form/select/select.d.ts +4 -2
- package/build/esm/packages/phoenix/src/components/form/select/select.js +26 -8
- package/build/esm/packages/phoenix/src/components/form/select/select.js.map +1 -1
- package/build/esm/packages/phoenix/src/components/modal/modal.d.ts +0 -1
- package/build/esm/packages/phoenix/src/components/modal/modal.js +9 -13
- package/build/esm/packages/phoenix/src/components/modal/modal.js.map +1 -1
- package/build/esm/packages/phoenix/src/controllers/list_box_controller/list_box_controller_types.d.ts +6 -2
- package/build/esm/packages/phoenix/src/controllers/list_box_controller/list_box_controller_types.js +1 -0
- package/build/esm/packages/phoenix/src/controllers/list_box_controller/list_box_controller_types.js.map +1 -1
- package/build/esm/packages/phoenix/src/controllers/list_box_controller/list_box_keyboard_controller.d.ts +7 -3
- package/build/esm/packages/phoenix/src/controllers/list_box_controller/list_box_keyboard_controller.js +62 -15
- package/build/esm/packages/phoenix/src/controllers/list_box_controller/list_box_keyboard_controller.js.map +1 -1
- package/package.json +1 -1
- package/build/cjs/packages/phoenix/src/controllers/inert_controller/inert_controller.js +0 -35
- package/build/cjs/packages/phoenix/src/controllers/inert_controller/inert_controller.js.map +0 -1
- package/build/esm/packages/phoenix/src/controllers/inert_controller/inert_controller.d.ts +0 -9
- package/build/esm/packages/phoenix/src/controllers/inert_controller/inert_controller.js +0 -31
- package/build/esm/packages/phoenix/src/controllers/inert_controller/inert_controller.js.map +0 -1
- package/build/esm/packages/phoenix/src/controllers/inert_controller/inert_controller_types.d.ts +0 -9
- package/build/esm/packages/phoenix/src/controllers/inert_controller/inert_controller_types.js +0 -3
- package/build/esm/packages/phoenix/src/controllers/inert_controller/inert_controller_types.js.map +0 -1
|
@@ -32,6 +32,7 @@ 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;
|
|
35
36
|
this._backdropController = new backdrop_controller.BackdropController();
|
|
36
37
|
this._handleClickOutside = async (target) => {
|
|
37
38
|
var _a, _b;
|
|
@@ -48,7 +49,8 @@ exports.HDropdown = HDropdown_1 = class HDropdown extends phoenix_light_lit_elem
|
|
|
48
49
|
return;
|
|
49
50
|
}
|
|
50
51
|
await this.show();
|
|
51
|
-
this.
|
|
52
|
+
if (!this.noAutoFocus)
|
|
53
|
+
this._focusOnFirstContentElement();
|
|
52
54
|
};
|
|
53
55
|
this.show = async () => {
|
|
54
56
|
if (this.opened)
|
|
@@ -176,7 +178,8 @@ exports.HDropdown = HDropdown_1 = class HDropdown extends phoenix_light_lit_elem
|
|
|
176
178
|
const isHoveredWithinDropdown = this._isHoveredWithinDropdown(ev.target);
|
|
177
179
|
if (isHoveredWithinDropdown && !this.opened) {
|
|
178
180
|
await this.show();
|
|
179
|
-
this.
|
|
181
|
+
if (!this.noAutoFocus)
|
|
182
|
+
this._focusOnFirstContentElement();
|
|
180
183
|
return;
|
|
181
184
|
}
|
|
182
185
|
if (!isHoveredWithinDropdown && this.opened)
|
|
@@ -466,6 +469,10 @@ tslib_es6.__decorate([
|
|
|
466
469
|
decorators_js.property({ type: Boolean, attribute: 'prevent-focus-trap' }),
|
|
467
470
|
tslib_es6.__metadata("design:type", Object)
|
|
468
471
|
], 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);
|
|
469
476
|
exports.HDropdown = HDropdown_1 = tslib_es6.__decorate([
|
|
470
477
|
phoenix_custom_element.phoenixCustomElement('h-dropdown'),
|
|
471
478
|
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;"}
|
|
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;"}
|
|
@@ -16,6 +16,7 @@ exports.HDropdownToggler = class HDropdownToggler extends phoenix_light_lit_elem
|
|
|
16
16
|
constructor() {
|
|
17
17
|
super();
|
|
18
18
|
this.name = '';
|
|
19
|
+
this.ariaHasPopup = 'menu';
|
|
19
20
|
this._setupTogglerAria = () => {
|
|
20
21
|
this._$dropdown = this.closest(dropdown_constants.DROPDOWN_CONTAINER_NAME);
|
|
21
22
|
if (this._$dropdown.isOpened)
|
|
@@ -23,7 +24,7 @@ exports.HDropdownToggler = class HDropdownToggler extends phoenix_light_lit_elem
|
|
|
23
24
|
host: this,
|
|
24
25
|
initialAriaExpandedValue: this._$dropdown.isOpened()
|
|
25
26
|
});
|
|
26
|
-
this.setAttribute('aria-haspopup',
|
|
27
|
+
this.setAttribute('aria-haspopup', this.ariaHasPopup);
|
|
27
28
|
if (this._$dropdown.id)
|
|
28
29
|
this.setAttribute('aria-controls', this._$dropdown.id);
|
|
29
30
|
};
|
|
@@ -60,6 +61,10 @@ tslib_es6.__decorate([
|
|
|
60
61
|
decorators.property({ type: String, reflect: true }),
|
|
61
62
|
tslib_es6.__metadata("design:type", Object)
|
|
62
63
|
], 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);
|
|
63
68
|
exports.HDropdownToggler = tslib_es6.__decorate([
|
|
64
69
|
phoenix_custom_element.phoenixCustomElement('h-dropdown-toggler'),
|
|
65
70
|
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;"}
|
|
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;"}
|
|
@@ -16,7 +16,6 @@ var ref_js = require('lit-html/directives/ref.js');
|
|
|
16
16
|
var context_provider_controller = require('../../../core/context/context_provider_controller.js');
|
|
17
17
|
var global_constants = require('../../../global_constants.js');
|
|
18
18
|
var v4 = require('../../../../../../external/uuid/dist/esm-browser/v4.js');
|
|
19
|
-
var inert_controller = require('../../../controllers/inert_controller/inert_controller.js');
|
|
20
19
|
var when = require('../../../../../../external/lit/external/lit-html/directives/when.js');
|
|
21
20
|
var search_constants = require('./search_constants.js');
|
|
22
21
|
|
|
@@ -41,7 +40,6 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
41
40
|
this._activeItemId = `${this._id}-1`;
|
|
42
41
|
this._translations = {};
|
|
43
42
|
this._containerRole = 'grid';
|
|
44
|
-
this._inertController = null;
|
|
45
43
|
this._bindKeys = (ev) => {
|
|
46
44
|
switch (ev.key) {
|
|
47
45
|
case 'ArrowDown':
|
|
@@ -234,10 +232,8 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
234
232
|
}
|
|
235
233
|
};
|
|
236
234
|
this._removeSearchKeyboardNavigation = () => {
|
|
237
|
-
var _a;
|
|
238
235
|
document.removeEventListener('keydown', this._bindKeys);
|
|
239
236
|
document.removeEventListener('keyup', this._handleSearchTabNavigation);
|
|
240
|
-
(_a = this._inertController) === null || _a === void 0 ? void 0 : _a.show();
|
|
241
237
|
};
|
|
242
238
|
this._handleFocusOnInputWithCaretEnd = () => {
|
|
243
239
|
const isFocusedOnSearchInput = document.activeElement === this._inputField;
|
|
@@ -283,12 +279,6 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
283
279
|
}
|
|
284
280
|
async connectedCallback() {
|
|
285
281
|
super.connectedCallback();
|
|
286
|
-
this._inertController = new inert_controller.InertController({
|
|
287
|
-
host: this,
|
|
288
|
-
hideConditionHandler: (child) => {
|
|
289
|
-
return child !== this && !child.closest('h-search');
|
|
290
|
-
}
|
|
291
|
-
});
|
|
292
282
|
this._setupContext();
|
|
293
283
|
try {
|
|
294
284
|
this._searchContextConsumer = new context_consumer_controller.ContextConsumerController(this);
|
|
@@ -358,7 +348,7 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
358
348
|
}
|
|
359
349
|
_setupListeners() {
|
|
360
350
|
this.addEventListener(search_constants.SEARCH_CUSTOM_EVENT_NAMES.focusin, (ev) => {
|
|
361
|
-
var _a, _b, _c
|
|
351
|
+
var _a, _b, _c;
|
|
362
352
|
const $target = (_a = ev.detail) === null || _a === void 0 ? void 0 : _a.relatedTarget;
|
|
363
353
|
if ($target === null || $target === void 0 ? void 0 : $target.closest(`[id="${this._searchContentContainerId}"]`))
|
|
364
354
|
return;
|
|
@@ -369,7 +359,6 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
369
359
|
document.addEventListener('keydown', this._bindKeys);
|
|
370
360
|
document.addEventListener('keyup', this._handleSearchTabNavigation);
|
|
371
361
|
document.addEventListener('keydown', this._preventScrollingOnSearchContentBrowsing);
|
|
372
|
-
(_d = this._inertController) === null || _d === void 0 ? void 0 : _d.hide();
|
|
373
362
|
});
|
|
374
363
|
this.addEventListener(search_constants.SEARCH_CUSTOM_EVENT_NAMES.keyup, (ev) => {
|
|
375
364
|
const shouldShowMessage = ev.detail.searchPhrase !== '';
|
|
@@ -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,iBAAiB,wDAA4D;AAC7E
|
|
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,iBAAiB,wDAA4D;AAC7E,mBAAmB,qEAA6E;AAChG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
package/build/cjs/packages/phoenix/src/components/form/select/components/search/select_search.js
CHANGED
|
@@ -5,6 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
var tslib_es6 = require('../../../../../../../../external/tslib/tslib.es6.js');
|
|
6
6
|
var lit = require('lit');
|
|
7
7
|
var decorators = require('lit/decorators');
|
|
8
|
+
require('@dreamcommerce/utilities');
|
|
8
9
|
var phoenix_light_lit_element = require('../../../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js');
|
|
9
10
|
var phoenix_custom_element = require('../../../../../core/decorators/phoenix_custom_element.js');
|
|
10
11
|
var select_components_constatns = require('../select_components_constatns.js');
|
|
@@ -15,6 +16,32 @@ exports.HSelectSearch = class HSelectSearch extends phoenix_light_lit_element.Ph
|
|
|
15
16
|
constructor() {
|
|
16
17
|
super(...arguments);
|
|
17
18
|
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
|
+
};
|
|
18
45
|
this._handleInputChange = debounce['default'](({ target }) => {
|
|
19
46
|
this.value = target.value;
|
|
20
47
|
this.emitCustomEvent(select_components_constatns.SELECT_SEARCH_EVENT_NAMES.search, {
|
|
@@ -25,6 +52,9 @@ exports.HSelectSearch = class HSelectSearch extends phoenix_light_lit_element.Ph
|
|
|
25
52
|
connectedCallback() {
|
|
26
53
|
super.connectedCallback();
|
|
27
54
|
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);
|
|
28
58
|
}
|
|
29
59
|
render() {
|
|
30
60
|
return lit.html `
|
package/build/cjs/packages/phoenix/src/components/form/select/components/search/select_search.js.map
CHANGED
|
@@ -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,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;"}
|
|
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;"}
|
|
@@ -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
|
-
|
|
6
|
+
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,7 +26,6 @@ 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);
|
|
30
29
|
this.addEventListener(select_components_constatns.SELECT_OPTION_EVENT_NAMES.clicked, this._dispatchClickedEvent);
|
|
31
30
|
this.addEventListener(select_components_constatns.SELECT_OPTION_EVENT_NAMES.updated, this._dispatchUpdatedEvent);
|
|
32
31
|
}
|
package/build/cjs/packages/phoenix/src/components/form/select/components/select_options.js.map
CHANGED
|
@@ -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;"}
|
|
@@ -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
|
|
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();
|
|
@@ -120,10 +120,11 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
120
120
|
});
|
|
121
121
|
};
|
|
122
122
|
this._handleDropdownHidden = () => {
|
|
123
|
-
var _a;
|
|
123
|
+
var _a, _b;
|
|
124
124
|
this._searchValue = '';
|
|
125
125
|
this.opened = false;
|
|
126
126
|
(_a = this._$dropdownToggler.value) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-activedescendant', '');
|
|
127
|
+
(_b = this._$dropdownToggler.value) === null || _b === void 0 ? void 0 : _b.focus();
|
|
127
128
|
};
|
|
128
129
|
this._manageSelectFocusAria = (ev) => {
|
|
129
130
|
var _a;
|
|
@@ -183,6 +184,7 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
183
184
|
return Array.from(this._$options.values());
|
|
184
185
|
}
|
|
185
186
|
updated(changedProperties) {
|
|
187
|
+
var _a;
|
|
186
188
|
super.updated(changedProperties);
|
|
187
189
|
if (changedProperties.has('opened')) {
|
|
188
190
|
if (this.opened) {
|
|
@@ -196,16 +198,27 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
196
198
|
if (changedProperties.has('optionsList')) {
|
|
197
199
|
this._updateOptions();
|
|
198
200
|
}
|
|
199
|
-
if (this._$optionsList.value
|
|
200
|
-
this.
|
|
201
|
+
if (this._$optionsList.value) {
|
|
202
|
+
(_a = this.listBoxController) === null || _a === void 0 ? void 0 : _a.hostDisconnected();
|
|
203
|
+
this.listBoxController = new list_box_keyboard_controller.ListBoxKeyboardController({
|
|
201
204
|
host: this,
|
|
202
205
|
$list: this._$optionsList.value
|
|
203
206
|
});
|
|
207
|
+
}
|
|
208
|
+
if (this.listBoxController) {
|
|
209
|
+
this.listBoxController.calculateSelectedOptionIndex();
|
|
210
|
+
}
|
|
204
211
|
}
|
|
205
212
|
_focusElementAfterSelectOpened() {
|
|
206
|
-
var _a
|
|
207
|
-
const $searchInput = (_a = this
|
|
208
|
-
$
|
|
213
|
+
var _a;
|
|
214
|
+
const $searchInput = (_a = this.$search.value) === null || _a === void 0 ? void 0 : _a.querySelector('[role="search"]');
|
|
215
|
+
const $options = this._$optionsList.value ? [...this._$optionsList.value.querySelectorAll('h-option')] : [];
|
|
216
|
+
const $firstOption = $options.find(($option) => {
|
|
217
|
+
return !$option.getAttribute('inactive') && !$option.getAttribute('disabled') && !$option.getAttribute('hidden');
|
|
218
|
+
});
|
|
219
|
+
const $selectedOption = this.selectedOptions[0];
|
|
220
|
+
const $optionToFocus = $selectedOption || $firstOption;
|
|
221
|
+
$searchInput ? $searchInput.focus() : $optionToFocus === null || $optionToFocus === void 0 ? void 0 : $optionToFocus.focus();
|
|
209
222
|
}
|
|
210
223
|
connectedCallback() {
|
|
211
224
|
super.connectedCallback();
|
|
@@ -247,6 +260,10 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
247
260
|
select_utils.SelectControlUtils.appendHTMLOption($option, $list, position);
|
|
248
261
|
}
|
|
249
262
|
updateOptionAriaAttribute($option) {
|
|
263
|
+
if (!this.multiple) {
|
|
264
|
+
const $options = this._$optionsList.value ? [...this._$optionsList.value.querySelectorAll('h-option')] : [];
|
|
265
|
+
$options.forEach(($option) => ($option.removeAttribute('aria-selected')));
|
|
266
|
+
}
|
|
250
267
|
$option.setAttribute(this.multiple ? 'aria-checked' : 'aria-selected', String($option.selected));
|
|
251
268
|
}
|
|
252
269
|
_removeHTMLOptions(optionsValues) {
|
|
@@ -313,6 +330,7 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
313
330
|
offset=${this.offset}
|
|
314
331
|
content-width="full"
|
|
315
332
|
prevent-focus-trap
|
|
333
|
+
no-autofocus
|
|
316
334
|
>
|
|
317
335
|
<h-dropdown-toggler
|
|
318
336
|
${ref_js.ref(this._$dropdownToggler)}
|
|
@@ -340,7 +358,7 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
340
358
|
${isSearchEnabled
|
|
341
359
|
? lit.html ` <h-select-search
|
|
342
360
|
class=${select_constants.SELECT_CSS_CLASSES.selectSearch}
|
|
343
|
-
${ref_js.ref(this
|
|
361
|
+
${ref_js.ref(this.$search)}
|
|
344
362
|
.value=${this._searchValue}
|
|
345
363
|
@search=${this._handleSearch}
|
|
346
364
|
></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;"}
|
|
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;"}
|
|
@@ -15,7 +15,6 @@ var backdrop_constants = require('../backdrop/backdrop_constants.js');
|
|
|
15
15
|
var backdrop_controller = require('../backdrop/controller/backdrop_controller.js');
|
|
16
16
|
var modal_constants = require('./modal_constants.js');
|
|
17
17
|
var modal_close = require('./modal_close.js');
|
|
18
|
-
var inert_controller = require('../../controllers/inert_controller/inert_controller.js');
|
|
19
18
|
|
|
20
19
|
var HModal_1;
|
|
21
20
|
exports.HModal = HModal_1 = class HModal extends phoenix_light_lit_element.PhoenixLightLitElement {
|
|
@@ -54,7 +53,6 @@ exports.HModal = HModal_1 = class HModal extends phoenix_light_lit_element.Phoen
|
|
|
54
53
|
}
|
|
55
54
|
};
|
|
56
55
|
this._backdropController = new backdrop_controller.BackdropController();
|
|
57
|
-
this._inertController = null;
|
|
58
56
|
this._keepFocusWithinModal = (ev) => {
|
|
59
57
|
var _a;
|
|
60
58
|
const isTabPressed = ev.code === 'Tab';
|
|
@@ -117,12 +115,16 @@ exports.HModal = HModal_1 = class HModal extends phoenix_light_lit_element.Phoen
|
|
|
117
115
|
});
|
|
118
116
|
};
|
|
119
117
|
this._addInertToBodyChildrenElements = () => {
|
|
120
|
-
|
|
121
|
-
|
|
118
|
+
[...document.body.children].forEach((child) => {
|
|
119
|
+
if (child.tagName !== portal_constants.PORTAL_TARGET_COMPONENT_NAME.toUpperCase()) {
|
|
120
|
+
child.setAttribute('inert', '');
|
|
121
|
+
}
|
|
122
|
+
});
|
|
122
123
|
};
|
|
123
124
|
this._removeInertFromBodyChildrenElements = () => {
|
|
124
|
-
|
|
125
|
-
|
|
125
|
+
[...document.body.children].forEach((child) => {
|
|
126
|
+
child.removeAttribute('inert');
|
|
127
|
+
});
|
|
126
128
|
};
|
|
127
129
|
this.hidden = true;
|
|
128
130
|
this._focusableElements = [...this.querySelectorAll(modal_constants.FOCUSABLE_ELEMENTS_WITHIN_MODAL)];
|
|
@@ -141,12 +143,6 @@ exports.HModal = HModal_1 = class HModal extends phoenix_light_lit_element.Phoen
|
|
|
141
143
|
connectedCallback() {
|
|
142
144
|
super.connectedCallback();
|
|
143
145
|
HModal_1._appendModalsPortal();
|
|
144
|
-
this._inertController = new inert_controller.InertController({
|
|
145
|
-
host: this,
|
|
146
|
-
hideConditionHandler: (child) => {
|
|
147
|
-
return child.tagName !== portal_constants.PORTAL_TARGET_COMPONENT_NAME.toUpperCase();
|
|
148
|
-
}
|
|
149
|
-
});
|
|
150
146
|
document.addEventListener('keyup', this._keepFocusWithinModal);
|
|
151
147
|
document.addEventListener(modal_constants.MODAL_EVENTS.close, this._handleCloseFromCloseComponent);
|
|
152
148
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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
|
require('lit');
|
|
7
7
|
var utilities = require('@dreamcommerce/utilities');
|
|
8
|
-
var keystrokes_controller = require('../keystrokes_controller/keystrokes_controller.js');
|
|
9
8
|
var list_box_controller_constants = require('./list_box_controller_constants.js');
|
|
10
9
|
|
|
11
10
|
var _ListBoxKeyboardController_host, _ListBoxKeyboardController__$list, _ListBoxKeyboardController_currentOptionIndex, _ListBoxKeyboardController__$options, _ListBoxKeyboardController_listItemSelector, _ListBoxKeyboardController_keys;
|
|
@@ -17,25 +16,54 @@ class ListBoxKeyboardController {
|
|
|
17
16
|
_ListBoxKeyboardController__$options.set(this, void 0);
|
|
18
17
|
_ListBoxKeyboardController_listItemSelector.set(this, void 0);
|
|
19
18
|
_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
|
+
};
|
|
20
26
|
this._handleArrowNavigation = (event) => {
|
|
21
27
|
event.preventDefault();
|
|
22
28
|
const { key } = event;
|
|
23
|
-
const
|
|
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();
|
|
24
33
|
let newOptionIndex = key === 'ArrowDown' || key === 'ArrowRight' ? this._getNextOptionIndex() : this._getPrevOptionIndex();
|
|
25
34
|
if (newOptionIndex === undefined) {
|
|
26
|
-
|
|
27
|
-
newOptionIndex = selectedOptionIndex !== -1 ? selectedOptionIndex : 0;
|
|
35
|
+
newOptionIndex = this._findCurrentIndex();
|
|
28
36
|
}
|
|
29
37
|
if (newOptionIndex === tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f"))
|
|
30
38
|
return;
|
|
31
39
|
if (prevOptionIndex !== undefined) {
|
|
32
40
|
const $prevOption = tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f")[prevOptionIndex];
|
|
33
|
-
utilities.UiDomUtils.makeUnnavigable($prevOption);
|
|
41
|
+
$prevOption && utilities.UiDomUtils.makeUnnavigable($prevOption);
|
|
34
42
|
}
|
|
35
43
|
tslib_es6.__classPrivateFieldSet(this, _ListBoxKeyboardController_currentOptionIndex, newOptionIndex, "f");
|
|
36
|
-
const $focusedOption =
|
|
37
|
-
|
|
38
|
-
|
|
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");
|
|
39
67
|
};
|
|
40
68
|
tslib_es6.__classPrivateFieldSet(this, _ListBoxKeyboardController_host, host, "f");
|
|
41
69
|
tslib_es6.__classPrivateFieldSet(this, _ListBoxKeyboardController__$list, $list, "f");
|
|
@@ -45,12 +73,7 @@ class ListBoxKeyboardController {
|
|
|
45
73
|
tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_host, "f").addController(this);
|
|
46
74
|
}
|
|
47
75
|
hostConnected() {
|
|
48
|
-
|
|
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
|
-
});
|
|
76
|
+
tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f").addEventListener('keydown', this._handleKeyboardNavigation);
|
|
54
77
|
utilities.UiDomUtils.makeNavigable(tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f"));
|
|
55
78
|
tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f").addEventListener('focusin', (event) => {
|
|
56
79
|
if (event.target !== tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f"))
|
|
@@ -68,15 +91,39 @@ class ListBoxKeyboardController {
|
|
|
68
91
|
return undefined;
|
|
69
92
|
if (tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") <= 0)
|
|
70
93
|
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;
|
|
71
105
|
return tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") - 1;
|
|
72
106
|
}
|
|
73
107
|
_getNextOptionIndex() {
|
|
74
108
|
if (tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") === undefined)
|
|
75
109
|
return undefined;
|
|
76
|
-
|
|
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)
|
|
77
114
|
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
|
+
}
|
|
78
122
|
return tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") + 1;
|
|
79
123
|
}
|
|
124
|
+
hostDisconnected() {
|
|
125
|
+
tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f").removeEventListener('keydown', this._handleKeyboardNavigation);
|
|
126
|
+
}
|
|
80
127
|
}
|
|
81
128
|
_ListBoxKeyboardController_host = new WeakMap(), _ListBoxKeyboardController__$list = new WeakMap(), _ListBoxKeyboardController_currentOptionIndex = new WeakMap(), _ListBoxKeyboardController__$options = new WeakMap(), _ListBoxKeyboardController_listItemSelector = new WeakMap(), _ListBoxKeyboardController_keys = new WeakMap();
|
|
82
129
|
|
|
@@ -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;"}
|
|
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;"}
|
|
@@ -17,6 +17,7 @@ export declare class HDropdown extends PhoenixLightLitElement implements IDropdo
|
|
|
17
17
|
mobilePosition: TMobileElementPosition;
|
|
18
18
|
id: string;
|
|
19
19
|
preventFocusTrap: boolean;
|
|
20
|
+
noAutoFocus: boolean;
|
|
20
21
|
$dropdownToggler: HDropdownToggler | null;
|
|
21
22
|
$dropdownContent: HDropdownContent | null;
|
|
22
23
|
$nestedDropdownContentElements?: HDropdownContent[];
|
|
@@ -28,6 +28,7 @@ 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;
|
|
31
32
|
this._backdropController = new BackdropController();
|
|
32
33
|
this._handleClickOutside = async (target) => {
|
|
33
34
|
var _a, _b;
|
|
@@ -44,7 +45,8 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
|
|
|
44
45
|
return;
|
|
45
46
|
}
|
|
46
47
|
await this.show();
|
|
47
|
-
this.
|
|
48
|
+
if (!this.noAutoFocus)
|
|
49
|
+
this._focusOnFirstContentElement();
|
|
48
50
|
};
|
|
49
51
|
this.show = async () => {
|
|
50
52
|
if (this.opened)
|
|
@@ -172,7 +174,8 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
|
|
|
172
174
|
const isHoveredWithinDropdown = this._isHoveredWithinDropdown(ev.target);
|
|
173
175
|
if (isHoveredWithinDropdown && !this.opened) {
|
|
174
176
|
await this.show();
|
|
175
|
-
this.
|
|
177
|
+
if (!this.noAutoFocus)
|
|
178
|
+
this._focusOnFirstContentElement();
|
|
176
179
|
return;
|
|
177
180
|
}
|
|
178
181
|
if (!isHoveredWithinDropdown && this.opened)
|
|
@@ -462,6 +465,10 @@ __decorate([
|
|
|
462
465
|
property({ type: Boolean, attribute: 'prevent-focus-trap' }),
|
|
463
466
|
__metadata("design:type", Object)
|
|
464
467
|
], 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);
|
|
465
472
|
HDropdown = HDropdown_1 = __decorate([
|
|
466
473
|
phoenixCustomElement('h-dropdown'),
|
|
467
474
|
__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;"}
|
|
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,6 +1,7 @@
|
|
|
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;
|
|
4
5
|
private _btnController;
|
|
5
6
|
private _toggleElementAriaController;
|
|
6
7
|
private _$dropdown;
|