Introducing the UI Patterns module: use atomic UI components everywhere in Drupal 8

In this session we will show how the UI Patterns module allows you to define and expose self-contained UI patterns as Drupal 8 plugins and to use them as drop-in templates for panels, field groups, views, Display Suite view modes, field templates, etc.

Over the past years projects like PatternLab or the Component Libraries module aimed at lowering the cost of maintaining and re-using UI patterns in your projects. But, as we all know, when it comes to presenting content the Drupal 8 landscape is quite diverse: you can layout your pages using Panels or Views, style your entities using Display Suite view modes, group your fields with Field group, etc. Such a diversification can surely present some challenges when it comes at reusing a well-designed and consistent UI library. The UI Patterns module makes it possible to seamlessly use UI patterns with views, layouts, field formatters, etc.

The session will also feature a brief live-demo of the following functionalities:

• Define and preview patterns using YAML via the built-in Pattern Library module
• Organise patterns into self-contained bundles of JavaScript, CSS and TWIG templates
• Expose PatternLab and Fractal patterns to Drupal
• Use patterns as layouts with Paragraphs, Panels and Display Suite
• Use patterns as field group templates with the Fieldgroup module
• Use patterns as Views row templates
• Use patterns as entity field templates
• Use patterns with the Bricks module
• Advanced topic: a closer look to UI Patterns internals