How to use the @patternfly/react-core.TextVariants.small function in @patternfly/react-core

const isDisabled = selectedRows.length === 0

  const [isOpen, setIsOpen] = useState(false)

  const toggle = (
    
      {t('bulk_actions.title')}
    
  )

  const warning = [
    // FIXME: add styles to look like in mockup
    
      
        
        
      
    ,
    
  ]

  const dropdownItems = useMemo(() => [
    ...(isDisabled ? warning : []),
    ...Object.keys(actions).map((key) => (
       setModal(key as BulkAction)}
      >

{props.i18nCacheHitRatioText}
            
            
              {props.i18nInfoMessage}}
                closeBtnAriaLabel={props.a11yInfoCloseButton}
              >
                
              
            
          
        ) : (
          
            
          
        )}
      
    
  );
};

);
      } else {
        const { showErrorMsg } = this.state;
        return (
          
            
            <title size="lg">
              Unable to deploy the application
            </title>
            
              
                
              
            
          
        );
      }
    } else {
      return (
        <form>
          <title size="2xl">
            Confirm the installation settings
          </title>
          
            </form>

)}
      
    );
  }

  return (
    
      
        <title size="lg">
          {props.i18nNoDataTitle}
        </title>
        
          
            
          
        
      
    
  );
};

cells.push(
            
                <div>
                    
                        {name}
                    
                    {deprecated &amp;&amp; }
                    {showNamespace ? (
                        
                            
                        
                    ) : null}
                </div>
                <div>
                    {latest_version.metadata.description}
                </div>
                <div>
                    {latest_version.metadata.tags.map((tag, index) =&gt; (
                        {tag}
                    ))}
                </div>
                <div>
                    {Object.keys(contentSummary.contents).map(k =&gt; (
                        <div></div></div>

gutter={'lg'}
          >
            
              {props.sessionCount}
            
            
              {props.i18nSessionText}
            
          
        ) : (
          
            
          
        )}
      
    
  );
};

const InactiveText = props => (
  
    
  
);

<div>
                        
                            {name}
                        
                    </div>
                    <div>
                        
                            
                        
                    </div>
                
                
                    {this.getDescription(latest_version.metadata.description)}
                
                
                    {Object.keys(contentSummary.contents).map(k =&gt;
                        this.renderTypeCount(k, contentSummary.contents[k]),
                    )}
                
            
        );
    }

{carregando ?  :
          evento ?
            
              
                
                  
                
              
              
                
                  
                
              
              
                
                  
                
              
              
                
                  
                    <button> {evento.inscricoesAbertas ? "Inscrever" : "Inscrições Fechadas"} </button>
                  
                  
                    <button> {evento.aceitandoTrabalhos ? "Enviar Palestra" : "Palestras Fechadas"} </button>

const renderHelpBlock = (help?: string) => (help ?  : '');