@atlaskit/editor-plugin-card
Version:
Card plugin for @atlaskit/editor-core
61 lines (60 loc) • 2.17 kB
JavaScript
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
/**
* @jsxRuntime classic
* @jsx jsx
*/
import { useCallback, useState } from 'react';
// not permitted to migrate atlaskit packages to compiled yet, see https://hello.atlassian.net/wiki/spaces/UAF/pages/3006969423/Migrating+AFM+platform+components+to+Compiled+a+guide
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
import { css, jsx } from '@emotion/react';
import { OverlayButton } from '@atlaskit/editor-common/link';
var ConfigureOverlayWrapperStyles = css({
position: 'relative',
left: "var(--ds-space-025, 2px)"
});
var OverlayWrapper = function OverlayWrapper(_ref) {
var view = _ref.view,
targetElementPos = _ref.targetElementPos,
children = _ref.children,
hoverCallback = _ref.isHoveredCallback,
onOpenLinkClick = _ref.onOpenLinkClick;
var _useState = useState(false),
_useState2 = _slicedToArray(_useState, 2),
showConfigureButton = _useState2[0],
setShowConfigureButton = _useState2[1];
var _useState3 = useState(false),
_useState4 = _slicedToArray(_useState3, 2),
dropdownOpen = _useState4[0],
setDropdownOpen = _useState4[1];
var onDropdownChange = useCallback(function (isOpen) {
setDropdownOpen(isOpen);
if (!isOpen) {
setShowConfigureButton(false);
}
}, []);
var showOverlay = useCallback(function () {
setShowConfigureButton(true);
hoverCallback(true);
}, [hoverCallback]);
var hideOverlay = useCallback(function () {
if (!dropdownOpen) {
setShowConfigureButton(false);
hoverCallback(false);
}
}, [dropdownOpen, hoverCallback]);
return jsx("span", {
onMouseEnter: showOverlay,
onMouseLeave: hideOverlay,
onFocus: showOverlay,
onBlur: hideOverlay,
"data-testid": "inline-card-overlay-wrapper"
}, jsx("span", {
css: ConfigureOverlayWrapperStyles
}, showConfigureButton && jsx(OverlayButton, {
editorView: view,
targetElementPos: targetElementPos,
onDropdownChange: onDropdownChange,
onOpenLinkClick: onOpenLinkClick
})), children);
};
export default OverlayWrapper;