Failed prop type: Invalid prop `progressBar` supplied to `Rheostat`

I get this warning messages in console when using rheostat Warning: Failed prop type: Invalid prop progressBar supplied to Rheostat. Warning: Failed prop type: Invalid prop progressBar supplied to withStyles(Rheostat).

Can somebody explain me why I receive this warnings ?

I’m using a custom progressBar element and I had to use register a custom theme in order to have rheostat and react-calendar to work together

ThemedStyleSheet.registerTheme({
  rheostat: {
    ...RheostatDefaultTheme.rheostat,
    color: {
      ...RheostatDefaultTheme.rheostat.color,
      progressBar: 'red',
    },
  },
  reactDates: {
    ...ReactDatesDefaultTheme.reactDates,
  },
});

[jchapelle]

Thanks a lot, by defining my component like below, I have no more warnings.

const SliderHandleStyledComponent = styled.div`
    left: 0%;
    margin-left: -15px;
    position: absolute;
    width: 32px !important;
    height: 32px !important;
    border-width: 1px !important;
    border-style: solid !important;
    border-color: #008489 !important;
    background-color: #ffffff !important;
    border-radius: 32px !important;
    outline: none !important;
    z-index: 2 !important;
    box-shadow: 0 2px 2px rgba(72, 72, 72, 0.3) !important;
    top: -15px !important;
    &:hover{
      cursor: pointer;
    }
}
`;

const SliderHandle = ({ className, children }) => (
  <SliderHandleStyledComponent className={className}>
    {children}
  </SliderHandleStyledComponent>
);

[jchapelle]

Well it’s strange because the (left) position is set by the “style” props but for a reason I don’t know, the function is not receiving the updated “style” props on drag and drop event

On Wed, Jan 23, 2019 at 6:06 PM Jordan Harband [e-mail] wrote:

Your handle isn’t using all the props it’s getting.

I’d recommend starting with the default handle, get everything working, and worry about styling it later.

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/airbnb/rheostat/issues/208#issuecomment-456884743, or mute the thread https://github.com/notifications/unsubscribe-auth/AF4GXQJYeMO9hp8vY86lxcL65goyB11Pks5vGJaTgaJpZM4aM0Ol .

– Jean Chapelle