Motivation

It would be neat if Component Library could override templates without the use of additional modules.

Proposed resolution

The pluggable patterns patch introduced the ability to override theme components without the use of additional modules like ui_patterns. This merge request uses that patch as a starting point to override templates from within Component Library. In an effort to not mess up the Pattern + Variant entities that Component Library uses with ui_patterns, how about we add a Component Override entity and plugins that focus on just overriding things?

User interface changes

  • Adds a Component Override section to the theme settings page.

Data model changes

  • Adds a Component Override entity.

Testing

  • On a fresh install, add an Article and then enable component_library.
  • Navigate Appearance > Settings (on the active theme) and click the "Add component override" button on the theme settings page.
  • Fill out the following:
    • Label: Article
    • Theme: Bartik
    • Plugin: Content
    • Bundle: Article
    • View mode: Default
    • Override: node__article
    • Tweak the template.
  • Click "Save", and reload the article.

Please see the demo.

Component Override UI

Remaining tasks

  • ¯\_(ツ)_/¯
CommentFileSizeAuthor
#9 2022-01-28_16-39.png158.62 KBheddn
#7 component-override-variables.gif10.2 MBtim bozeman
#7 component-override-variables.mp437.33 MBtim bozeman
#3 component-override.gif2.62 MBtim bozeman
#3 component-override-ui.png184.38 KBtim bozeman
#3 component-override.mov8.75 MBtim bozeman

Issue fork component_library-3259011

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

About issue forks

Comments

Tim Bozeman created an issue. See original summary.

Tim Bozeman opened merge request !1

tim bozeman’s picture

tim bozeman commented
Issue summary: View changes
StatusFileSize
new component-override.mov8.75 MB
new component-override-ui.png184.38 KB
new component-override.gif2.62 MB
tim bozeman’s picture

tim bozeman commented
Title: Make Component Library self sufficient » Add Component Overrides

s_leu made their first commit to this issue’s fork.

tim bozeman’s picture

tim bozeman commented
Issue summary: View changes
tim bozeman’s picture

tim bozeman commented
Issue summary: View changes
StatusFileSize
new component-override-variables.mp437.33 MB
new component-override-variables.gif10.2 MB

The pluggable patterns patch overrode the theme registry functions for preprocessing variables and rendering the template. Lets try a twig loader and use events for preparing variables and theme suggestions.

heddn made their first commit to this issue’s fork.

heddn’s picture

heddn
Primary language English
Location Illinois
commented
Status: Active » Needs work
StatusFileSize
new 2022-01-28_16-39.png158.62 KB

After loading admin/appearance/settings/{{theme}}/component-library/override/add

I got:

tim bozeman’s picture

tim bozeman commented

Thanks for the git fu @heddn!

@s_leu I added this tweak that limits the extension listing to installed extensions to address #9. Will that work?

s_leu’s picture

s_leu commented

I added this tweak that limits the extension listing to installed extensions to address #9. Will that work?

Regarding #10, thanks @Tim Bozeman, that change certainly makes sense.

tim bozeman’s picture

tim bozeman commented
Status: Needs work » Needs review

This is probably a good stopping point for the foundational part. Whatcha think?

heddn’s picture

heddn
Primary language English
Location Illinois
commented
Status: Needs review » Fixed

Thanks for your collaboration on this work.

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.