#3528288 "Implement media library widget style"

Screenshots

Default

Screenshot_2025-07-01_at_8.04.18_AM

With weights visible (see next section for details)

Screenshot_2025-07-01_at_8.04.30_AM

Finite Items (see next section for details)

Screenshot_2025-07-01_at_8.04.46_AM

Where the design was deviated from

  • The design did not include weight toggle / weight input / remove button which were are all necessary controls, so those were added with just enough styling to be useable+coherent but no assumption it is the actual design.
  • In the design the "x items remaining" for finite -item message has different wording and the counts bolded. To reword this message and wrap the numbers to make them bold-able, we'd need to either override \Drupal\media_library\Plugin\Field\FieldWidget\MediaLibraryWidget::formElement or have a form alter do some trickiness to extract the numbers from the message to wrap them and grab the cardinality from elsewhere in the array. It can be done but I'd like to first see if the wording difference was deliberate enough to justify this level of customization.

Added xb- prefixed custom elements

Mapping render arrays to React Components via the Semi Coupled Theme Engine requires several steps with several places things can go wrong. It's a necessary step to achieve valuable functionality, but in some cases it seemed like overkill. Why go through this elaborate mapping for multiple media library templates for use cases where it's only necessary to run the content through the Radix <Theme>. For this, I created the <xb-text> and <xb-box> custom elements to be used in Twig, which map to Radix Text and Box components. This can be expanded as needed and it can even be used for "dropping in" complex React components inside Twig templates.

Notes for reviewer

This is scoped to the styling of the media library widget. If you run into functionality concerns, see if the same issues occur in 0.x. If it is also happening in 0.x and confirmed it's not expected/known, file an issue for what you've discovered. If it is NOT occurring in 0.x and appears to be introduced by this MR, then that's a change to be made here prior to committing.

Edited by Ben Mullins

Merge request reports

Loading