@atlaskit/editor-plugin-card
Version:
Card plugin for @atlaskit/editor-core
76 lines (73 loc) • 2.87 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _react = require("react");
var _react2 = require("@emotion/react");
var _link = require("@atlaskit/editor-common/link");
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
/**
* @jsxRuntime classic
* @jsx jsx
*/
// 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
var ConfigureOverlayWrapperStyles = (0, _react2.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 = (0, _react.useState)(false),
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
showConfigureButton = _useState2[0],
setShowConfigureButton = _useState2[1];
var _useState3 = (0, _react.useState)(false),
_useState4 = (0, _slicedToArray2.default)(_useState3, 2),
dropdownOpen = _useState4[0],
setDropdownOpen = _useState4[1];
var onDropdownChange = (0, _react.useCallback)(function (isOpen) {
setDropdownOpen(isOpen);
if (!isOpen) {
setShowConfigureButton(false);
}
}, []);
return (0, _react2.jsx)("span", {
onMouseEnter: function onMouseEnter() {
setShowConfigureButton(true);
hoverCallback(true);
},
onMouseLeave: function onMouseLeave() {
if (!dropdownOpen) {
setShowConfigureButton(false);
hoverCallback(false);
}
},
onFocus: (0, _expValEquals.expValEquals)('platform_editor_a11y_eslint_fix', 'isEnabled', true) ? function () {
setShowConfigureButton(true);
hoverCallback(true);
} : undefined,
onBlur: (0, _expValEquals.expValEquals)('platform_editor_a11y_eslint_fix', 'isEnabled', true) ? function () {
if (!dropdownOpen) {
setShowConfigureButton(false);
hoverCallback(false);
}
} : undefined,
"data-testid": "inline-card-overlay-wrapper"
}, (0, _react2.jsx)("span", {
css: ConfigureOverlayWrapperStyles
}, showConfigureButton && (0, _react2.jsx)(_link.OverlayButton, {
editorView: view,
targetElementPos: targetElementPos,
onDropdownChange: onDropdownChange,
onOpenLinkClick: onOpenLinkClick
})), children);
};
var _default = exports.default = OverlayWrapper;