How to use @seznam/compose-react-refs - 4 common examples

To help you get started, we’ve selected a few @seznam/compose-react-refs 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 / packages / multishift / src / multishift.ts View on Github external
isHTMLElement(document.activeElement) &&
            refs.comboBox.current &&
            refs.comboBox.current.contains(document.activeElement);
          if (!contextRef.current.isMouseDown && !multishiftActive) {
            actions.inputBlur();
          }
        });
      }),
    };

    if (rest.disabled) {
      eventHandlers = Object.create(null);
    }

    return {
      [refKey]: composeRefs(ref as Ref, refs.input),
      'aria-autocomplete': 'list',
      ...activeDescendant,
      'aria-controls': isOpen ? menuId : null,
      'aria-labelledby': labelId,
      // https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion
      // revert back since autocomplete="nope" is ignored on latest Chrome and Opera
      autoComplete: 'off',
      value: inputValue,
      id: inputId,
      ...eventHandlers,
      ...rest,
    } as any;
  };
github ifiokjr / remirror / packages / multishift / src / multishift.ts View on Github external
...refs.ignored.current,
              ].some(node => node && isOrContainsNode(node, document.activeElement)) &&
                document.activeElement !== blurTarget))
          ) {
            actions.menuBlur();
          }
        });
      }),
    };

    if (rest.disabled) {
      eventHandlers = Object.create(null);
    }

    return {
      [refKey]: composeRefs(ref as Ref, refs.menu),
      id: menuId,
      role: type === Type.ControlledMenu ? 'menu' : 'listbox',
      'aria-labelledby': labelId,
      tabIndex: -1,
      ...multi,
      ...activeDescendant,
      ...eventHandlers,
      ...rest,
    } as GetPropsWithRefReturn;
  };
github ifiokjr / remirror / packages / multishift / src / multishift.ts View on Github external
const getComboBoxProps = (
    { refKey = 'ref' as GRefKey, ref, ...rest }: GetComboBoxPropsOptions = {
      refKey: 'ref' as GRefKey,
    },
  ): GetComboBoxPropsReturn => {
    if (type !== Type.ComboBox) {
      throw new Error('`getComboBoxProps` is only available for the autocomplete dropdown');
    }

    const extra = isUndefined(rest['aria-label']) ? { 'aria-labelledby': labelId } : {};

    return {
      [refKey]: composeRefs(ref as Ref, refs.comboBox),
      role: 'combobox',
      'aria-expanded': isOpen,
      'aria-haspopup': 'listbox',
      'aria-owns': isOpen ? menuId : null,
      ...extra,
      ...rest,
    } as GetComboBoxPropsReturn;
  };
github ifiokjr / remirror / packages / multishift / src / multishift.ts View on Github external
}
        });
      }),
    };

    if (rest.disabled) {
      eventHandlers = Object.create(null);
    }

    const extra = type === Type.Select ? { 'aria-expanded': isOpen } : {};
    const ariaLabel = isUndefined(rest['aria-label'])
      ? { 'aria-labelledby': `${labelId} ${toggleButtonId}` }
      : {};

    return {
      [refKey]: composeRefs(ref as Ref, refs.toggleButton),
      type: 'button',
      role: 'button',
      id: toggleButtonId,
      'aria-haspopup': type === Type.ComboBox ? true : 'listbox',
      ...ariaLabel,
      ...extra,
      ...eventHandlers,
      ...rest,
    } as any;
  };

@seznam/compose-react-refs

A simple utility for composing two or more react refs into a single callback ref.

ISC
Latest version published 3 years ago

Package Health Score

56 / 100
Full package analysis

Popular @seznam/compose-react-refs functions