erikras/audiocard

⏯️ AudioCard - Opinionated, responsive, audio player compatible with Twitter Cards

audiocard's Issues

Missing styles-component

Latest release is giving error of 'missing styles-component' package. I installed it using yarn.
So I added missing dependency separately to get it worked.
Please address this issue in next release.

Thanks

NaN error

I'm getting two errors on the pages where I have an AudioCard. It doesn't seem to actually break anything. But it's definitely better for things not to error.

I think the cause could be that on the first render, maybe useDimensions isn't returning the width/height yet.

react_devtools_backend.js:6 Warning: NaN is an invalid value for the height css style property.
in img (created by styled.img)
in styled.img (created by AudioCard)
in div (created by styled.div)
in styled.div (created by AudioCard)

react_devtools_backend.js:6 Warning: Received NaN for the size attribute. If this is expected, cast the value to a string.
in input (created by styled.input)
in styled.input (created by ProgressBar)
in div (created by styled.div)
in styled.div (created by ProgressBar)
in ProgressBar (created by AudioCard)
in div (created by styled.div)
in styled.div (created by AudioCard)
in div (created by styled.div)
in styled.div (created by AudioCard)

In case it's helpful, I'm using the following props:

      <AudioCard
        art={activeEpisode.image}
        key={activeEpisode.uid}
        link={`${prefix}/episodes/${activeEpisode.uid}`}
        linkText="Show Notes"
        skipBackSeconds={10}
        skipForwardSeconds={30}
        source={activeEpisode.audio}
        title={`EP${activeEpisode.number} ${activeEpisode.title}`}
      />

Update for React 17?

If you're still updating this I'd use an update for this peer dep. I'm happy to spin it up if you'll take the PR

💡 Idea: Use Howler.js?

Howler looks pretty badass. Abstracts away a lot of the cumbersome <audio> crap.