Issue #3307806: Create process list embedded content component

<?php

namespace Drupal\uswds_ckeditor_integration\Plugin\EmbeddedContent;

use Drupal\Core\Form\FormStateInterface;

use Drupal\Core\StringTranslation\StringTranslationTrait;

use Drupal\ckeditor5_embedded_content\EmbeddedContentInterface;

use Drupal\ckeditor5_embedded_content\EmbeddedContentPluginBase;

/**

 * Plugin USWDS Process List for Ckeditor5 Embedded Content.

 *

 * @EmbeddedContent(

 *   id = "uswds_process_list",

 *   label = @Translation("Process List"),

 *   description = @Translation("Renders a USWDS Process List."),

 * )

 */

class ProcessList extends EmbeddedContentPluginBase implements EmbeddedContentInterface {

  use StringTranslationTrait;

  /**

   * {@inheritdoc}

   */

  public function defaultConfiguration() {

    return [

      'process_items' => NULL,

    ];

  }

  /**

   * {@inheritdoc}

   */

  public function build(): array {

    $items = $this->configuration['process_items'] ?? NULL;

    if (empty($items)) {

      return [

        '#type' => 'markup',

        '#markup' => $this->t('No items set.'),

      ];

    }

    foreach ($items as $delta => $item) {

      $items[$delta]['#heading'] = $item['heading'];

      if (!empty($item['body']['value'])) {

        $items[$delta]['#body'] = [

          '#type' => 'processed_text',

          '#text' => $item['body']['value'],

          '#format' => $item['body']['format'],

        ];

      }

    }

    return [

      '#theme' => 'uswds_ckeditor_process_list',

      '#process_items' => $items,

    ];

  }

  /**

   * {@inheritdoc}

   */

  public function buildConfigurationForm(array $form, FormStateInterface $form_state) {

    $items = $this->configuration['process_items'] ?? [];

    if (empty($items)) {

      $items[] = [];

    }

    if ($triggeringElement = $form_state->getTriggeringElement()) {

      if (($triggeringElement['#op'] ?? '') == 'remove_item') {

        unset($items[$triggeringElement['#delta']]);

      }

      if (($triggeringElement['#op'] ?? '') == 'add_item') {

        $items[] = [];

      }

    }

    $form['process_items'] = [

      '#type' => 'container',

      '#attributes' => [

        'id' => 'items-wrapper',

        'style' => 'min-width:800px',

      ],

    ];

    foreach ($items as $delta => $item) {

      $element = [

        '#type' => 'details',

        '#open' => $delta === array_key_last($items),

        '#title' => 'Process Item',

      ];

      $element['heading'] = [

        '#type' => 'textfield',

        '#title' => $this->t('Heading'),

        '#default_value' => $this->configuration['process_items'][$delta]['heading'],

        '#required' => TRUE,

      ];

      $element['body'] = [

        '#type' => 'text_format',

        '#title' => $this->t('Body'),

        '#format' => $this->configuration['process_items'][$delta]['body']['format'] ?? 'full_html',

        '#allowed_formats' => ['full_html', 'plain_text'],

        '#default_value' => $this->configuration['process_items'][$delta]['body']['value'] ?? '',

        '#required' => FALSE,

      ];

      $element['remove_item'] = [

        '#type' => 'button',

        '#limit_validation_errors' => [],

        '#value' => $this->t('Remove item'),

        '#delta' => $delta,

        '#op' => 'remove_item',

        '#name' => 'remove_item_' . $delta,

        '#ajax' => [

          'wrapper' => 'items-wrapper',

          'callback' => [static::class, 'updateItems'],

        ],

      ];

      $form['process_items'][$delta] = $element;

    }

    $form['add_item'] = [

      '#type' => 'button',

      '#limit_validation_errors' => [],

      '#value' => $this->t('Add item'),

      '#name' => 'add_item',

      '#op' => 'add_item',

      '#ajax' => [

        'wrapper' => 'items-wrapper',

        'callback' => [static::class, 'updateItems'],

      ],

    ];

    return $form;

  }

  /**

   * Update items form element.

   *

   * @param array $form

   *   The form.

   * @param \Drupal\Core\Form\FormStateInterface $form_state

   *   The form state.

   *

   * @return array

   *   The form element.

   */

  public static function updateItems(array &$form, FormStateInterface $form_state) {

    return $form['config']['plugin_config']['process_items'];

  }

}

<ol class="usa-process-list">

  {% for item in process_items %}

  <li class="usa-process-list__item">

    <h4 class="usa-process-list__heading">{{ item['#heading'] }}</h4>

    {% if item['#body'] is not empty %}

      <p class="margin-top-05">

        {{ item['#body'] }}

      </p>

    {% endif %}

  </li>

  {% endfor %}

</ol>

      ],

      'template' => 'embedded-content/alerts',

    ],

    'uswds_ckeditor_process_list' => [

      'variables' => [

        'process_items' => NULL,

      ],

      'template' => 'embedded-content/process-list',

    ],

    'uswds_ckeditor_integration_summary_box' => [

      'variables' => [

        'heading' => NULL,