@atlaskit/editor-plugin-insert-block
Version:
Insert block plugin for @atlaskit/editor-core
50 lines • 2.47 kB
JavaScript
import { useState, useCallback } from 'react';
import { isDetachedElement } from '../utils/utils';
export const usePopupManager = (config = {}) => {
const [isOpen, setIsOpen] = useState(false);
const [isOpenedByKeyboard, setIsOpenedByKeyboard] = useState(false);
const toggle = useCallback(inputMethod => {
var _config$analytics, _config$analytics$onT;
const newState = !isOpen;
setIsOpen(newState);
if (newState) {
var _config$onOpen;
(_config$onOpen = config.onOpen) === null || _config$onOpen === void 0 ? void 0 : _config$onOpen.call(config, inputMethod);
} else {
var _config$onClose;
(_config$onClose = config.onClose) === null || _config$onClose === void 0 ? void 0 : _config$onClose.call(config);
}
(_config$analytics = config.analytics) === null || _config$analytics === void 0 ? void 0 : (_config$analytics$onT = _config$analytics.onToggle) === null || _config$analytics$onT === void 0 ? void 0 : _config$analytics$onT.call(_config$analytics, newState, inputMethod);
}, [isOpen, config]);
const close = useCallback(() => {
var _config$onClose2, _config$analytics2, _config$analytics2$on;
setIsOpen(false);
(_config$onClose2 = config.onClose) === null || _config$onClose2 === void 0 ? void 0 : _config$onClose2.call(config);
(_config$analytics2 = config.analytics) === null || _config$analytics2 === void 0 ? void 0 : (_config$analytics2$on = _config$analytics2.onToggle) === null || _config$analytics2$on === void 0 ? void 0 : _config$analytics2$on.call(_config$analytics2, false);
}, [config]);
const handleEscapeKeydown = useCallback(() => {
var _config$focusTarget, _config$focusTarget$c;
close();
(_config$focusTarget = config.focusTarget) === null || _config$focusTarget === void 0 ? void 0 : (_config$focusTarget$c = _config$focusTarget.current) === null || _config$focusTarget$c === void 0 ? void 0 : _config$focusTarget$c.focus();
}, [close, config.focusTarget]);
const handleClickOutside = useCallback(e => {
if (e.target instanceof HTMLElement && !isDetachedElement(e.target)) {
close();
}
}, [close]);
const handleKeyboardOpen = useCallback(event => {
if (event.key === 'Enter' || event.key === ' ') {
setIsOpenedByKeyboard(true);
event.preventDefault();
}
}, []);
return {
isOpen,
isOpenedByKeyboard,
toggle,
close,
handleEscapeKeydown,
handleClickOutside,
handleKeyboardOpen
};
};