Pinto: Native Components

Pinto is a way of defining frontend components with plain PHP. Define components as simple classes, and let Pinto do the rest. Works well with controller/render-arrays, blocks, layouts, entity displays, etc. No fussing with YAML. Some say its a nicer alternative to SDC. Helpers are provided to replicate a "single directory" setup, wherein PHP, Twig, CSS, JS are colocated.

Pinto Documentation

Example

Component class

namespace Drupal\my_site_ds;

class MyComponent {

  use Drupal\pinto\Object\DrupalInvokableSlotsTrait;

  public function __construct(
    public string $str,
    public int $number,
  ) {
  }
  
}

Template

{{ str }}
{{ number }}

Usage

(new MyComponent(
  str: 'Hello world',
  number: 123,
))();

Project

Pinto has adopted zerover. To inspire confidence, you'll find both the Drupal Pinto project and Pinto PHP library have great test coverage, code coverage, and [level 9 PHPStan] static analysis.

Development of core Pinto features happen on GitHub, while the Drupal integration happens on Drupal.org. Each of these projects are completely independent, while the Drupal integration has a dependency on the library.

See also:

• https://www.drupal.org/project/pinto_block
• https://www.drupal.org/project/pinto_entity
• https://www.drupal.org/project/pinto_layout
• https://www.drupal.org/project/pinto_theme

Documentation

Official documentation is available at https://pinto.docs.contrib.social/

Read the blog posts on Pinto:

• Next level theming with Pinto by @acbramley on PreviousNext
• Entity theming with Pinto by @acbramley on PreviousNext