Idea summary
What is the problem to solve?
Component-based design/implementation is an evolving-best practice for front-end development, whereby individual components are created one-by-one (header, footer, card display mode, accordion, etc) and packaged with all their frontend assets in one place (twig template, (s)css, js). See Driesnote from DrupalCon Dublin (I think, it was Dublin).
At the moment, if a developer creates these components as standalone items (using PatternLab, Fractal, or some other system), there is no way for Drupal to have knowledge of them. This means (at a minimum) the twig files need to be duplicated into the Drupal /templates folder of the current theme, leading to duplication of code, and some sort of gulp task or otherwise getting the CSS and JS assets to the Drupal theme and other extra maintenance. It means that it is much more difficult to maintain living styleguides created by PatternLab or KSS or a custom system.
With the advent of the 'Out of the Box' initiative, there is going to be
a new theme in Drupal core โ
. The developers of this theme (I am one of these) will be builing this with best-practice in mind and are aiming to build a styleguide into the theme, using component-based design principles. Having a way to reference components would make this much easier for us (and any developer in the future who wishes to use component-based design in their custom or contrib themes, opening up many new avenues to Drupal front-end development). It would also mean that contrib themes would not need to depend on a contrib module.
It might also help
Unify & simplify render & theme system: component-based rendering (enables pattern library, style guides, interface previews, client-side re-rendering) โ
.
Though quite a small module (it does one thing, and does it well!), it would open up/encourage a lot of new frontend possibilities.
Who is this for?
This is a utility tool for front-end developers.
Result: what will be the outcome?
The components module allows Drupal to reference twig files outside of the /templates folder, making component-based design much easier and more maintainable for developers.
How can we know the desired result is achieved?
As long as we can reference templates outside of the theme's /templates folder we know the result has been achieved.