react/jsx-sort-default-props

Require the keys of defaultProps to be sorted alphabetically

deprecated

In a long defaultProps object, a fixed order makes a prop quick to find and makes a duplicate stand out.

This is the old name for react/sort-default-props, which does the same thing. Use that name in new configs.

Capital letters sort before lowercase ones. After a spread, sorting starts over.

eslint-plugin-react has deprecated this rule. Use react/sort-default-props instead.

Examples#

example.jsx1 problem
function Button({ label, size }) {
  return <button className={size}>{label}</button>;
}

Button.defaultProps = {
  size: "medium",
  label: "OK",
};
example.jsxNo problems
function Button({ label, size }) {
  return <button className={size}>{label}</button>;
}

Button.defaultProps = {
  label: "OK",
  size: "medium",
};
example.jsxNo problems
class Button extends React.Component {
  static defaultProps = {
    size: "medium",
    ...shared,
    label: "OK",
  };
}

Options#

OptionDefaultWhat it does
ignoreCasefalseIgnore case when comparing the keys.
example.jsx1 problem
Button.defaultProps = {
  ariaLabel: "",
  Icon: null,
};
example.jsxwith { "ignoreCase": true }No problems
Button.defaultProps = {
  ariaLabel: "",
  Icon: null,
};