render()

in modules/monochrome/src/shared/toggle/index.js [128:165]


  render() {
    const {theme, className, style, value, label, isEnabled} = this.props;
    const {knobSize = theme.controlSize} = style;

    const styleProps = {
      theme,
      knobSize,
      value,
      isHovered: this.state.isHovered,
      hasFocus: this.state.hasFocus,
      isEnabled
    };

    return (
      <WrapperComponent
        className={className}
        onMouseEnter={this._onMouseEnter}
        onMouseLeave={this._onMouseLeave}
        onClick={this._onClick}
        userStyle={style.wrapper}
        {...styleProps}
      >
        {label}

        <ToggleComponent
          userStyle={style.toggle}
          {...styleProps}
          tabIndex={isEnabled ? 0 : -1}
          onKeyDown={this._onKeyDown}
          onFocus={this._onFocus}
          onBlur={this._onBlur}
        >
          <ToggleTrack userStyle={style.track} {...styleProps} />
          <ToggleKnob userStyle={style.knob} {...styleProps} />
        </ToggleComponent>
      </WrapperComponent>
    );
  }