How to use the @patternfly/react-core.TextListItemVariants.dt function in @patternfly/react-core

{props.extensionName}
      
      
        {props.i18nDescription}
      
      
        {props.extensionDescription ? props.extensionDescription : null}
      
      
        {props.i18nType}
      
      
        {props.i18nTypeMessage}
      
      
        {props.i18nLastUpdate}
      
      
        {props.i18nLastUpdateDate ? props.i18nLastUpdateDate : null}
      
    
  );
};

<title size="md">
                {this.props.i18nApiDefinitionHeading}
              </title>
              
                
                  
                    {this.props.i18nNameLabel}
                  
                  
                    {this.props.apiConnectorName}
                  
                  
                    {this.props.i18nDescriptionLabel}
                  
                  
                    {this.props.apiConnectorDescription}
                  
                
              
              <title size="md">
                {this.props.i18nImportedHeading}
              </title>

{props.extensionActions.map((action: IAction, index: number) => (
            
              
                {action.name}
              
              
                {action.description}
              
            
          ))}

auto_publish: autoPublish,
    import_only: importOnly,
  } = details;

  if (updating) return ;
  const onEdit = (val, attribute) => dispatch(updateContentView(cvId, { [attribute]: val }));
  return (
    
      
        
        
          {__('Label')}
        
        
          {label}
        
        
          {__('Type')}
        
        
          
            
            { composite ? 'Composite' : 'Component' }

{props.extensionName}
              
              
                {props.i18nDescriptionLabel}
              
              
                {props.extensionDescription ? props.extensionDescription : null}
              
              
                {props.i18nTypeLabel}
              
              
                {props.i18nExtensionTypeMessage}
              
              
                {props.i18nActionsLabel}

render() {
    return (
      
        
          Web
          
            The part of the Internet that contains websites and web pages
          
          HTML
          A markup language for creating web pages
          CSS
          A technology to make HTML look better
        
      
    );
  }
}

> = ({ url }) => (
  <>
    {url && (
      
        
          
            
              External URL
            
            
              {url}
            
          
        
      
    )}
  
);

function VariablesDetail({ value, label, rows }) {
  const [mode, setMode] = useState(isJson(value) ? JSON_MODE : YAML_MODE);
  const [currentValue, setCurrentValue] = useState(value);
  const [error, setError] = useState(null);

  if (!value) {
    return null;
  }

  return (
    <>
      
        
          
            <div>
              <span>
                {label}
              </span>
            </div>

<h5>
              {this.props.i18nValidationFallbackMessage}
            </h5>
          ) : (
            
              {this.props.alert &amp;&amp; this.props.alert}
              <title size="{'md'}">
                {this.props.i18nApiDefinitionHeading}
              </title>
              
                
                  
                    {this.props.i18nNameLabel}
                  
                  
                    {this.props.apiProviderName}
                  
                  
                    {this.props.i18nDescriptionLabel}
                  
                  
                    {this.props.apiProviderDescription}

{this.props.connectionIcon}
            
          
          
            
              
                {this.props.i18nDescriptionLabel}