React-select: [v2.0] react-select v2 Missing type annotation for U

[erksdee]

Hi, I'm getting the below error when running flow. Could someone please advise ?

Environment
OS: macOS High Seirra - Version 10.13.4
Node version: v9.6.1
NPM version: 5.7.1

[gwyneplaine]

Hi @erkan1991 which version of flow are you running?

[erksdee]

Hi @gwyneplaine, the flow version i'm running is ^0.2.3. However I have manage to get it passing locally with the below updated code block.

File: react-select/src/Select.js
Line number: 1172:14

if (isMulti) {
      const selectValues: Array<any> = selectValue.map(opt => {
      let isFocused = opt === focusedValue;
        return (
          <MultiValue
            {...commonProps}
            components={{
              Container: MultiValueContainer,
              Label: MultiValueLabel,
              Remove: MultiValueRemove,
            }}
            isFocused={isFocused}
            isDisabled={isDisabled}
            key={this.getOptionValue(opt)}
            removeProps={{
              onClick: () => this.removeValue(opt),
              onMouseDown: e => {
                e.preventDefault();
                e.stopPropagation();
              },
            }}
            data={opt}
          >
            {this.formatOptionLabel(opt, 'value')}
          </MultiValue>
        );
      });

      return selectValues;
    }

[SilencerWeb]

@erkan1991 but the current flow version is 0.74, try to upgrade flow and run it again

[himerus]

@SilencerWeb

I'm hitting the same issue (was about to create an issue but found this one) and I'm running the latest version of Flow.

$ flow
Error ┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈ node_modules/react-select/src/Select.js:1172:14

Missing type annotation for U.

     1169│     }
     1170│
     1171│     if (isMulti) {
     1172│       return selectValue.map(opt => {
     1173│         let isFocused = opt === focusedValue;
     1174│         return (
     1175│           <MultiValue
     1176│             {...commonProps}
     1177│             components={{
     1178│               Container: MultiValueContainer,
     1179│               Label: MultiValueLabel,
     1180│               Remove: MultiValueRemove,
     1181│             }}
     1182│             isFocused={isFocused}
     1183│             isDisabled={isDisabled}
     1184│             key={this.getOptionValue(opt)}
     1185│             removeProps={{
     1186│               onClick: () => this.removeValue(opt),
     1187│               onMouseDown: e => {
     1188│                 e.preventDefault();
     1189│                 e.stopPropagation();
     1190│               },
     1191│             }}
     1192│             data={opt}
     1193│           >
     1194│             {this.formatOptionLabel(opt, 'value')}
     1195│           </MultiValue>
     1196│         );
     1197│       });
     1198│     }
     1199│
     1200│     if (inputValue) {



Found 1 error
error Command failed with exit code 2.

It does appear the above typed solution works properly, and avoids the error in question. I'll fork and submit a PR for this change.

[DavidBabel]

@erkan1991 If you use a return at this point, i guess you are in a function.

The solution is to not let flow infer the return type, and specify it manually :

function yourFunction(array) : Array<any> {
  return array.map( ... );
}

Kind of the same solution you found, but without modifying your code.

[acro5piano]

Hi, I faced the same issue.
In my case, setting the function return type explicitly makes the error gone.

// Error

class Foo {
  id: number

  toParams {
    return {
      id: this.id
    }
  }
}

// No Error

class Foo {
  id: number

  toParams: Object {
    return {
      id: this.id
    }
  }
}

Hope this helps. Thanks

[mike1808]

Fixed in #2646

[bladey]

Hello -

In an effort to sustain the react-select project going forward, we're closing old issues.

We understand this might be inconvenient but in the best interest of supporting the broader community we have to direct our limited efforts to maintain the latest version.

If you aren't using the latest version of react-select please consider upgrading to see if it resolves any issues you're having.

However, if you feel this issue is still relevant and you'd like us to review it - please leave a comment and we'll do our best to get back to you!