@atlaskit/editor-common
Version:
A package that contains common classes and components for editor and renderer
43 lines • 1.59 kB
JavaScript
import React, { useCallback } from 'react';
import { ToolbarUIProvider } from '@atlaskit/editor-toolbar';
export const EditorToolbarUIProvider = ({
children,
api,
isDisabled,
popupsMountPoint,
popupsBoundariesElement,
popupsScrollableElement,
fireAnalyticsEvent,
keyboardNavigation
}) => {
const onDropdownOpenChanged = useCallback(({
isOpen,
event
}) => {
if (!isOpen) {
// Only refocus the editor when the dropdown closes via mouse or programmatic close.
// When closed via keyboard Escape, keep focus on the trigger for better keyboard UX.
const isKeyboardEscape = event instanceof KeyboardEvent && event.key === 'Escape';
const shouldFocusEditor = !isKeyboardEscape;
if (shouldFocusEditor) {
// On Dropdown closed, focus is returned to trigger button by default in requestAnimationFrame
// Hence, `.focus()` should also be called in requestAnimationFrame
setTimeout(() => requestAnimationFrame(() => {
api === null || api === void 0 ? void 0 : api.core.actions.focus({
scrollIntoView: false
});
}), 1);
}
}
}, [api]);
return /*#__PURE__*/React.createElement(ToolbarUIProvider, {
onDropdownOpenChanged: onDropdownOpenChanged,
preventDefaultOnMouseDown: true,
isDisabled: isDisabled,
popupsMountPoint: popupsMountPoint,
popupsBoundariesElement: popupsBoundariesElement,
popupsScrollableElement: popupsScrollableElement,
fireAnalyticsEvent: fireAnalyticsEvent,
keyboardNavigation: keyboardNavigation
}, children);
};