File ReactTags.test.tsx has 1213 lines of code (exceeds 250 allowed). Consider refactoring.

Open

import React from 'react';
import { expect } from 'chai';
import { spy, stub, createSandbox } from 'sinon';

import { WithContext as ReactTags } from '../src/index';

Function ReactTags has 463 lines of code (exceeds 25 allowed). Consider refactoring.

Open

const ReactTags = (props: ReactTagsProps) => {
  const {
    autofocus,
    autoFocus,
    readOnly,

Function ReactTags has a Cognitive Complexity of 91 (exceeds 5 allowed). Consider refactoring.

Open

const ReactTags = (props: ReactTagsProps) => {
  const {
    autofocus,
    autoFocus,
    readOnly,

• Read up
  Read up

File ReactTags.tsx has 502 lines of code (exceeds 250 allowed). Consider refactoring.

Open

import React, { useEffect, createRef, useRef, useState, Fragment } from 'react';
import uniq from 'lodash/uniq';
import ClearAllTags from './ClearAllTags';
import Suggestions from './Suggestions';
import ClassNames from 'classnames';

Function ReactTagsWrapper has 86 lines of code (exceeds 25 allowed). Consider refactoring.

Open

const ReactTagsWrapper = (props: ReactTagsWrapperProps) => {
  const {
    placeholder = DEFAULT_PLACEHOLDER,
    labelField = DEFAULT_LABEL_FIELD,
    suggestions = [],

Function SuggestionsComp has 71 lines of code (exceeds 25 allowed). Consider refactoring.

Open

const SuggestionsComp = (props: SuggestionsProps) => {
  const suggestionsContainerRef = createRef<HTMLDivElement>();
  const {
    labelField,
    minQueryLength,

Function SingleTag has 56 lines of code (exceeds 25 allowed). Consider refactoring.

Open

const SingleTag = (props: TagProps) => {
  const tagRef = useRef(null);
  const {
    readOnly = false,
    tag,

Function App has 55 lines of code (exceeds 25 allowed). Consider refactoring.

Open

const App = () => {
  const [tags, setTags] = React.useState<Array<Tag>>([
    { id: 'Thailand', text: 'Thailand', className: '' },
    { id: 'India', text: 'India', className: '' },
    { id: 'Vietnam', text: 'Vietnam', className: '' },

Function handleKeyDown has 50 lines of code (exceeds 25 allowed). Consider refactoring.

Open

  const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {
    // hide suggestions menu on escape
    if (event.key === 'Escape') {
      event.preventDefault();
      event.stopPropagation();

Function RemoveComponent has 47 lines of code (exceeds 25 allowed). Consider refactoring.

Open

const RemoveComponent = (props: RemoveComponentProps) => {
  const { readOnly, removeComponent, onRemove, className, tag, index } = props;

  const onKeydown = (event: React.KeyboardEvent<HTMLButtonElement>) => {
    if (KEYS.ENTER.includes(event.keyCode) || event.keyCode === KEYS.SPACE) {

Function getTagItems has 45 lines of code (exceeds 25 allowed). Consider refactoring.

Open

  const getTagItems = () => {
    const allClassNames = { ...DEFAULT_CLASSNAMES, ...props.classNames };

    return tags.map((tag, index) => {
      return (

Function handlePaste has 36 lines of code (exceeds 25 allowed). Consider refactoring.

Open

  const handlePaste = (event: React.ClipboardEvent<HTMLInputElement>) => {
    if (!allowAdditionFromPaste) {
      return;
    }

Function addTag has 35 lines of code (exceeds 25 allowed). Consider refactoring.

Open

  const addTag = (tag: Tag) => {
    if (!tag.id || !tag[labelField]) {
      return;
    }

Function GitHubCorner has 33 lines of code (exceeds 25 allowed). Consider refactoring.

Open

const GitHubCorner = () => {
  return (
    <>
      <a
        href="https://github.com/react-tags/react-tags"

Function RemoveComponent has a Cognitive Complexity of 7 (exceeds 5 allowed). Consider refactoring.

Open

const RemoveComponent = (props: RemoveComponentProps) => {
  const { readOnly, removeComponent, onRemove, className, tag, index } = props;

  const onKeydown = (event: React.KeyboardEvent<HTMLButtonElement>) => {
    if (KEYS.ENTER.includes(event.keyCode) || event.keyCode === KEYS.SPACE) {

• Read up
  Read up

Function SuggestionsComp has a Cognitive Complexity of 6 (exceeds 5 allowed). Consider refactoring.

Open

const SuggestionsComp = (props: SuggestionsProps) => {
  const suggestionsContainerRef = createRef<HTMLDivElement>();
  const {
    labelField,
    minQueryLength,

• Read up
  Read up