How to use the airbnb-prop-types.mutuallyExclusiveTrueProps function in airbnb-prop-types

import React from 'react';
import { mutuallyExclusiveTrueProps } from 'airbnb-prop-types';
import withStyles, { WithStylesProps } from '../../composers/withStyles';

// https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric
const fractionProp = mutuallyExclusiveTrueProps('diagonal', 'stacked');

// istanbul ignore next
function getNumericVariant(props: Partial): string {
  const variants: string[] = [];

  if (props.diagonal) {
    variants.push('diagonal-fractions');
  } else if (props.stacked) {
    variants.push('stacked-fractions');
  }

  if (props.ordinal) {
    variants.push('ordinal');
  }

  if (props.slashed) {

level === 3 && styles.title_level3,
        inline && styles.title_inline,
        inverted && styles.title_inverted,
        muted && styles.title_muted,
        primary && styles.title_primary,
        centerAlign && styles.title_center,
        endAlign && styles.title_right,
      )}
    >
      {children}
    
  );
}

const stateProp = mutuallyExclusiveTrueProps('muted', 'inverted', 'primary');
const alignProp = mutuallyExclusiveTrueProps('centerAlign', 'endAlign');

Title.propTypes = {
  centerAlign: alignProp,
  endAlign: alignProp,
  inverted: stateProp,
  muted: stateProp,
  primary: stateProp,
};

export default Title;

/**
   * The content of the layout.
   */
  children: PropTypes.node.isRequired,
  /**
   * @ignore
   */
  className: PropTypes.string,
  /**
   * It `true`, collapsed the sidebar by default.
   */
  defaultSidebarCollapsed: PropTypes.bool,
  /**
   * Displays fixed header and sidebar.
   */
  fixed: mutuallyExclusiveTrueProps('boxed', 'fixed'),
  /**
   * When collapsed, sidebar will show icons only.
   */
  miniSidebar: PropTypes.bool,
  /**
   * Callback fired when the sidebar is toggled.
   *
   * @param {object} event The event source of the callback
   * @param {boolean} collapsed The 'collapsed` state of the sidebar
   */
  onChange: PropTypes.func,
  /**
   * If `true`, collapses the sidebar. Setting this prop enables control of
   * the Layout.
   */
  sidebarCollapsed: PropTypes.bool,

import React from 'react';
import { mutuallyExclusiveTrueProps } from 'airbnb-prop-types';
import useStyles, { StyleSheet } from '../../hooks/useStyles';

const backgroundAlignPropType = mutuallyExclusiveTrueProps('alignBottom', 'alignTop');
const objectFitPropType = mutuallyExclusiveTrueProps('contain', 'cover');

const styleSheet: StyleSheet = ({ color, ui }) => ({
  background: {
    backgroundPosition: '50% 50%',
    backgroundRepeat: 'no-repeat',
  },

  backgroundSize_cover: {
    backgroundColor: color.accent.bgHover,
    backgroundSize: 'cover',
  },

  backgroundSize_contain: {
    backgroundColor: color.accent.bg,
    backgroundSize: 'contain',

micro && uppercased && styles.text_uppercased_micro,
        centerAlign && styles.text_center,
        endAlign && styles.text_end,
        startAlign && styles.text_start,
        noWrap && styles.text_noWrap,
      )}
    >
      {children}
    
  );
}

const sizingProp = mutuallyExclusiveTrueProps('micro', 'small', 'large');
const emphasisProp = mutuallyExclusiveTrueProps('bold', 'light');
const stateProp = mutuallyExclusiveTrueProps('disabled', 'muted', 'inverted');
const alignProp = mutuallyExclusiveTrueProps('centerAlign', 'endAlign', 'startAlign');

Text.propTypes = {
  bold: emphasisProp,
  centerAlign: alignProp,
  disabled: stateProp,
  endAlign: alignProp,
  inverted: stateProp,
  large: sizingProp,
  light: emphasisProp,
  micro: sizingProp,
  muted: stateProp,
  small: sizingProp,
  startAlign: alignProp,
};

export default Text;

