namespace WPForms\Forms\Fields\Richtext;
use WPForms\Forms\Fields\Traits\ProField as ProFieldTrait;
class Field extends WPForms_Field {
* Primary class constructor.
// Define field type information.
$this->name = esc_html__( 'Rich Text', 'wpforms-lite' );
$this->keywords = esc_html__( 'image, text, table, list, heading, wysiwyg, visual', 'wpforms-lite' );
$this->type = 'richtext';
$this->icon = 'fa-pencil-square-o';
protected function hooks() {
* Field options panel inside the builder.
* @param array $field Field data and settings.
public function field_options( $field ) {
'after_title' => $this->get_field_options_notice(),
$this->field_option( 'label', $field );
$this->field_option( 'description', $field );
'slug' => 'media_enabled',
'content' => $this->field_element(
'slug' => 'media_enabled',
'value' => isset( $field['media_enabled'] ) ? '1' : '0',
'desc' => esc_html__( 'Allow Media Uploads', 'wpforms-lite' ),
'tooltip' => esc_html__( 'Check this option to allow uploading and embedding files.', 'wpforms-lite' ),
$media_library = $this->field_element(
'slug' => 'media_library',
'value' => isset( $field['media_library'] ) ? '1' : '0',
'desc' => esc_html__( 'Store files in WordPress Media Library', 'wpforms-lite' ),
'tooltip' => esc_html__( 'Check this option to store files in the WordPress Media Library.', 'wpforms-lite' ),
'slug' => 'media_controls',
'class' => ! isset( $field['media_enabled'] ) ? 'wpforms-hide' : '',
'content' => $media_library,
$this->field_option( 'required', $field );
$this->field_option( 'basic-options', $field, [ 'markup' => 'close' ] );
$this->field_option( 'advanced-options', $field, [ 'markup' => 'open' ] );
$output_style = $this->field_element(
'value' => esc_html__( 'Field Style', 'wpforms-lite' ),
$output_style .= $this->field_element(
'value' => ! empty( $field['style'] ) ? esc_attr( $field['style'] ) : 'full',
'full' => esc_html__( 'Full', 'wpforms-lite' ),
'basic' => esc_html__( 'Basic', 'wpforms-lite' ),
'content' => $output_style,
$this->field_option( 'size', $field );
$this->field_option( 'css', $field );
$this->field_option( 'label_hide', $field );
$this->field_option( 'advanced-options', $field, [ 'markup' => 'close' ] );
* The field preview inside the builder.
* @param array $field Field data and settings.
public function field_preview( $field ) {
$this->field_preview_option(
'label_badge' => $this->get_field_preview_badge(),
$style = ! empty( $field['style'] ) && $field['style'] === 'basic' ? 'wpforms-field-richtext-toolbar-basic' : '';
$media_enabled = ! empty( $field['media_enabled'] ) ? 'wpforms-field-richtext-media-enabled' : '';
<div class="wpforms-richtext-wrap tmce-active">
<div class="wp-editor-tabs">
<button type="button" class="wp-switch-editor switch-tmce"><?php esc_html_e( 'Visual', 'wpforms-lite' ); ?></button>
<button type="button" class="wp-switch-editor"><?php esc_html_e( 'Text', 'wpforms-lite' ); ?></button>
<div class="wp-editor-container ">
<div class="mce-container-body">
<div class="mce-toolbar-grp <?php echo esc_attr( $style ); ?> <?php echo esc_attr( $media_enabled ); ?>"></div>
<textarea id="wpforms-richtext-<?php echo wpforms_validate_field_id( $field['id'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>"></textarea>
<div class="mce-statusbar">
<i class="mce-ico mce-i-resize"></i>
$this->field_preview_option( 'description', $field );
* The field display on the form front-end.
* @param array $field Field data and settings.
* @param array $deprecated Field attributes.
* @param array $form_data Form data and settings.
public function field_display( $field, $deprecated, $form_data ) {