TypeScript

Those Beyond Features which add directives, override the React type declarations to add the directive typing to the elements. For example:

declare module 'react' {
  interface Attributes {
    x-if?: boolean
  }
}

This ensures that TypeScript doesn't complain about the directive prop, and that you can Cmd/Ctrl + Click on the prop to go to the declaration.

But keep in mind, that this is a global override. Even though the runtime mechanics of Beyond Features is strictly scoped down to the component's subtree, TypeScript type declarations remain global.

ESLint

If you're using ESLint, there might be one more annoyance with the directives if the react/no-unknown-property rule is enabled (it is, by default). To get rid of this issue, you have to disable the rule:

rules:
  react/no-unknown-property: off