3 namespace Drupal\Core\Render\Element;
5 use Drupal\Core\Render\Element;
8 * Provides a render element for a details element, similar to a fieldset.
10 * Fieldsets can only be used in forms, while details elements can be used
11 * outside of forms. Users click on the title to open or close the details
12 * element, showing or hiding the contained elements.
15 * - #title: The title of the details container. Defaults to "Details".
16 * - #open: Indicates whether the container should be open by default.
21 * $form['author'] = array(
22 * '#type' => 'details',
23 * '#title' => $this->t('Author'),
26 * $form['author']['name'] = array(
27 * '#type' => 'textfield',
28 * '#title' => $this->t('Name'),
32 * @see \Drupal\Core\Render\Element\Fieldset
33 * @see \Drupal]Core\Render\Element\VerticalTabs
35 * @RenderElement("details")
37 class Details extends RenderElement {
42 public function getInfo() {
43 $class = get_class($this);
48 [$class, 'processGroup'],
49 [$class, 'processAjaxForm'],
52 [$class, 'preRenderDetails'],
53 [$class, 'preRenderGroup'],
55 '#theme_wrappers' => ['details'],
60 * Adds form element theming to details.
63 * An associative array containing the properties and children of the
67 * The modified element.
69 public static function preRenderDetails($element) {
70 Element::setAttributes($element, ['id']);
72 // The .js-form-wrapper class is required for #states to treat details like
74 static::setAttributes($element, ['js-form-wrapper', 'form-wrapper']);
76 // Collapsible details.
77 $element['#attached']['library'][] = 'core/drupal.collapse';
79 // Open the detail if specified or if a child has an error.
80 if (!empty($element['#open']) || !empty($element['#children_errors'])) {
81 $element['#attributes']['open'] = 'open';
84 // Do not render optional details elements if there are no children.
85 if (isset($element['#parents'])) {
86 $group = implode('][', $element['#parents']);
87 if (!empty($element['#optional']) && !Element::getVisibleChildren($element['#groups'][$group])) {
88 $element['#printed'] = TRUE;