Do not use h* in Card*#defaultProps#tag?

[eckdanny-osi]

The Card*defaultProp#tag has been in place from the start since #44 (updated in #794) but I don't think reactstrap should conflate these any more.

1. HTML heading elements (<h1>-<h6>) are for document structure
2. BS4 card-* classes (card-title, .card-subtitle, ...) are for applying presentational style (ref BS4 docs) and do not suppose heading levels

Rationale:

My project uses lots of Cards with CardTitles but most do not have any structural meaning in the HTML document (and if they did, they wouldn't be semantic h5s). So I pass a tag prop in every one of my CardTitles 😢.

Resolution? Maybe of the following:

1. Do not suppose structure. Use a generic container (div) by default instead of a heading element

2. Provide an API to map defaultTags to components á la utils#[setGlobal/mapTo]CssModule or context or something

I can easily imagine projects where Cards are highly correlated to document structure, in which case CardTitle/CardSubtitle defaultTags of h<N> would be really helpful. But even then, I'd want to be able to set the h* levels b/c its probably not h5/h6. @TheSharpieOne if you have an opinion here I'm happy to start working on a PR

[eckdanny-osi]

Leaning towards option 1. CardHeader defaults to a div already, it'd be a tiny change, and shouldn't break people b/c they're both block-level elements.

[TheSharpieOne]

I agree. Option 1 sounds the best to me.
It would be a breaking change as the output would change. There is a feature/v7 branch for breaking changes. You can make a PR targeting that branch.

[eckdanny-osi]

as workaround for ^6.x, one can monkey patch defaultProps for now:

import { CardTitle } from 'reactstrap'
CardTitle.defaultProps.tag = 'div'

@TheSharpieOne close this?