How to use the @patternfly/react-styles/css/components/ContextSelector/context-selector.modifiers function in @patternfly/react-styles

isHovered,
      onToggle,
      onEnter,
      parentRef,
      id,
      ...props
    } = this.props;
    return (
      <button type="button" id="{id}"> onToggle(event, !isOpen)}
        aria-expanded={isOpen}
        onKeyDown={this.onKeyDown}
      &gt;
        <span>{toggleText}</span>
        
      </button>
    );
  }
}

{({ onSelect }) => (
          <li role="none">
            <button> {
                if (!isDisabled) {
                  onClick(event);
                  onSelect(event, children);
                }
              }}
              {...props}
            &gt;
              {children}
            </button>
          </li>
        )}

className,
      isOpen,
      onToggle,
      onSelect,
      screenReaderLabel,
      toggleText,
      searchButtonAriaLabel,
      searchInputValue,
      onSearchInputChange,
      searchInputPlaceholder,
      onSearchButtonClick,
      ...props
    } = this.props;
    return (
      <div>
        {screenReaderLabel &amp;&amp; (
          <span hidden="" id="{screenReaderLabelId}">
            {screenReaderLabel}
          </span>
        )}
        </div>

{({ onSelect }) => (
          <li role="none">
            <button> {
                if (!isDisabled) {
                  onClick(event);
                  onSelect(event, children);
                }
              }}
              {...props}
            &gt;
              {children}
            </button>
          </li>
        )}

isActive,
      isHovered,
      onToggle,
      onEnter,
      parentRef,
      id,
      ...props
    } = this.props;
    return (
      <button type="button" id="{id}"> onToggle(event, !isOpen)}
        aria-expanded={isOpen}
        onKeyDown={this.onKeyDown}
      &gt;
        <span>{toggleText}</span>
        
      </button>
    );
  }
}