Create Custom Select Webform Element

Question

I asked this last time with 'Select Other', but I am still not understanding how to change custom element's type. In this scenario, I am attempting to build a Select type webform element. I am reusing the Webform Example attached to the webform module. But my issue is that I can not change it from an <input> to a <select> type.

Inside, \webform_example_element\src\Element\WebformExampleElement.php I have tried:

  public function getInfo() {
    $class = get_class($this);
    return [
      '#title' => $this->t('Facility'),
      '#type' => 'Select',
      '#input' => false,
    ...
   }

AND I have tried:

  public static function processWebformAssignedBy(&$element, FormStateInterface $form_state, &$complete_form) {
    $element['#tree'] = true;
    $element['#type'] = 'select';
    $element['#input'] = false;
    $element['#options'] = [
      '1' => 'One',
      '2' => 'Two',
    ];

Using X-Debug, when the page is loaded I get:

$element = {array} [48]
 #type = "select"
 #title = "current_facility"
 #multiple = false
 #access_create_roles = {array} [2]
 #access_update_roles = {array} [2]
 #access_view_roles = {array} [2]
 #webform = "generate_system_number_form_1_"
 #webform_id = "generate_system_number_form_1_--current_facility"
 #webform_key = "current_facility"
 #webform_parent_key = "net_new_process_information"
 #webform_parent_flexbox = false
 #webform_depth = {int} 1
 #webform_children = {array} [0]
 #webform_multiple = false
 #webform_composite = false
 #webform_parents = {array} [2]
 #admin_title = "current_facility"
 #webform_plugin_id = "facility"
 #webform_submission = "121"
 #access = true
 #webform_element = true
 #allowed_tags = {array} [78]
 #element_validate = {array} [1]
 #pre_render = {array} [1]
 #after_build = {array} [1]
 #_webform_access = true
 #_webform_states = {array} [0]
 #theme = "input__webform_example_element__webform_generate_system_number_form_1__form__current_facility"
 #theme_wrappers = {array} [1]
 #formdazzle = {array} [3]
 #process = {array} [3]
 #input = false
 #value_callback = {array} [2]
 #defaults_loaded = true
 #tree = true
 #parents = {array} [1]
 #array_parents = {array} [3]
 #weight = {float} 0.007
 #processed = false
 #required = false
 #attributes = {array} [1]
 #title_display = "before"
 #description_display = "after"
 #errors = null
 #id = "edit-current-facility"
 #name = "current_facility"
 #value = ""
 #options = {array} [2]

But after returning, I still get an <input> field. Any suggestions how to alter the input type to be select? Thank you

Answer 1

After long research about Webform elements, I have finally figured out the solution. Extend the Select Element. :)

use Drupal\Core\Render\Element\Select;

class Facility extends Select {

  /**
   * {@inheritdoc}
   */
  public function getInfo() {
    $properties = parent::getInfo();
    $class = get_class($this);
    $properties['#process'][] = [$class, 'processMyCustomSelect'];

    return $properties;
  }

 public static function processMyCustomSelect(&$element, FormStateInterface $form_state, &$complete_form) {
    // Here you can add and manipulate your element's properties and callbacks.
    return $element;
  }
}

this post really helped me out a lot: Webform Custom Radios/Checkboxes Element does not get rendered in webform : Drupal 8