@atlaskit/editor-plugin-hyperlink
Version:
Hyperlink plugin for @atlaskit/editor-core
48 lines (47 loc) • 1.75 kB
JavaScript
import React from 'react';
import { render } from 'react-dom';
import { createRoot } from 'react-dom/client';
import { IntlProvider } from 'react-intl';
import { LinkAction, OverlayButton } from '@atlaskit/editor-common/link';
import { fg } from '@atlaskit/platform-feature-flags';
var reactRoots = new WeakMap();
/** Mounts `element` into `mountPoint`: uses the React 18/19 `createRoot` API when `nike_r19_render_unmount` is on, else the legacy render path. */
var renderToMountPoint = function renderToMountPoint(element, mountPoint) {
if (fg('nike_r19_render_unmount')) {
var root = reactRoots.get(mountPoint);
if (!root) {
root = createRoot(mountPoint);
reactRoots.set(mountPoint, root);
}
root.render(element);
} else {
render(element, mountPoint);
}
};
export var ButtonWrapper = function ButtonWrapper(_ref) {
var editorView = _ref.editorView,
pos = _ref.pos,
stateKey = _ref.stateKey,
intl = _ref.intl,
onOpenLinkClick = _ref.onOpenLinkClick;
var wrapper = document.createElement('span');
wrapper.style.position = 'relative';
var nonBreakingCharacter = "\u2060";
var onDropdownChange = function onDropdownChange(isOpen) {
editorView.dispatch(editorView.state.tr.setMeta(stateKey, {
type: LinkAction.SET_CONFIGURE_DROPDOWN_OPEN,
isOpen: isOpen
}));
};
renderToMountPoint( /*#__PURE__*/React.createElement(IntlProvider, {
locale: intl.locale || 'en',
messages: intl.messages,
formats: intl.formats
}, /*#__PURE__*/React.createElement(OverlayButton, {
targetElementPos: pos,
editorView: editorView,
onDropdownChange: onDropdownChange,
onOpenLinkClick: onOpenLinkClick
}), nonBreakingCharacter), wrapper);
return wrapper;
};