[TSX] deny unknown attributes by default

[wonderful-panda]

What problem does this feature solve?

Currently, unknown attributes are allowed in component tag.

For example, this code is valid.

const MyComponent = defineComponent({
  props: { msg: String },
  setup(props) {
    return () => <div>{props.msg}</div>;
  }
});

const ParentComponent = defineComponent({
  setup() {
    return () => <MyComponent msg="Hello" foo={1} />; // foo is not defined, but allowed.
  }
});

But this breaks type-safety (for example, TypeScript can't detect misspelling of optional prop name), and there is no way to disable this.

I think it would be nice if unknown attributes are denied by default, and some escape-hatches are provided.

What does the proposed API look like?

In TypeScript, deny unknown attributes by default.

And allow to pass unknown attributes via special attribute (something like attrs)

const ParentComponent = defineComponent({
  setup() {
    return () => <MyComponent msg="Hello" attrs={{ foo: 1 }} />; 
  }
});

And provide optional type definition like below. Unknown attributes are allowed again by importing this.

 declare module '@vue/runtime-core' {
    interface ComponentCustomOptions {
       [key: string]: any;
    }
}