Better JSX/TSX component typing/DX

[ElYaiko]

When working with TSX components (defineComponent) the DX is a bit poor/complex, I suggest the next features for a better DX and TS typing.

1. Props:
   Is not possible to use compiler utils like defineProps and the generics param (Props) is not considered, is mandatory to use the props field which is not very good to work with TS because requires JS objects (String/Number...) when is preferable to use plain TS types in a TSX component. (Maybe the field props can be let/mandatory when working only with JSX)

2. Emits
   I tried defining the emits in the second generic param (Emits) and it works. (But like the props, the emits field can be let/mandatory when working only with JSX)

3. Slots
   The slots types can be defined in the slots fields (which could be let/mandatory only for JSX) or in the 5th generic param but they are not considered when passing the slots object in the component contents (There's no a way JSX knows what should be passed inside the block element), so since JSX can't read this types it is preferible to have an attribute/field "$slots/slots" for defining this object with slots, so the types can be considered, ex:

return (
  <MyComponent $slots={{
    header: (param1) => <span>Hello {param1}</span>,
    default: () => ...
  }}/>
)

---

Edit: In summary is to not having to define with JS this obvious typings that can be done better with TS and just having to return straigth the component logic and blocks all typed by TS.

---

Using generics in the function defineComponent could be a good way to define this types, but instead comma separed an object could be better:

export default defineComponent<{
  props?: ...,
  emits?: ...,
  slots?: ...
}>(...);

Also, I suggest a better documentation when working with TSX, for example I had no idea about the type SlotsType for defining the slots types.

I hope a better support for JSX/TSX is done, thanks and please let me know what you think?
@vuejs