You are here

form-element.html.twig in Drupal 10

Theme override for a form element.

@todo Remove when https://www.drupal.org/node/3010558 is fixed.

File

core/themes/claro/templates/form-element.html.twig
View source
  1. {#
  2. /**
  3. * @file
  4. * Theme override for a form element.
  5. *
  6. * @todo Remove when https://www.drupal.org/node/3010558 is fixed.
  7. *
  8. * @see template_preprocess_form_element()
  9. */
  10. #}
  11. {#
  12. Most of core-provided js assumes that the CSS class pattern js-form-item-[something] or
  13. js-form-type-[something] exists on form items. We have to keep them.
  14. #}
  15. {%
  16. set classes = [
  17. 'js-form-item',
  18. 'form-item',
  19. 'js-form-type-' ~ type|clean_class,
  20. 'form-type--' ~ type|clean_class,
  21. type in ['checkbox', 'radio'] ? 'form-type--boolean',
  22. 'js-form-item-' ~ name|clean_class,
  23. 'form-item--' ~ name|clean_class,
  24. title_display not in ['after', 'before'] ? 'form-item--no-label',
  25. disabled == 'disabled' ? 'form-item--disabled',
  26. errors ? 'form-item--error',
  27. ]
  28. %}
  29. {%
  30. set description_classes = [
  31. 'form-item__description',
  32. description_display == 'invisible' ? 'visually-hidden',
  33. ]
  34. %}
  35. <div{{ attributes.addClass(classes) }}>
  36. {% if label_display in ['before', 'invisible'] %}
  37. {{ label }}
  38. {% endif %}
  39. {% if prefix is not empty %}
  40. <span class="form-item__prefix{{disabled == 'disabled' ? ' is-disabled'}}">{{ prefix }}</span>
  41. {% endif %}
  42. {% if description_display == 'before' and description.content %}
  43. <div{{ description.attributes.addClass(description_classes) }}>
  44. {{ description.content }}
  45. </div>
  46. {% endif %}
  47. {{ children }}
  48. {% if suffix is not empty %}
  49. <span class="form-item__suffix{{disabled == 'disabled' ? ' is-disabled'}}">{{ suffix }}</span>
  50. {% endif %}
  51. {% if label_display == 'after' %}
  52. {{ label }}
  53. {% endif %}
  54. {% if errors %}
  55. <div class="form-item__error-message">
  56. {{ errors }}
  57. </div>
  58. {% endif %}
  59. {% if description_display in ['after', 'invisible'] and description.content %}
  60. <div{{ description.attributes.addClass(description_classes) }}>
  61. {{ description.content }}
  62. </div>
  63. {% endif %}
  64. </div>