Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
export const EmojiSuggestions: FunctionComponent = ({
data,
highlightedIndex,
command,
}) => {
const { sxx } = useRemirrorTheme();
const { view, getPositionerProps } = useRemirrorContext();
const { getMenuProps, getItemProps, itemHighlightedAtIndex, hoveredIndex } = useMultishift({
highlightedIndexes: [highlightedIndex],
type: Type.ControlledMenu,
items: data,
isOpen: true,
});
const positionerProps = getPositionerProps({
...popupMenuPositioner,
positionerId: 'emojiPopupMenu',
refKey: 'ref',
});
const { top, left, ref } = positionerProps;
return (
const [dropdownPosition, setDropdownPosition] = useState(dropdownPositionProp);
const {
isOpen,
getToggleButtonProps,
getItemProps,
itemHighlightedAtIndex,
itemIsSelected,
getMenuProps,
getLabelProps,
selectedItems,
hoveredIndex,
} = useMultishift({
items,
multiple,
selectedItems: selectedItemsProp,
type: Type.Select,
onSelectedItemsChange: onSelect,
itemToString: item => item.label,
getItemId: item => item.id,
});
const { sx } = useRemirrorTheme();
const previous = usePrevious(isOpen);
const [bind, rect] = useMeasure();
const [{ height, opacity, transform }, setSpring] = useSpring(() => ({
height: 0,
opacity: 0,
transform: 'translate3d(20px,0,0)',
}));
const buttonRef = useRef(null);
useLayoutEffect(() => {