How to use the @blueprintjs/icons.IconNames.WARNING_SIGN function in @blueprintjs/icons

render() {
    let address = 'team42.local';
    let status = 'Unknown', icon = IconNames.HELP, intent;
    switch (this.props.status) {
      case ConnectionStatus.HEALTHY:
        status = 'Healthy';
        icon = IconNames.TICK_CIRCLE;
        intent = Intent.SUCCESS;
        break;
      case ConnectionStatus.WARNING:
        status = 'Warning';
        icon = IconNames.WARNING_SIGN;
        intent = Intent.WARNING;
        break;
      // case ConnectionStatus.ERROR:
      //   status = 'Error';
      //   icon = IconNames.ERROR;
      //   intent = Intent.DANGER;
      //   break;
      case ConnectionStatus.DISCONNECTED:
        status = 'Disconnected';
        icon = IconNames.SIGNAL_SEARCH;
        break;
    }
    return (
      
        
          {status} {this.props.status !== ConnectionStatus.DISCONNECTED &amp;&amp; <span></span>

renderContent(content: string, isSelected: boolean) {
    const isTruncated =
      Buffer.byteLength(content, "utf8") >= this.props.maxBytes;

    if (isTruncated) {
      const nextLine = content.indexOf("\n") + 1;
      const truncated =
        nextLine < content.length ? content.slice(nextLine) : content;
      content = TRUNCATE_PREFIX + truncated;
    }

    const warning = isTruncated ? (
      
        
        This log has exceeded the 5MB limit.{" "}
        <a download="" href="{this.getDownloadUrl()}">
          Download the full log file
        </a>
        .
      
    ) : null;

    return (
      
        {warning}

<p>The console is running in restricted mode.</p>
          {message}
          <p>
            For more info check out the{' '}
            
              console documentation
            
            .
          </p>
        
      }
      position={Position.BOTTOM_RIGHT}
    &gt;
      <button>
    
  );
});
</button>

private createAbbreviation(abbreviation: string, selectedAbbreviations: string[]) {
        const selectedIcon = selectedAbbreviations.find((currentAbbreviation) =>
            abbreviation === currentAbbreviation) !== undefined ?
             : null;

        const conflictIcon = this.abbreviationHasConflicts(abbreviation) ?
             : null;

        const numberOfSections = this.props.searchItem.sectionsMatchingCourse.filter(
            (section) => section.departmentAndCourse === abbreviation).length;

        const numberOfSectionsTag = (
            <span>
                
                     {numberOfSections} Sections 
                
                
                     {numberOfSections} 
                
            </span>
        );

        return (

<div style="{{">
                {allSolidsSelected ? "All" : highlighted.length} solid
                {highlighted.length !== 1 || allSolidsSelected ? "s" : ""}{" "}
                selected
              </div>
              <button> this.setState({ open: false })}&gt;
                Cancel
              </button>
              <button>
                Apply
              </button>
            
          
        
        <button>
          {valid &amp;&amp; this.props.pipeline
            ? subsetDescription(this.props.value, this.props.pipeline)
            : "Invalid Solid Selection"}
        </button>
      
    );
  }
}

render() {
    const { className, duplicant } = this.props;

    const behavior = duplicant.getBehavior(MinionResumeBehavior);
    if (!behavior) {
      return (
        
          No resume behavior exists on this duplicant. Jobs may not have been
          initialized.
        
      );
    }

    const rows = APTITUDE_NAMES.filter(x => !SKIP_APTITUDES.has(x)).map(
      name => (
        
      )
    );

items={this.props.modes}
          itemPredicate={(query, mode) =>
            query.length === 0 || mode.name.includes(query)
          }
          itemRenderer={(mode, props) => (
            
          )}
          onItemSelect={this.onItemSelect}
        >
          <button disabled="{singleMode" mode="">
        
      
    );
  }
</button>

key={section.CRN}
                    section={section}
                    addMargin={!allHidden && index === this.props.sectionsInGroup.length - 1}
                    isManaged={section.isManaged}
                    isSelected={section.isSelected}
                    isUnavailable={section.isUnavailable}
                    isVisible={section.isVisible}
                />));

            const conflictsElements = this.createConflictsElements();

            let calloutIcon: IconName;
            let intent: Intent;

            if (conflictsElements.length > 0) {
                calloutIcon = IconNames.WARNING_SIGN;
                intent = Intent.DANGER;
            } else if (this.props.sectionsInGroup.find((section) => section.isSelected) !== undefined) {
                calloutIcon = IconNames.TICK_CIRCLE;
                intent = Intent.SUCCESS;
            } else {
                calloutIcon = IconNames.CIRCLE;
                intent = Intent.NONE;
            }

            return (