Merge branch '2789105-remove-h3-wrapper' into '8.x-1.x'

Issue #2789105: Make TOC title wrapper element configurable

See merge request !19

config/install/toc_api.toc_type.default.yml

@@ -14,6 +14,8 @@ options:
   header_id: title
   header_id_prefix: section
   header_exclude_xpath: ''
+  wrapper: div
+  title_wrapper: h3
   top_label: 'Back to top'
   top_min: 2
   top_max: 2

config/install/toc_api.toc_type.full.yml

@@ -14,6 +14,8 @@ options:
   header_id: title
   header_id_prefix: section
   header_exclude_xpath: ''
+  wrapper: div
+  title_wrapper: h3
   top_label: 'Back to top'
   top_min: 2
   top_max: 2

config/install/toc_api.toc_type.full_numbered.yml

@@ -14,6 +14,8 @@ options:
   header_id: title
   header_id_prefix: section
   header_exclude_xpath: ''
+  wrapper: div
+  title_wrapper: h3
   top_label: 'Back to top'
   top_min: 2
   top_max: 2

config/install/toc_api.toc_type.simple.yml

@@ -14,6 +14,8 @@ options:
   header_id: title
   header_id_prefix: section
   header_exclude_xpath: ''
+  wrapper: div
+  title_wrapper: h3
   top_label: 'Back to top'
   top_min: 2
   top_max: 2

config/install/toc_api.toc_type.simple_numbered.yml

@@ -14,6 +14,8 @@ options:
   header_id: title
   header_id_prefix: section
   header_exclude_xpath: ''
+  wrapper: div
+  title_wrapper: h3
   top_label: 'Back to top'
   top_min: 2
   top_max: 2

config/schema/toc_api.toc_type.schema.yml

@@ -92,3 +92,9 @@ toc_api.toc_type.*:
               type: ignore
             h6:
               type: ignore
+    wrapper:
+      type: string
+      label: 'Wrapper element'
+    title_wrapper:
+      type: string
+      label: 'Title wrapper'

src/TocTypeForm.php

@@ -141,6 +141,18 @@ class TocTypeForm extends EntityForm {
       '#type' => 'textfield',
       '#default_value' => $options['title'],
     ];
+    $form['options']['general']['title_wrapper'] = [
+      '#title' => $this->t('Wrapper element for title'),
+      '#type' => 'textfield',
+      '#default_value' => $options['title_wrapper'] ?? 'h3',
+      '#required' => TRUE,
+    ];
+    $form['options']['general']['wrapper'] = [
+      '#title' => $this->t('Wrapper element for table of contents'),
+      '#type' => 'textfield',
+      '#default_value' => $options['wrapper'] ?? 'div',
+      '#required' => TRUE,
+    ];
     // Hide block option since it is up to TOC submodule to decide how to
     // support it.
     $form['options']['general']['block'] = [
@@ -335,6 +347,23 @@ class TocTypeForm extends EntityForm {
     return $form;
   }
 
+  /**
+   * {@inheritdoc}
+   */
+  public function validateForm(array &$form, FormStateInterface $form_state): void {
+    // Validate HTML tag names.
+    $elements = [
+      'title_wrapper',
+      'wrapper',
+    ];
+    foreach ($elements as $element) {
+      $tag_name = $form_state->getValue(['general', $element]);
+      if (!preg_match('/^[a-zA-Z0-9-]+$/', $tag_name)) {
+        $form_state->setErrorByName('general][' . $element, $this->t('Invalid HTML tag name.'));
+      }
+    }
+  }
+
   /**
    * {@inheritdoc}
    */

templates/toc-tree.html.twig

@@ -6,6 +6,7 @@
  * Returns HTML for a nested list representation of a Table of contents..
  *
  * Available variables:
+ * - options: An array of configuration options.
  * - tree: A nested list of header items. Each header item contains:
  *   - list_tag: HTML tag for the list.
  *   - list_attributes: HTML attributes for the list.
@@ -22,17 +23,18 @@
   @see http://twig.sensiolabs.org/doc/tags/macro.html
 #}
 {% import _self as toc_api_tree %}
-{% set classes = ['toc', 'toc-tree'] %}
 
-<div{{ attributes.addClass(classes) }}>
+{% set wrapper = options.wrapper ?? 'div' %}
+<{{ wrapper }}{{ attributes }}>
 
   {% if tree.title and not options.block %}
-    <h3>{{ tree.title }}</h3>
+    {% set title_wrapper = options.title_wrapper ?? 'h3' %}
+    <{{ title_wrapper }}>{{ tree.title }}</{{ title_wrapper }}>
   {% endif %}
 
   {{ toc_api_tree.tree_links(tree) }}
 
-</div>
+</{{ wrapper }}>
 
 {% macro tree_links(item) %}
   {% import _self as toc_api_tree %}

toc_api.module

@@ -118,6 +118,11 @@ function template_preprocess_toc_tree(&$variables) {
 
   $variables['options'] = $toc->getOptions();
 
+  // Add default classes.
+  $variables['attributes']['class'] = (array) $variables['attributes']['class'];
+  $variables['attributes']['class'][] = 'toc';
+  $variables['attributes']['class'][] = 'toc-tree';
+
   $variables['attributes'] = new Attribute($variables['attributes']);
 
   $variables['#attached']['library'][] = 'toc_api/toc.tree';