No Markup

This module aims to help integration with component libraries. Map the Twig templates in your component library to the field data, without the field markup.

Consider the following integration of a content type with the 10f component:

{% embed '@components/06-module-f/10-10f/10f.twig' with {
  node_id: node.id,
  headline: content.field_band_headline,
  subhead: content.field_band_subheader,
  promos: content.field_band_promo_ref|children,
} %}

  {% block component %}
    {{ promo }}
  {% endblock %}

{% endembed %}

The template 10f.twig expects headline and subhead to be the editorial data... but they contain markup.

Usage

Use No Markup to remove all the cruft without weakening your security.

Edit the display mode and Remove field markup for field_band_headline and field_band_subheader. After this the Twig variable content.field_band_headline will only contain the field value, without the wrapping markup. Just the field formatter HTML: plain string for text fields, <a> tag for link fields, ...

Why not striptags/raw instead?

Without this module one can use:

  headline: content.field_band_headline|render|striptags|trim,

This is problematic due to the double rendering involved. So if the headline were Foos&Bars for example, it would render as Foos&amp;Bars.

Another alternative is using the field data directly from Twig.

  headline: node.field_band_headline['#items'][0].value

This can lead to security problems as the user input data is not properly sanitized by the input filters in the render pipeline.