@atlaskit/editor-plugin-mentions
Version:
Mentions plugin for @atlaskit/editor-core
109 lines (106 loc) • 4.13 kB
JavaScript
/* index.tsx generated by @compiled/babel-plugin v0.39.1 */
import _extends from "@babel/runtime/helpers/extends";
import "./index.compiled.css";
import { ax, ix } from "@compiled/react/runtime";
import React, { useCallback, useEffect } from 'react';
import { FormattedMessage, injectIntl } from 'react-intl';
import { mentionMessages as messages } from '@atlaskit/editor-common/messages';
import AddIcon from '@atlaskit/icon/core/add';
var mentionItemStyle = null;
var mentionItemSelectedStyle = null;
var rowStyle = null;
var avatarStyle = null;
var nameSectionStyle = null;
var capitalizedStyle = null;
export var INVITE_ITEM_DESCRIPTION = {
id: 'invite-teammate'
};
// Ignored via go/ees005
// eslint-disable-next-line @typescript-eslint/no-explicit-any
var leftClick = function leftClick(event) {
return event.button === 0 && !event.altKey && !event.ctrlKey && !event.metaKey && !event.shiftKey;
};
var InviteItem = function InviteItem(_ref) {
var productName = _ref.productName,
onMount = _ref.onMount,
onMouseEnter = _ref.onMouseEnter,
onSelection = _ref.onSelection,
selected = _ref.selected,
userRole = _ref.userRole,
intl = _ref.intl;
var onSelected = useCallback(
// Ignored via go/ees005
// eslint-disable-next-line @typescript-eslint/no-explicit-any
function (event) {
if (onSelection) {
// For mouse events, only handle left click
if ('button' in event && !leftClick(event)) {
return;
}
// For keyboard events, only handle Enter and Space
if ('key' in event && event.key !== 'Enter' && event.key !== ' ') {
return;
}
event.preventDefault();
onSelection(INVITE_ITEM_DESCRIPTION, event);
}
}, [onSelection]);
var onItemMouseEnter = useCallback(
// Ignored via go/ees005
// eslint-disable-next-line @typescript-eslint/no-explicit-any
function (event) {
if (onMouseEnter) {
onMouseEnter(INVITE_ITEM_DESCRIPTION, event);
}
}, [onMouseEnter]);
var onItemFocus = useCallback(
// Ignored via go/ees005
// eslint-disable-next-line @typescript-eslint/no-explicit-any
function (event) {
if (onMouseEnter) {
onMouseEnter(INVITE_ITEM_DESCRIPTION, event);
}
}, [onMouseEnter]);
useEffect(function () {
if (onMount) {
onMount();
}
}, [onMount]);
return /*#__PURE__*/React.createElement("div", {
role: "button",
tabIndex: 0
// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
,
onMouseDown: onSelected,
onKeyDown: onSelected,
onMouseEnter: onItemMouseEnter,
onFocus: onItemFocus,
"data-id": INVITE_ITEM_DESCRIPTION.id,
className: ax(["_1reo15vq _18m915vq _bfhk1j28 _1e0c1ule _2mzuglyw _80omtlke", selected && "_bfhk1dpa"])
}, /*#__PURE__*/React.createElement("div", {
className: ax(["_1reo15vq _18m915vq _4cvr1h6o _1e0c1txw _2lx2vrvc _1n261g80 _ca0q12x7 _n3td12x7 _19bvdlk8 _u5f3dlk8 _1bto1l2s _s7n4nkob"])
}, /*#__PURE__*/React.createElement("span", {
className: ax(["_16jlidpf _1o9zkb7n _i0dl1wug _1e0c1txw _4cvr1h6o _1bah1h6o _kqswh2mm _1bsb14no _4t3i14no"])
}, /*#__PURE__*/React.createElement(AddIcon, {
label: intl.formatMessage(messages.mentionsAddLabel),
color: "var(--ds-icon-subtle, #505258)"
})), /*#__PURE__*/React.createElement("div", {
"data-testid": "name-section",
className: ax(["_16jlkb7n _1o9zkb7n _i0dlf1ug _1ul9idpf _18u0dlk8 _syazazsu"])
}, /*#__PURE__*/React.createElement(FormattedMessage
// Ignored via go/ees005
// eslint-disable-next-line react/jsx-props-no-spreading
, _extends({}, messages.inviteItemTitle, {
// eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
values: {
userRole: userRole || 'basic',
productName: /*#__PURE__*/React.createElement("span", {
"data-testid": "capitalized-message",
className: ax(["_1p1d1dk0"])
}, productName)
}
})))));
};
// eslint-disable-next-line @typescript-eslint/ban-types
var _default_1 = injectIntl(InviteItem);
export default _default_1;