How to use multishift - 2 common examples

To help you get started, we’ve selected a few multishift examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github ifiokjr / remirror / @remirror / editor-social / src / components / emoji-suggestion-component.tsx View on Github external
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 (
github ifiokjr / remirror / @remirror / ui-dropdown / src / dropdown.tsx View on Github external
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(() => {

multishift

A repurposed downshift for internal use within remirror

MIT
Latest version published 9 months ago

Package Health Score

82 / 100
Full package analysis

Similar packages