File config.ts has 1271 lines of code (exceeds 250 allowed). Consider refactoring.

Open

export const options = [
  {
    label: "Alister Chilles",
    value: "achilleso",
    join_time: "1/7/2023"

File index.tsx has 494 lines of code (exceeds 250 allowed). Consider refactoring.

Open

import { ChangeEvent, Component, createRef, KeyboardEvent, MouseEvent, RefObject } from 'react';
import { css } from '@emotion/react';
import styled from '@emotion/styled';
import isEqual from '@gilbarbara/deep-equal';

Dropdown has 27 functions (exceeds 20 allowed). Consider refactoring.

Open

export class Dropdown extends Component<Props, State> {
  private readonly dropdownRef: RefObject<HTMLDivElement>;
  private readonly methods: Methods;

  static defaultProps = defaultProps;

Function componentDidUpdate has a Cognitive Complexity of 20 (exceeds 5 allowed). Consider refactoring.

Open

  componentDidUpdate(previousProps: Props, previousState: State) {
    const { search, status, values: stateValues } = this.state;
    const {
      closeOnSelect,
      comparatorFn = defaultProps.comparatorFn,

• Read up
  Read up

Function render has 62 lines of code (exceeds 25 allowed). Consider refactoring.

Open

  render() {
    const { status, values } = this.state;
    const {
      className,
      direction = 'ltr',

Function MenuItem has 61 lines of code (exceeds 25 allowed). Consider refactoring.

Open

export default function MenuItem(props: ItemComponentProps) {
  const {
    item,
    itemIndex,
    methods: { addItem, getLabels, getStyles, isSelected, removeItem },

Function Input has 54 lines of code (exceeds 25 allowed). Consider refactoring.

Open

export default function Input(props: ComponentProps) {
  const {
    methods: { createItem, getInputSize, getStyles, setSearch },
    props: { autoFocus, create, disabled, inputComponent, options, searchable },
    state: { cursor, search, status, values },

Function componentDidUpdate has 53 lines of code (exceeds 25 allowed). Consider refactoring.

Open

  componentDidUpdate(previousProps: Props, previousState: State) {
    const { search, status, values: stateValues } = this.state;
    const {
      closeOnSelect,
      comparatorFn = defaultProps.comparatorFn,

Function CustomStyles has 52 lines of code (exceeds 25 allowed). Consider refactoring.

Open

export default function CustomStyles() {
  const [isOpen, setOpen] = useState(false);
  const [values, setValues] = useState<Option[]>([options[0]]);

  const handleOnChange = (selectedValues: Option[]) => {

Function StyledMenuItem has 48 lines of code (exceeds 25 allowed). Consider refactoring.

Open

const StyledMenuItem = styled.div<Styles & Required<Pick<Props, 'disabled'>>>(props => {
  const {
    bgColor,
    color,
    disabled,

Function Content has 39 lines of code (exceeds 25 allowed). Consider refactoring.

Open

export default function Content(props: ComponentProps) {
  const {
    methods: { getStyles, setStatus },
    props: { contentComponent, multi, onClickSelector, searchable },
    state: { status, values },

Function Menu has 39 lines of code (exceeds 25 allowed). Consider refactoring.

Open

function Menu(props: ComponentProps) {
  const {
    methods: { getStyles },
    props: { menuComponent },
    state: { dropdownBounds, searchResults },

Function ReactDropdown has 37 lines of code (exceeds 25 allowed). Consider refactoring.

Open

)<Styles & Required<Pick<Props, 'direction' | 'disabled'>>>(props => {
  const { bgColor, borderColor, borderRadius, color, direction, disabled, minHeight, width } =
    props;

  return css`

Function MenuItem has a Cognitive Complexity of 12 (exceeds 5 allowed). Consider refactoring.

Open

export default function MenuItem(props: ItemComponentProps) {
  const {
    item,
    itemIndex,
    methods: { addItem, getLabels, getStyles, isSelected, removeItem },

• Read up
  Read up

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

Open

>(props => {
  const {
    bgColor,
    borderColor,
    borderRadius,

Function getCursor has 34 lines of code (exceeds 25 allowed). Consider refactoring.

Open

export function getCursor(cursor: number | null, type: 'down' | 'up', values: Option[] = []) {
  const total = values.length;
  const lastValidIndex = values.map(item => !!item.disabled).lastIndexOf(false);
  const disabled = values.reduce<number[]>((acc, value, index) => {
    if (value.disabled) {

Function getStyles has 34 lines of code (exceeds 25 allowed). Consider refactoring.

Open

export function getStyles(styles?: Partial<Styles>): Styles {
  const {
    bgColor = '#fff',
    borderColor = '#ccc',
    borderRadius = '4px',

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

Open

export default function Option(props: OptionComponentProps) {
  const {
    item,
    methods: { removeItem },
    props: {

Function constructor has 31 lines of code (exceeds 25 allowed). Consider refactoring.

Open

  constructor(props: Props) {
    super(props);

    this.state = {
      cursor: null,

Function Create has 29 lines of code (exceeds 25 allowed). Consider refactoring.

Open

export default function Create(props: ComponentProps): JSX.Element | null {
  const {
    methods: { createItem, getLabels, getStyles },
    props: { create, options },
    state: { cursor, search, values },