bestguy / sveltestrap

Bootstrap 4 & 5 components for Svelte
https://sveltestrap.js.org
MIT License
1.3k stars 183 forks source link

CardHeader Prop types do not extend to native attributes #475

Open jaeming opened 2 years ago

jaeming commented 2 years ago

inc prop

The CardHeader component does not extend HTMLElementTagNameMap (neither 'div' nor 'h3') which causes native attributes to be identified as missing (see screenshot above).

export interface ICardHeaderProps {
  id?: string;
  tag?: 'div' | 'h3';
}

One solution might be to add:

export interface ICardHeaderProps extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap['div']> | svelte.JSX.HTMLAttributes<HTMLElementTagNameMap['h3']> {...}

I am not too familiar with this library or the component implementations (also kind of new to Svelte) but I'd be happy to put in a PR if there was agreement on this solution. I checked the HTML w3 specs and I don't think that div and h3 have exclusive attributes when you take global attributes into consideration.

jaeming commented 2 years ago

I also see that no other component offers a tag property, which switches elements and question whether it's really necessary to offer the choice of h3 or div here. Personally, for my site, I needed an H4 for the card header and so an h3 seems kind of trivial. If s specific header is needed, can't we just pass that as child to the default slot?