@using Astrol.Entities.Basic.UI

@using Astrol.Component.RichText

@using Astrol.Component.Basic.Button

@using Astrol.Component.Basic.Modal

@using Astrol.Component.Basic.Load

<AstrolLoad Status="_load" />

<AstrolModal Title="HTML content" Status="_statusModal">

 <div style="text-align:left; padding:20px;">

 @((MarkupString) _htmlContent)

 </div>

</AstrolModal>

<div style="padding:5px;">

 <AstrolRichText @ref="_astrolRichText"

 MaxHeight="220px"

 Placeholder="Enter your text here." />

 <AstrolButton OnClick="GetHTML" 

 Style="AstrolStyle.Blue"

 Text="Get HTML" 

 Icon="astrol-code-1" />

</div>

@code {

 private string _htmlContent = "";

 private bool _statusModal = false;

 private bool _load = false;

 private AstrolRichText? _astrolRichText;

 public async Task GetHTML()

 {

 _load = true;

 if (_astrolRichText != null)

 _htmlContent = await _astrolRichText.GetHTMLAsync();

 _statusModal = true;

 _load = false;

 }

}

Parámetros que admite

• ReadOnly (bool), define el componente se encuentra en modo de lectura (por defecto es false).
• IsBottomToolbar (bool), define si la barra de opciones se muestra en la parte inferior (por defecto es false).
• MinHeight (string), altura máxima (por defecto es de 150px).
• MaxHeight (string), altura máxima (por defecto es de 200px).
• Placeholder (string), texto a mostrar en el placeholder del componente (no requerido).
• ToolbarClass (string), clase css a definir para la barra de opciones (no requerido).
• ContentClass (string), clase css a definir para el contenido (no requerido).
• FullRender (EventCallback), evento que notifica cuando el componente se ha cargado completamente (no requerido).
• Configuración de la barra de opciones, todas de tipo (bool) y permiten desabilitarlas ya que todas por defecto true:
  • ShowFont
  • ShowSize
  • ShowBold
  • ShowItalic
  • ShowUnderline
  • ShowStrike
  • ShowColor
  • ShowBackground
  • ShowListOrdered
  • ShowListBullet
  • ShowIndentPlus
  • ShowIndentLess
  • ShowAlign
  • ShowHeader1
  • ShowHeader2
  • ShowBlockquote
  • ShowCodeBlock
  • ShowScriptSub
  • ShowScriptSuper
  • ShowFormula
  • ShowLink
  • ShowImage
  • ShowVideo

Métodos públicos

• GetTextAsync, permite obtener el texto escrito en el componente (retorna un string).
• GetHTMLAsync, permite obtener el HTML del componente (retorna un string).
• GetContentAsync, permite obtener el contenido (JSON) del componente (retorna un string).
• SetContentAsync, permite insertar un contenido (JSON) al componente (recibe un string).
• SetHTMLAsync, permite insertar HTML al componente (recibe un string).
• SetTextAsync, permite insertar texto al componente (recibe un string).
• SetStatusAsync, permite establecer o modificar el estado del componente (recibe un bool).
• InsertImageAsync, permite insertar una imagen al componente (recibe un string que representa la URL de la imagen).
• InsertVideoAsync, permite insertar un video al componente (recibe un string que representa la URL del video).