2019-07-02 21:10:10 +00:00
|
|
|
( function () {
|
2019-06-20 19:17:50 +00:00
|
|
|
var
|
2021-12-15 22:59:11 +00:00
|
|
|
checkboxHack = require( ( 'mediawiki.page.ready' ) ).checkboxHack,
|
|
|
|
CHECKBOX_HACK_CONTAINER_SELECTOR = '.toggle-list',
|
|
|
|
CHECKBOX_HACK_CHECKBOX_SELECTOR = '.toggle-list__checkbox',
|
|
|
|
CHECKBOX_HACK_BUTTON_SELECTOR = '.toggle-list__toggle',
|
|
|
|
CHECKBOX_HACK_TARGET_SELECTOR = '.toggle-list__list';
|
2019-06-20 19:17:50 +00:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Automatically dismiss the list when clicking or focusing elsewhere and update the
|
|
|
|
* aria-expanded attribute based on list visibility.
|
2020-06-02 21:21:44 +00:00
|
|
|
*
|
2019-06-20 19:17:50 +00:00
|
|
|
* @param {Window} window
|
|
|
|
* @param {HTMLElement} component
|
|
|
|
*/
|
2019-07-31 17:36:19 +00:00
|
|
|
function bind( window, component ) {
|
2019-06-20 19:17:50 +00:00
|
|
|
var
|
|
|
|
checkbox = /** @type {HTMLInputElement} */ (
|
2021-12-15 22:59:11 +00:00
|
|
|
component.querySelector( CHECKBOX_HACK_CHECKBOX_SELECTOR )
|
|
|
|
),
|
|
|
|
button = component.querySelector( CHECKBOX_HACK_BUTTON_SELECTOR ),
|
|
|
|
target = component.querySelector( CHECKBOX_HACK_TARGET_SELECTOR );
|
2019-06-20 19:17:50 +00:00
|
|
|
|
2021-12-15 22:59:11 +00:00
|
|
|
if ( !( checkbox && button && target ) ) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
checkboxHack.bind( window, checkbox, button, target );
|
2019-06-20 19:17:50 +00:00
|
|
|
}
|
|
|
|
|
2019-07-02 21:10:10 +00:00
|
|
|
module.exports = Object.freeze( {
|
2021-12-15 22:59:11 +00:00
|
|
|
selector: CHECKBOX_HACK_CONTAINER_SELECTOR,
|
2019-06-20 19:17:50 +00:00
|
|
|
bind: bind
|
2019-07-02 21:10:10 +00:00
|
|
|
} );
|
|
|
|
}() );
|