@chayns-components/emoji-input
Version:
Input field that supports HTML elements and emojis
51 lines (50 loc) • 2.64 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _core = require("@chayns-components/core");
var _react = _interopRequireWildcard(require("react"));
var _EmojiPicker = _interopRequireDefault(require("../emoji-picker/EmojiPicker"));
var _EmojiPickerPopup = require("./EmojiPickerPopup.styles");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
const EmojiPickerPopup = ({
accessToken,
onPopupVisibilityChange,
onSelect,
personId
}) => {
const popupRef = (0, _react.useRef)(null);
const handleKeyPress = (0, _react.useCallback)(event => {
if (event.key === 'Escape' && !event.shiftKey) {
var _popupRef$current;
(_popupRef$current = popupRef.current) === null || _popupRef$current === void 0 || _popupRef$current.hide();
}
}, []);
(0, _react.useEffect)(() => {
document.addEventListener('keydown', handleKeyPress);
return () => {
document.addEventListener('keydown', handleKeyPress);
};
}, [handleKeyPress]);
return /*#__PURE__*/_react.default.createElement(_EmojiPickerPopup.StyledEmojiPickerPopup, null, /*#__PURE__*/_react.default.createElement(_core.Popup, {
ref: popupRef,
onHide: () => typeof onPopupVisibilityChange === 'function' ? onPopupVisibilityChange(false) : undefined,
onShow: () => typeof onPopupVisibilityChange === 'function' ? onPopupVisibilityChange(true) : undefined,
content: /*#__PURE__*/_react.default.createElement(_core.AreaProvider, {
shouldChangeColor: false
}, /*#__PURE__*/_react.default.createElement(_EmojiPicker.default, {
accessToken: accessToken,
onSelect: onSelect,
personId: personId
}))
}, /*#__PURE__*/_react.default.createElement(_core.Icon, {
className: "prevent-lose-focus",
icons: ['far fa-smile'],
size: 18
})));
};
EmojiPickerPopup.displayName = 'EmojiPickerPopup';
var _default = exports.default = EmojiPickerPopup;
//# sourceMappingURL=EmojiPickerPopup.js.map