buildo / react-placeholder

A React component to easily replicate your page with nice placeholders while the content is loading
MIT License
1.61k stars 97 forks source link

[Typings] Can't assign Element to customPlaceholder #75

Closed patrykgulas closed 6 years ago

patrykgulas commented 6 years ago

When I try to pass Element to customPlaceholder prop it returns following type error:

Type 'element' is not assignable to type 'undefined'.

    const awesomePlaceholder = (
      <div>
        <RectShape color="blue" style={{width: 30, height: 80}}/>
        <TextBlock rows={7} color="yellow"/>
      </div>
    );

    return (
      <ReactPlaceholder
        type="rect"
        showLoadingAnimation={true}
        customPlaceholder={awesomePlaceholder}
        ready={!isLoading}
      >
    )

Also, type prop is required but we shouldn't pass it using customPlaceholder. Is it something to fix or I'm doing something wrong?

gabro commented 6 years ago

The error is a bit confusing, but essentially you need to skip type and showLoadingAnimation. Since you're passing a custom placeholder, those two props don't apply anymore.

This is specified as a union type in the props definitions.

Essentially this should typecheck fine:

<ReactPlaceholder
  customPlaceholder={awesomePlaceholder}
  ready={!isLoading}
/>

Closing the issue, as this should solve it, feel free to comment here if you have further problems and we can re-open it.