How to use the @instructure/ui-prop-types.Children.enforceOrder function in @instructure/ui-prop-types

---
**/
@deprecated('7.0.0', null, 'Use @instructure/ui-modal instead')
@testable()
@themeable(theme, styles)
class Modal extends Component {
  static propTypes = {
    /**
     * An accessible label for the `` content
     */
    label: PropTypes.string.isRequired,

    /**
     * The children to be rendered within the ``
     */
    children: ChildrenPropTypes.enforceOrder(
      [ModalHeader, ModalBody, ModalFooter],
      [ModalHeader, ModalBody],
      [ModalBody, ModalFooter],
      [ModalBody]
    ),

    /*
     * The size of the `` content
     */
    size: PropTypes.oneOf(['auto', 'small', 'medium', 'large', 'fullscreen']),

    /**
    * Designates the background style of the ``
    */
    variant: PropTypes.oneOf(['default', 'inverse']),

category: components
---
**/
@testable()
@themeable(theme, styles)
class Modal extends Component {
  static propTypes = {
    /**
     * An accessible label for the `` content
     */
    label: PropTypes.string.isRequired,

    /**
     * The children to be rendered within the ``
     */
    children: ChildrenPropTypes.enforceOrder(
      [ModalHeader, ModalBody, ModalFooter],
      [ModalHeader, ModalBody],
      [ModalBody, ModalFooter],
      [ModalBody]
    ),

    /**
    * The element to render the dialog as, `span` by default
    */
    as: PropTypes.elementType,

    /*
     * The size of the `` content
     */
    size: PropTypes.oneOf(['auto', 'small', 'medium', 'large', 'fullscreen']),