# react/prefer-exact-props

> Require `propTypes` to be wrapped in a function that rejects unknown props

`propTypes` check the props they name and say nothing about the rest. A misspelled prop such as `onclick` is passed, ignored, and never noticed. A wrapper such as `exact()` from the `prop-types-exact` package adds a warning for every prop that isn't declared.

The rule does nothing until you name your wrapper. List it under `propWrapperFunctions` in your settings, with `exact` set to `true`:

```toml bunfig.toml
[lint.rules]
"react/prefer-exact-props" = "error"

[lint.settings]
propWrapperFunctions = [{ property = "exact", exact = true }]
```

In an ESLint config, the same list goes under `settings`.

{/* Generated by src/codegen/lint-rule-docs.ts. Do not edit this section. */}

## Configure

Off by default. To turn it on:

```toml bunfig.toml
[lint.rules]
"react/prefer-exact-props" = "error" # or "warn"
```

{/* End of the generated section. */}

## Examples

Reported, with `exact` listed as a wrapper:

{/* bad {"config": "oxlint", "settings": {"propWrapperFunctions": [{"property": "exact", "exact": true}]}} */}
```jsx
function Button({ label }) {
  return <button>{label}</button>;
}

Button.propTypes = {
  label: PropTypes.string,
};
```

{/* bad {"config": "oxlint", "settings": {"propWrapperFunctions": [{"property": "exact", "exact": true}]}} */}
```jsx
class Button extends React.Component {
  static propTypes = {
    label: PropTypes.string,
  };
  render() {
    return <button>{this.props.label}</button>;
  }
}
```

Not reported:

{/* good {"config": "oxlint", "settings": {"propWrapperFunctions": [{"property": "exact", "exact": true}]}} */}
```jsx
function Button({ label }) {
  return <button>{label}</button>;
}

Button.propTypes = exact({
  label: PropTypes.string,
});
```