import React from 'react';
import { mutuallyExclusiveTrueProps } from 'airbnb-prop-types';
import useStyles, { StyleSheet } from '../../hooks/useStyles';

const backgroundAlignPropType = mutuallyExclusiveTrueProps('alignBottom', 'alignTop');
const objectFitPropType = mutuallyExclusiveTrueProps('contain', 'cover');

const styleSheet: StyleSheet = ({ color, ui }) => ({
  background: {
    backgroundPosition: '50% 50%',
    backgroundRepeat: 'no-repeat',
  },

  backgroundSize_cover: {
    backgroundColor: color.accent.bgHover,
    backgroundSize: 'cover',
  },

  backgroundSize_contain: {
    backgroundColor: color.accent.bg,
    backgroundSize: 'contain',
  },

import React from 'react';
import { mutuallyExclusiveTrueProps } from 'airbnb-prop-types';
import withStyles, { WithStylesProps } from '../../composers/withStyles';
import ButtonOrLink, { Props as ButtonOrLinkProps } from '../private/ButtonOrLink';
import Loader from '../Loader';
import { styleSheet } from './styles';

const sizingProp = mutuallyExclusiveTrueProps('small', 'large');

export type Props = ButtonOrLinkProps & {
  /** Render as a block with full width. */
  block?: boolean;
  /** Render as borderless. */
  borderless?: boolean;
  /** @ignore Hidden prop used in forms. */
  invalid?: boolean;
  /** Invert text colors. */
  inverted?: boolean;
  /** Increase font size and padding to large. */
  large?: boolean;
  /** Decrease font size and padding to small. */
  small?: boolean;
};

import React from 'react';
import { mutuallyExclusiveTrueProps } from 'airbnb-prop-types';
import withStyles, { WithStylesProps } from '../../composers/withStyles';
import ButtonOrLink, { Props as ButtonOrLinkProps } from '../private/ButtonOrLink';
import Text from '../Text';
import { styleSheet } from './styles';

const sizingProp = mutuallyExclusiveTrueProps('micro', 'small', 'large');
const stateProp = mutuallyExclusiveTrueProps('disabled', 'muted', 'inverted');

export type Props = ButtonOrLinkProps & {
  /** Display element as block. */
  block?: boolean;
  /** Display element as inline. */
  baseline?: boolean;
  /** Invert text colors. */
  inverted?: boolean;
  /** Increase font size to large. */
  large?: boolean;
  /** Decrease font size to micro. */
  micro?: boolean;
  /** Mark the link as muted. */
  muted?: boolean;
  /** Decrease font size to small. */

className={cx(
          danger && styles.text_danger,
          info && styles.text_info,
          muted && styles.text_muted,
          notice && styles.text_notice,
          success && styles.text_success,
          warning && styles.text_warning,
        )}
      >
        {children}
      
    
  );
}

const statusPropType = mutuallyExclusiveTrueProps(...STATUSES);

StatusText.propTypes = {
  danger: statusPropType,
  info: statusPropType,
  muted: statusPropType,
  notice: statusPropType,
  success: statusPropType,
  warning: statusPropType,
};

export default StatusText;

small && styles.text_small,
        truncated && styles.text_truncated,
        uppercased && styles.text_uppercased,
        micro && uppercased && styles.text_uppercased_micro,
        centerAlign && styles.text_center,
        endAlign && styles.text_end,
        startAlign && styles.text_start,
        noWrap && styles.text_noWrap,
      )}
    >
      {children}
    
  );
}

const sizingProp = mutuallyExclusiveTrueProps('micro', 'small', 'large');
const emphasisProp = mutuallyExclusiveTrueProps('bold', 'light');
const stateProp = mutuallyExclusiveTrueProps('disabled', 'muted', 'inverted');
const alignProp = mutuallyExclusiveTrueProps('centerAlign', 'endAlign', 'startAlign');

Text.propTypes = {
  bold: emphasisProp,
  centerAlign: alignProp,
  disabled: stateProp,
  endAlign: alignProp,
  inverted: stateProp,
  large: sizingProp,
  light: emphasisProp,
  micro: sizingProp,
  muted: stateProp,
  small: sizingProp,
  startAlign: alignProp,