@momentum-ui/react-collaboration
Version:
Cisco Momentum UI Framework for React Collaboration Applications
87 lines • 3.11 kB
JavaScript
import { dispatchEvent, EventType } from '../Popover.events';
var openedTippyInstances = [];
var options = {
hideKeys: ['Escape'],
stopEventPropagation: false,
hideListenerTarget: 'window',
};
/**
* Change plugin settings
* @param options
*/
export var setupHideOnPlugin = function (_a) {
var hideKeys = _a.hideKeys, stopEventPropagation = _a.stopEventPropagation, hideListenerTarget = _a.hideListenerTarget;
options.hideKeys = hideKeys.slice();
options.stopEventPropagation = stopEventPropagation;
options.hideListenerTarget = hideListenerTarget;
};
// hide the last opened popover when Escape key is pressed
function onKeyDown(event) {
if (options.hideKeys.includes(event.key) && openedTippyInstances.length !== 0) {
if (options.stopEventPropagation) {
event.stopImmediatePropagation();
}
var lastIdx = openedTippyInstances.length - 1;
openedTippyInstances[lastIdx].hide();
}
}
/**
* Register tippy instance when it appear
* Instances registered only once
*
* @param instance Tippy instance
*/
var addInstance = function (instance) {
if (openedTippyInstances.indexOf(instance) >= 0) {
return;
}
if (openedTippyInstances.length === 0) {
if (options.hideListenerTarget === 'this') {
instance.reference.addEventListener('keydown', onKeyDown);
instance.popper.addEventListener('keydown', onKeyDown);
}
else {
window.addEventListener('keydown', onKeyDown);
}
}
openedTippyInstances.push(instance);
// Send custom event that tippy instance is shown on screen. This event is listened for in instances of Dialog to prevent it from closing unintentionally.
dispatchEvent(EventType.TIPPY_INSTANCE_ADDED, instance);
};
/**
* Unregister Tippy instances after it disappear
* @param instance
*/
var removeInstance = function (instance) {
openedTippyInstances.splice(openedTippyInstances.indexOf(instance), 1);
if (openedTippyInstances.length === 0) {
if (options.hideListenerTarget === 'this') {
instance.reference.removeEventListener('keydown', onKeyDown);
instance.popper.removeEventListener('keydown', onKeyDown);
}
else {
window.removeEventListener('keydown', onKeyDown);
}
}
// Send custom event that tippy instance is no longer shown on screen. This event is listened for in instances of Dialog to allow it to close once there are no tippy instances
// still shown on screen that were opened after the render of the Dialog.
dispatchEvent(EventType.TIPPY_INSTANCE_REMOVED, instance);
};
/**
* Tippy plugin to add hiding on Esc to Popover
*/
export var hideOnEscPlugin = {
name: 'hideOnEsc',
defaultValue: true,
fn: function (tippyInstance) {
return {
onShow: function () {
addInstance(tippyInstance);
},
onHide: function () {
removeInstance(tippyInstance);
},
};
},
};
//# sourceMappingURL=hideOnEscPlugin.js.map