This module allows developers to preprocess components props and slots before they reach templates. It is designed solely to be used with the SDC Display module.

The module is currently in an experimental state but is functional.

Features

This module follows the principles of SDC; All files necessary for a component are kept within the component's directory.

When choosing to render an entity or field as a component, you can alter props and slots before they reach templates by adding preprocess files directly within the component's directory.

Entities

Preprocess files are loaded from <your_theme>/components/<directory>/<component>/preprocess/entity.

The file nomenclature is the following:

ENTITY-TYPE-ID.php
ENTITY-TYPE-ID--BUNDLE.php
ENTITY-TYPE-ID--BUNDLE--VIEW-MODE.php

For a node of type basic_page, one of the following three files can be created:

  • <your_theme>/components/<directory>/<component>/preprocess/entity/node.php
  • <your_theme>/components/<directory>/<component>/preprocess/entity/node--basic-page.php
  • <your_theme>/components/<directory>/<component>/preprocess/entity/node--basic-page--VIEW-MODE.php

And below are example file contents.

/**
 * @file
 * Preprocess override for a component that is used to render an entity.
 *
 * Here you can modify props and slots before they are sent to the component
 * template.
 *
 * The loading of this file is provided by the SDC Display Preprocess module.
 * @see sdc_display_preprocess.module
 *
 * Available variables:
 * @var array $props
 *   The props array that will be sent to the component template.
 *   Any modifications here will be sent to templates.
 * @var array $slots
 *   The slots array that will be sent to the component template.
 *   Any modifications here will be sent to templates.
 * @var array $build
 *   The entity's render array.
 *   Any modifications here will be sent to templates.
 * @var \Drupal\Core\Entity\EntityInterface $entity
 *   The original entity being rendered.
 * @var \Drupal\Core\Entity\Display\EntityViewDisplayInterface $display
 *   The entity view display.
 */

// Preprocess your variables here.
$props['foo'] = 'newProp';
$slots['bar'] = 'newSlot';

Altering the $props and $slots arrays will directly modify the resulting props and slots in the component's template for the given entity, bundle and view mode.

Fields

Fields work the same way. Files are loaded from <your_theme>/components/<directory>/<component>/preprocess/field.

FIELD-MACHINE-NAME--ENTITY-TYPE-ID.php
FIELD-MACHINE-NAME--ENTITY-TYPE-ID--VIEW-MODE.php
FIELD-MACHINE-NAME--ENTITY-TYPE-ID--BUNDLE.php
FIELD-MACHINE-NAME--ENTITY-TYPE-ID--BUNDLE--VIEW-MODE.php

For a field with the machine name field_headline, one of the following files can be created:

  • <your_theme>/components/<directory>/<component>/preprocess/field/field-headline--node.php
  • <your_theme>/components/<directory>/<component>/preprocess/field/field-headline--node--VIEW-MODE.php
  • <your_theme>/components/<directory>/<component>/preprocess/field/field-headline--node--basic-page.php
  • <your_theme>/components/<directory>/<component>/preprocess/field/field-headline--node--basic-page--VIEW-MODE.php

The file is similar, however since fields can have multiple values, components are stored in an item list. Therefore, the code in that file will look like the following:

/**
 * @file
 * Preprocess override for a component that is used to render a field value.
 *
 * Here you can modify props and slots before they are sent to the component
 * template.
 *
 * The loading of this file is provided by the SDC Display Preprocess module.
 * @see sdc_display_pp.module
 *
 * Available variables:
 * @var array $items
 *   The field items. Any modifications here will be sent to templates.
 * @var array $variables
 *   The original preprocess variables for the field.
 */

// Preprocess your variables here.
foreach ($items as $item) {
  $item['content']['#props']['foo'] = 'newProp';
  $item['content']['#slots']['bar'] = 'newSlot';
}

Project information

Releases