/**
  * @internal
  */
 protected function _render($id, $option, $data)
 {
     $data['value'] = fw_ext('mailer')->get_db_settings_option();
     $wrapper_attr = $option['attr'];
     unset($wrapper_attr['name'], $wrapper_attr['value']);
     return '<div ' . fw_attr_to_html($wrapper_attr) . '>' . fw()->backend->option_type('multi')->render($id, array('inner-options' => $this->get_inner_options()), $data) . '</div>';
 }

 /**
  * @internal
  * {@inheritdoc}
  */
 protected function _render($id, $option, $data)
 {
     $options_array = $this->prepare_option($id, $option);
     unset($option['attr']['name'], $option['attr']['value']);
     if ($option['show_borders']) {
         $option['attr']['class'] .= ' fw-option-type-multi-picker-with-borders';
     } else {
         $option['attr']['class'] .= ' fw-option-type-multi-picker-without-borders';
     }
     reset($option['picker']);
     $picker_key = key($option['picker']);
     $picker_type = $option['picker'][$picker_key]['type'];
     $picker = $option['picker'][$picker_key];
     $picker_value = fw()->backend->option_type($picker_type)->get_value_from_input($picker, isset($data['value'][$picker_key]) ? $data['value'][$picker_key] : null);
     $skip_first = true;
     foreach ($options_array as $group_id => &$group) {
         if ($skip_first) {
             // first is picker
             $skip_first = false;
             continue;
         }
         if ($group_id === $id . '-' . $picker_value) {
             // skip selected choice options
             continue;
         }
         $options_array[$group_id]['attr']['data-options-template'] = fw()->backend->render_options($options_array[$group_id]['options'], $data['value'], array('id_prefix' => $data['id_prefix'] . $id . '-', 'name_prefix' => $data['name_prefix'] . '[' . $id . ']'));
         $options_array[$group_id]['options'] = array();
     }
     return '<div ' . fw_attr_to_html($option['attr']) . '>' . fw()->backend->render_options($options_array, $data['value'], array('id_prefix' => $data['id_prefix'] . $id . '-', 'name_prefix' => $data['name_prefix'] . '[' . $id . ']')) . '</div>';
 }

 /**
  * @internal
  */
 protected function _render($id, $option, $data)
 {
     $input_attr = array('name' => $option['attr']['name'], 'id' => $option['attr']['id'] . '--checkbox', 'data-switch-left' => $option['left-choice']['label'], 'data-switch-right' => $option['right-choice']['label']);
     foreach (array('left', 'right') as $value_type) {
         if (is_bool($option[$value_type . '-choice']['value'])) {
             $input_attr['data-switch-' . $value_type . '-bool-value'] = $option[$value_type . '-choice']['value'] ? 'true' : 'false';
         } else {
             $input_attr['data-switch-' . $value_type . '-value'] = $option[$value_type . '-choice']['value'];
         }
     }
     if (defined('DOING_AJAX') && DOING_AJAX && in_array($data['value'], array('false', 'true')) && ($option['left-choice']['value'] !== $data['value'] && $option['right-choice']['value'] !== $data['value'])) {
         /**
          * This happens on fw.OptionsModal open/render
          * When the switch is used by other option types
          * then this script http://bit.ly/1QshDoS can't fix nested values
          *
          * Check if values is 'true' or 'false' and one of the choices values is a boolean that matches it
          * then transform/fix it to boolean
          */
         if ($data['value'] === 'true' && (is_bool($option['right-choice']['value']) && $option['right-choice']['value'] === true || is_bool($option['left-choice']['value']) && $option['left-choice']['value'] === true)) {
             $data['value'] = true;
         } elseif ($data['value'] === 'false' && (is_bool($option['right-choice']['value']) && $option['right-choice']['value'] === false || is_bool($option['left-choice']['value']) && $option['left-choice']['value'] === false)) {
             $data['value'] = false;
         }
     }
     if ($data['value'] === $option['right-choice']['value']) {
         // right choice means checked
         $input_attr['checked'] = 'checked';
     }
     unset($option['attr']['name'], $option['attr']['value'], $option['attr']['checked'], $option['attr']['type']);
     return '<div ' . fw_attr_to_html($option['attr']) . '>' . '<input type="hidden" value="" ' . (empty($input_attr['checked']) ? 'name="' . esc_attr($input_attr['name']) . '"' : '') . ' />' . '<input type="checkbox" ' . fw_attr_to_html($input_attr) . ' />' . '</div>';
 }

 public function _admin_filter_shortcode_notation($notation, $atts)
 {
     $attributes = $atts['optionValues'];
     $attributes['color'] = !empty($attributes['color']) ? $attributes['color'] : '#000';
     $attributes['size'] = !empty($attributes['size']) ? $attributes['size'] : '40';
     return '[icon ' . fw_attr_to_html($attributes) . ']';
 }

 /**
  * @internal
  */
 protected function _render($id, $option, $data)
 {
     // this js contains custom changes
     wp_enqueue_script('fw-option-' . $this->get_type() . '-image-picker', fw_get_framework_directory_uri('/includes/option-types/' . $this->get_type() . '/static/js/image-picker/image-picker.js'), array(), fw()->manifest->get_version(), true);
     wp_enqueue_style('fw-option-' . $this->get_type(), fw_get_framework_directory_uri('/includes/option-types/' . $this->get_type() . '/static/css/styles.css'), array('qtip'), fw()->manifest->get_version());
     wp_enqueue_script('fw-option-' . $this->get_type(), fw_get_framework_directory_uri('/includes/option-types/' . $this->get_type() . '/static/js/scripts.js'), array('fw-events', 'qtip'), fw()->manifest->get_version(), true);
     $wrapper_attr = array('id' => $option['attr']['id'], 'class' => $option['attr']['class']);
     foreach ($wrapper_attr as $attr_name => $attr_val) {
         unset($option['attr'][$attr_name]);
     }
     $option['value'] = (string) $data['value'];
     unset($option['attr']['multiple']);
     /**
      * pre loads images on page load
      *
      * fixes glitch with preview:
      * * hover first time  - show wrong because image not loaded and has no height/width and cannot detect correctly popup position
      * * hover second time - show correctly
      */
     $pre_load_images_html = '';
     $html = '';
     $html .= '<select ' . fw_attr_to_html($option['attr']) . '>';
     if (!empty($option['blank']) and $option['blank'] === true) {
         $html .= '<option value=""></option>';
     }
     foreach ($option['choices'] as $key => $choice) {
         $attr = array('value' => $key);
         if ($option['value'] == $key) {
             $attr['selected'] = 'selected';
         }
         if (is_string($choice)) {
             // is 'http://.../small.png'
             $choice = array('small' => array('src' => $choice));
         }
         if (is_string($choice['small'])) {
             // is 'http://.../small.png'
             $choice['small'] = array('src' => $choice['small']);
         }
         $attr['data-small-img-attr'] = json_encode($choice['small']);
         // required by image-picker plugin
         $attr['data-img-src'] = $choice['small']['src'];
         if (!empty($choice['large'])) {
             if (is_string($choice['large'])) {
                 // is 'http://.../large.png'
                 $choice['large'] = array('src' => $choice['large']);
             }
             $attr['data-large-img-attr'] = json_encode($choice['large']);
             $pre_load_images_html .= fw_html_tag('img', array('src' => $choice['large']['src']));
         }
         if (!empty($choice['data'])) {
             // used in js events
             $attr['data-extra-data'] = json_encode($choice['data']);
         }
         $html .= fw_html_tag('option', $attr, fw_htmlspecialchars(isset($choice['label']) ? $choice['label'] : ''));
     }
     $html .= '</select>';
     return fw_html_tag('div', $wrapper_attr, $html . '<div class="pre-loaded-images"><br/><br/>' . $pre_load_images_html . '</div>');
 }

 /**
  * @internal
  */
 protected function _render($id, $option, $data)
 {
     $option['attr']['value'] = (string) $data['value'];
     $option['attr']['class'] .= ' code';
     $option['attr']['size'] = '7';
     $option['attr']['maxlength'] = '7';
     $option['attr']['onclick'] = 'this.select()';
     return '<input type="text" ' . fw_attr_to_html($option['attr']) . '>';
 }

 /**
  * @internal
  */
 protected function _render($id, $option, $data)
 {
     $wrapper_attr = array('id' => $option['attr']['id'], 'class' => $option['attr']['class']);
     foreach ($wrapper_attr as $attr_name => $attr_val) {
         unset($option['attr'][$attr_name]);
     }
     $option['value'] = (string) $data['value'];
     unset($option['attr']['multiple']);
     /**
      * pre loads images on page load
      *
      * fixes glitch with preview:
      * * hover first time  - show wrong because image not loaded and has no height/width and cannot detect correctly popup position
      * * hover second time - show correctly
      */
     $pre_load_images_html = '';
     $html = '';
     $html .= '<select ' . fw_attr_to_html($option['attr']) . '>';
     if ($option['blank'] === true) {
         $html .= '<option value=""></option>';
     }
     foreach ($option['choices'] as $key => $choice) {
         $attr = array('value' => $key);
         if ($option['value'] == $key) {
             $attr['selected'] = 'selected';
         }
         if (is_string($choice)) {
             // is 'http://.../small.png'
             $choice = array('small' => array('src' => $choice));
         }
         if (is_string($choice['small'])) {
             // is 'http://.../small.png'
             $choice['small'] = array('src' => $choice['small']);
         }
         $attr['data-small-img-attr'] = json_encode($choice['small']);
         $attr['data-img-src'] = $choice['small']['src'];
         // required by image-picker plugin
         if (!empty($choice['large'])) {
             if (is_string($choice['large'])) {
                 // is 'http://.../large.png'
                 $choice['large'] = array('src' => $choice['large']);
             }
             $attr['data-large-img-attr'] = json_encode($choice['large']);
             $pre_load_images_html .= fw_html_tag('img', array('src' => $choice['large']['src']));
         }
         if (!empty($choice['data'])) {
             // used in js events
             $attr['data-extra-data'] = json_encode($choice['data']);
         }
         if (!empty($choice['attr'])) {
             $attr = array_merge($choice['attr'], $attr);
         }
         $html .= fw_html_tag('option', $attr, fw_htmlspecialchars(isset($choice['label']) ? $choice['label'] : ''));
     }
     $html .= '</select>';
     return fw_html_tag('div', $wrapper_attr, $html . '<div class="pre-loaded-images"><br/><br/>' . $pre_load_images_html . '</div>');
 }

 /**
  * @internal
  */
 protected function _render($id, $option, $data)
 {
     if (empty($data['value'])) {
         $data['value'] = array();
     }
     $div_attr = $option['attr'];
     unset($div_attr['name'], $div_attr['value']);
     return '<div ' . fw_attr_to_html($div_attr) . '>' . fw()->backend->render_options($option['inner-options'], $data['value'], array('id_prefix' => $data['id_prefix'] . $id . '-', 'name_prefix' => $data['name_prefix'] . '[' . $id . ']')) . '</div>';
 }

 /**
  * @internal
  */
 protected function _render($id, $option, $data)
 {
     wp_enqueue_style('fw-option-' . $this->get_type(), FW_URI . '/includes/option-types/' . $this->get_type() . '/static/css/styles.css', array(), fw()->manifest->get_version());
     if (empty($data['value'])) {
         $data['value'] = array();
     }
     $div_attr = $option['attr'];
     unset($div_attr['name'], $div_attr['value']);
     return '<div ' . fw_attr_to_html($div_attr) . '>' . fw()->backend->render_options($option['inner-options'], $data['value'], array('id_prefix' => $data['id_prefix'] . $id . '-', 'name_prefix' => $data['name_prefix'] . '[' . $id . ']')) . '</div>';
 }

 /**
  * @internal
  */
 protected function _render($id, $option, $data)
 {
     $css_path = fw_get_framework_directory_uri('/includes/option-types/' . $this->get_type() . '/static/css/');
     $js_path = fw_get_framework_directory_uri('/includes/option-types/' . $this->get_type() . '/static/js/');
     wp_enqueue_style('fw-option-type' . $this->get_type(), $css_path . 'multi-picker.css', array(), fw()->manifest->get_version());
     wp_enqueue_script('fw-option-type' . $this->get_type(), $js_path . 'multi-picker.js', array('jquery', 'fw-events'), fw()->manifest->get_version(), true);
     $options_array = $this->prepare_option($id, $option);
     unset($option['attr']['name'], $option['attr']['value']);
     return '<div ' . fw_attr_to_html($option['attr']) . '>' . fw()->backend->render_options($options_array, $data['value'], array('id_prefix' => $data['id_prefix'] . $id . '-', 'name_prefix' => $data['name_prefix'] . '[' . $id . ']')) . '</div>';
 }

 /**
  * @internal
  * {@inheritdoc}
  */
 protected function _render($id, $option, $data)
 {
     $options_array = $this->prepare_option($id, $option);
     unset($option['attr']['name'], $option['attr']['value']);
     if ($option['show_borders']) {
         $option['attr']['class'] .= ' fw-option-type-multi-picker-with-borders';
     } else {
         $option['attr']['class'] .= ' fw-option-type-multi-picker-without-borders';
     }
     return '<div ' . fw_attr_to_html($option['attr']) . '>' . fw()->backend->render_options($options_array, $data['value'], array('id_prefix' => $data['id_prefix'] . $id . '-', 'name_prefix' => $data['name_prefix'] . '[' . $id . ']')) . '</div>';
 }

 /**
  * @internal
  */
 protected function _render($id, $option, $data)
 {
     $option['attr']['value'] = empty($data['value']) ? $option['value'] : $data['value'];
     $option['attr']['data-default'] = $option['value'];
     $palettes = (bool) $option['palettes'];
     if (!empty($option['palettes']) && is_array($option['palettes'])) {
         $palettes = $option['palettes'];
     }
     $option['attr']['data-palettes'] = json_encode($palettes);
     return '<input type="text" ' . fw_attr_to_html($option['attr']) . '>';
 }

 /**
  * @internal
  */
 protected function _render($id, $option, $data)
 {
     wp_enqueue_style('fw-option-' . $this->get_type(), FW_URI . '/includes/option-types/' . $this->get_type() . '/static/css/styles.css', array(), fw()->manifest->get_version());
     wp_enqueue_script('wp-color-picker');
     wp_enqueue_script('fw-option-' . $this->get_type(), FW_URI . '/includes/option-types/' . $this->get_type() . '/static/js/scripts.js', array('fw-events'), fw()->manifest->get_version(), true);
     $option['attr']['value'] = (string) $data['value'];
     $option['attr']['class'] .= ' code';
     $option['attr']['size'] = '7';
     $option['attr']['maxlength'] = '7';
     $option['attr']['onclick'] = 'this.select()';
     return '<input type="text" ' . fw_attr_to_html($option['attr']) . '>';
 }

 /**
  * @internal
  */
 protected function _render($id, $option, $data)
 {
     global $wp_filesystem;
     if (empty($wp_filesystem)) {
         require_once ABSPATH . '/wp-admin/includes/file.php';
         WP_Filesystem();
     }
     /**
      * $data['value'] contains correct value returned by the _get_value_from_input()
      * You decide how to use it in html
      */
     $option['attr']['value'] = (string) $data['value'];
     /**
      * $option['attr'] contains all attributes.
      *
      * Main (wrapper) option html element should have "id" and "class" attribute.
      *
      * All option types should have in main element the class "fw-option-type-{$type}".
      * Every javascript and css in that option should use that class.
      *
      * Remaining attributes you can:
      *  1. use them all in main element (if option itself has no input elements)
      *  2. use them in input element (if option has input element that contains option value)
      *
      * In this case you will use second option.
      */
     $wrapper_attr = array('id' => $option['attr']['id'], 'class' => $option['attr']['class']);
     unset($option['attr']['id'], $option['attr']['class']);
     $json_file = get_template_directory() . '/inc/includes/option-types/' . $this->get_type() . '/icons/selection.json';
     if ($wp_filesystem->exists($json_file)) {
         $json_content = $wp_filesystem->get_contents($json_file);
         if (!$json_content) {
             return new WP_Error('reading_error', 'Error when reading file');
         }
         $json_content = json_decode($json_content, true);
     } else {
         echo 'Error: JSON file not found';
         return false;
     }
     // icons SELECT input
     $html = '<div ' . fw_attr_to_html($wrapper_attr) . '>';
     $html .= '<select ' . fw_attr_to_html($option['attr']) . ' class="fonticonpicker">';
     $html .= '<option value="">' . __('None', 'fw') . '</option>';
     foreach ($json_content['icons'] as $icon) {
         $glyph_full = $json_content['prefix'] . $icon;
         $html .= '<option value="' . $glyph_full . '" ' . selected($option['attr']['value'], $glyph_full, false) . '>' . $glyph_full . '</option>';
     }
     $html .= '</select>';
     $html .= '</div>';
     return $html;
 }

 /**
  * @internal
  */
 protected function _render($id, $option, $data)
 {
     $option['attr']['value'] = (string) $data['value'];
     $option['attr']['class'] .= ' code';
     $option['attr']['size'] = '7';
     $option['attr']['maxlength'] = '7';
     $option['attr']['onclick'] = 'this.select()';
     $option['attr']['data-default'] = $option['value'];
     $palettes = (bool) $option['palettes'];
     if (!empty($option['palettes']) && is_array($option['palettes'])) {
         $palettes = $option['palettes'];
     }
     $option['attr']['data-palettes'] = json_encode($palettes);
     return '<input type="text" ' . fw_attr_to_html($option['attr']) . '>';
 }

 protected function _render($containers, $values, $data)
 {
     $html = '';
     $defaults = $this->get_defaults();
     foreach ($containers as $id => &$option) {
         $attr = $option['attr'];
         $attr['data-modal-title'] = $option['title'];
         if (in_array($option['modal-size'], array('small', 'medium', 'large'))) {
             $attr['data-modal-size'] = $option['modal-size'];
         } else {
             $attr['data-modal-size'] = $defaults['modal-size'];
         }
         $html .= '<div ' . fw_attr_to_html($attr) . '>' . '<p class="popup-button-wrapper">' . fw_html_tag('button', array('type' => 'button', 'class' => 'button button-secondary popup-button'), $option['title']) . '</p>' . (empty($option['desc']) ? '' : '<div class="popup-desc">' . $option['desc'] . '</div>') . '<div class="popup-options fw-hidden">' . fw()->backend->render_options($option['options'], $values, $data) . '</div>' . '</div>';
     }
     return $html;
 }

 protected function _render($containers, $values, $data)
 {
     $html = '';
     foreach ($containers as $id => &$group) {
         $attr = isset($group['attr']) ? $group['attr'] : array();
         $attr['id'] = 'fw-backend-options-group-' . $id;
         if (!isset($attr['class'])) {
             $attr['class'] = 'fw-backend-options-group';
         } else {
             $attr['class'] = 'fw-backend-options-group ' . $attr['class'];
         }
         $html .= '<div ' . fw_attr_to_html($attr) . '>';
         $html .= fw()->backend->render_options($group['options'], $values, $data);
         $html .= '</div>';
     }
     return $html;
 }

 /**
  * @internal
  */
 protected function _render($id, $option, $data)
 {
     if (is_null($data['value'])) {
         $data['value'] = $this->get_value_from_input($option, null);
     }
     $input_attr = array('name' => $option['attr']['name'], 'id' => $option['attr']['id'] . '--checkbox', 'data-switch-left' => $option['left-choice']['label'], 'data-switch-right' => $option['right-choice']['label']);
     foreach (array('left', 'right') as $value_type) {
         $input_attr['data-switch-' . $value_type . '-value-json'] = json_encode($option[$value_type . '-choice']['value']);
     }
     if ($checked = $data['value'] === $option['right-choice']['value']) {
         $input_attr['checked'] = 'checked';
         // right choice means checked
     }
     $input_attr['value'] = json_encode($option[($checked ? 'right' : 'left') . '-choice']['value']);
     unset($option['attr']['name'], $option['attr']['value'], $option['attr']['checked'], $option['attr']['type']);
     return '<div ' . fw_attr_to_html($option['attr']) . '>' . '<!-- note: value is json encoded, if want to use it in js, do: var val = JSON.parse($input.val()); -->' . ($checked ? '' : fw_html_tag('input', array('type' => 'hidden', 'name' => $input_attr['name'], 'value' => $input_attr['data-switch-left-value-json']))) . '<input type="checkbox" ' . fw_attr_to_html($input_attr) . ' />' . '</div>';
 }

 /**
  * @internal
  */
 protected function _render($id, $option, $data)
 {
     $input_attr = array('name' => $option['attr']['name'], 'id' => $option['attr']['id'] . '--checkbox', 'data-switch-left' => $option['left-choice']['label'], 'data-switch-right' => $option['right-choice']['label']);
     foreach (array('left', 'right') as $value_type) {
         if (is_bool($option[$value_type . '-choice']['value'])) {
             $input_attr['data-switch-' . $value_type . '-bool-value'] = $option[$value_type . '-choice']['value'] ? 'true' : 'false';
         } else {
             $input_attr['data-switch-' . $value_type . '-value'] = $option[$value_type . '-choice']['value'];
         }
     }
     if ($data['value'] === $option['right-choice']['value']) {
         // right choice means checked
         $input_attr['checked'] = 'checked';
     }
     unset($option['attr']['name'], $option['attr']['value'], $option['attr']['checked'], $option['attr']['type']);
     return '<div ' . fw_attr_to_html($option['attr']) . '>' . '<input type="hidden" value="" ' . (empty($input_attr['checked']) ? 'name="' . esc_attr($input_attr['name']) . '"' : '') . ' />' . '<input type="checkbox" ' . fw_attr_to_html($input_attr) . ' />' . '</div>';
 }

 /**
  * @internal
  */
 protected function _render($id, $option, $data)
 {
     //replace \u00a0 char to  
     $value = str_replace(chr(194) . chr(160), ' ', (string) $data['value']);
     $name = $option['attr']['name'];
     unset($option['attr']['name'], $option['attr']['value']);
     $this->enqueue_static($option);
     $textarea_id = 'textarea_';
     if (preg_match('/[^a-z0-9_\\-]/i', $option['attr']['id']) || $option['reinit']) {
         $textarea_id .= 'dynamic_id';
     } else {
         $textarea_id .= $option['attr']['id'];
     }
     $wrapper_attr = array_merge($option['attr'], array('data-name' => $name, 'data-config' => $option['teeny'] ? 'teeny' : (is_array($option['tinymce']) ? 'custom' : 'extended'), 'data-tinymce' => is_array($option['tinymce']) ? json_encode($option['tinymce']) : $option['tinymce'], 'data-tmce-teeny' => json_encode($this->get_teeny_preset($option)), 'data-tmce-extended' => json_encode($this->get_extended_preset($option))));
     echo '<div ' . fw_attr_to_html($wrapper_attr) . ' >';
     wp_editor($value, $textarea_id, array('teeny' => $option['teeny'], 'media_buttons' => $option['media_buttons'], 'tinymce' => $option['tinymce'], 'editor_css' => $option['editor_css']));
     echo '</div>';
 }