New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

InputGroupAddon Broken #766

Closed
HamadaBrest opened this Issue Jan 4, 2018 · 7 comments

Comments

Projects
7 participants
@HamadaBrest

HamadaBrest commented Jan 4, 2018

Issue description

  • components: InputGroupAddon
  • reactstrap version 5.0.0-alpha.3
  • bootstrap version 4.0.0-beta.2

What is happening?

InputGroupAddon Are broken even in your website

@TheSharpieOne

This comment has been minimized.

Show comment
Hide comment
@TheSharpieOne

TheSharpieOne Jan 4, 2018

Member

They are working, but the docs are currently in flux. When a PR is merged to master, the docs automatically build. Since #758 has been merge, the docs are using bootstrap version 4.0.0-beta.3 which changed the way InputGroupAddons work. There is a PR (#762) which fixes the lib and the docs. I just merged the PR so the docs should reflex the fix soon, but the code will need to be released in order for you to use it.
For now, just clone the version you are using and run the docs locally.
#195 would help with the confusion.

Member

TheSharpieOne commented Jan 4, 2018

They are working, but the docs are currently in flux. When a PR is merged to master, the docs automatically build. Since #758 has been merge, the docs are using bootstrap version 4.0.0-beta.3 which changed the way InputGroupAddons work. There is a PR (#762) which fixes the lib and the docs. I just merged the PR so the docs should reflex the fix soon, but the code will need to be released in order for you to use it.
For now, just clone the version you are using and run the docs locally.
#195 would help with the confusion.

@kellymears

This comment has been minimized.

Show comment
Hide comment
@kellymears

kellymears Jan 5, 2018

I was having the same problem before finding this helpful Issue.

I'm really early on in development of my project, so I updated Bootstrap to version 4.0.0-beta.3 and reactstrap to 5.0.0-alpha.4 but I'm still seeing style issues with InputGroupAddon's addonType="prepend". If I code it normally as described in the Bootstrap docs with icky old-fashioned div elements the behavior is as expected.

I make a lot of errors nearly every day so who knows if I'm just doing something dumb, but I figured I'd flag it in the unlikely event it isn't something on my end. Everything else I've tried works perfectly. Thank you.

kellymears commented Jan 5, 2018

I was having the same problem before finding this helpful Issue.

I'm really early on in development of my project, so I updated Bootstrap to version 4.0.0-beta.3 and reactstrap to 5.0.0-alpha.4 but I'm still seeing style issues with InputGroupAddon's addonType="prepend". If I code it normally as described in the Bootstrap docs with icky old-fashioned div elements the behavior is as expected.

I make a lot of errors nearly every day so who knows if I'm just doing something dumb, but I figured I'd flag it in the unlikely event it isn't something on my end. Everything else I've tried works perfectly. Thank you.

@mikdatdogru

This comment has been minimized.

Show comment
Hide comment
@mikdatdogru

mikdatdogru commented Jan 6, 2018

@xuv

This comment has been minimized.

Show comment
Hide comment
@xuv

xuv Jan 9, 2018

I still have this issue with:

  • reactstrap version 5.0.0-alpha.4
  • bootstrap version 4.0.0-beta.3

using <InputGroupAddon addonType="prepend">$</InputGroupAddon> for example, shows this is the console:
Warning: React does not recognize theaddonTypeprop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercaseaddontypeinstead. If you accidentally passed it from a parent component, remove it from the DOM element.

xuv commented Jan 9, 2018

I still have this issue with:

  • reactstrap version 5.0.0-alpha.4
  • bootstrap version 4.0.0-beta.3

using <InputGroupAddon addonType="prepend">$</InputGroupAddon> for example, shows this is the console:
Warning: React does not recognize theaddonTypeprop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercaseaddontypeinstead. If you accidentally passed it from a parent component, remove it from the DOM element.

@supergibbs

This comment has been minimized.

Show comment
Hide comment
@supergibbs

supergibbs Jan 9, 2018

Collaborator

reactstrap 5.0.0-alpha.4 is pretty old and is best compatible with bootstrap 4.0-beta. The master branch has quite a few commits to get it working with beta.2 and beta.3 but those aren't released yet.

Personally I use BS 4.0-beta.2 with reactstrap 5.0.0-alpha.4 and manually fix the few things that break for me. All depends on what components you use. Check http://getbootstrap.com/docs/4.0/migration/ for beta.2/3 breaking changes.

Collaborator

supergibbs commented Jan 9, 2018

reactstrap 5.0.0-alpha.4 is pretty old and is best compatible with bootstrap 4.0-beta. The master branch has quite a few commits to get it working with beta.2 and beta.3 but those aren't released yet.

Personally I use BS 4.0-beta.2 with reactstrap 5.0.0-alpha.4 and manually fix the few things that break for me. All depends on what components you use. Check http://getbootstrap.com/docs/4.0/migration/ for beta.2/3 breaking changes.

@xuv

This comment has been minimized.

Show comment
Hide comment
@xuv

xuv Jan 10, 2018

@supergibbs: ok, thx for the tips.

xuv commented Jan 10, 2018

@supergibbs: ok, thx for the tips.

@kirkins

This comment has been minimized.

Show comment
Hide comment
@kirkins

kirkins Jan 30, 2018

Having a similar issue with <InputGroupAddon addonType="append"> not rendering as expected.

Anyone know how I can update to the fixed version? I tried npm update reactstrap but the version didn't change.

react

kirkins commented Jan 30, 2018

Having a similar issue with <InputGroupAddon addonType="append"> not rendering as expected.

Anyone know how I can update to the fixed version? I tried npm update reactstrap but the version didn't change.

react

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment