Providing blocks

In order to provide blocks that render into custom elements, for example for using as part of the Layout Builder, the block cannot directly return a custom element object, since its interface requires a render array. Instead, simply return the custom element as render array via its helper toRenderArray(). When done so, the custom element is going to be picked up correctly when the layout is rendered.

Example block


/**
 * Provides an example news listing block.
 *
 * @Block(
 *   id = "lupus_decoupled_drupal_example_news_listing",
 *   admin_label = @Translation("Example news listing"),
 *   category = @Translation("Custom")
 * )
 */
class ExampleNewsListingBlock extends BlockBase {

  /**
   * {@inheritdoc}
   */
  public function build() {
    $articles[] = CustomElement::create('article-teaser')
      ->setAttribute('href', 'https://example.com/news/1')
      ->setAttribute('excerpt', 'The excerpt of the news entry.');
    $articles[] = CustomElement::create('article-teaser')
      ->setAttribute('href', 'https://example.com/news/2')
      ->setAttribute('excerpt', 'The excerpt of another news entry.');

    $teaser_listing = CustomElement::create('teaser-listing')
      ->setAttribute('title', 'Latest news')
      ->setAttribute('icon', 'news')
      ->setSlotFromNestedElements('default', $articles);

    // Return the custom element as render array to fulfill the interface.
    return $teaser_listing->toRenderArray();
  }

}