Problem/Motivation

Varbase Starter ships exported Drupal Canvas component configuration for the Vartheme BS5 components. Five of those files pin the icon prop to field_type: list_string with field_widget: options_select:

  • config/canvas.component.sdc.vartheme_bs5.button.yml
  • config/canvas.component.sdc.vartheme_bs5.badge.yml
  • config/canvas.component.sdc.vartheme_bs5.icon.yml
  • config/canvas.component.sdc.vartheme_bs5.card-icon.yml
  • config/canvas.component.sdc.vartheme_bs5.icon-toggle.yml

Every stored version in those files carries allowed_values_function: canvas_load_allowed_values_for_component_prop, which reads the prop's enum from the theme at runtime. When the theme's prop no longer declares an enum, the callback throws and the component's edit form returns HTTP 500:

LogicException: `enum` is missing for schema of `icon` explicit input prop of `sdc.vartheme_bs5:icon-toggle`.

Published pages still render. It is editing that breaks.

Vartheme BS5 #3619736 (MR !205) adopts the Canvas Icon Picker and removes the enum from bootstrap-icon and icon-toggle. Measured on a clean Varbase 11 install with the Varbase Starter site template, with that change applied:

  • Before the change: 0 of 11 stale versions would 500.
  • After removing the two enums: 2 of 11 would 500, both icon-toggle (c42c2d3c, 5a87298f).

icon-toggle is the one that matters most, because config/canvas.page_region.vartheme_bs5.header.yml pins it, so it appears on every page of a new site.

Verified on Drupal core 11.4.5, PHP 8.4.20, Drupal Canvas 1.10.1, UI Icons 1.1.2, and Canvas Icon Picker 1.0.3 with the merged #3619510 fix.

Steps to reproduce

  1. Install Drupal 11.4 on Varbase 11 and pick the Varbase Starter site template.
  2. Apply Vartheme BS5 #3619736, which removes the enum from the Icon Toggle component's icon prop.
  3. Open any page in the Drupal Canvas editor and select the Icon Toggle component in the header region.
  4. The component edit form returns HTTP 500 with the LogicException above. The rendered page is unaffected.

Proposed resolution

Re-export the five shipped component configuration files so the icon prop carries the shape Drupal Canvas generates for a prop that declares x-canvas-icon, in every versioned_properties entry including active:

  • field_type: string with an empty field_storage_settings, instead of list_string with allowed_values_function.
  • field_widget: canvas_icon_picker instead of options_select.
  • field_instance_settings holding allowed_icon_pack: [bootstrap_icons].
  • expression: ℹ︎string␟value, to match the new field type.
  • canvas_icon_picker added to each file's dependencies.module.

The shape is read from the active configuration Drupal Canvas itself generates on a site where the picker is in place, not hand-written. default_value, required, every other prop and every version hash are unchanged.

Because the configuration now names the canvas_icon_picker widget, the module has to be present and installed for the recipe to import at all: drupal/canvas_icon_picker is added to composer.json and canvas_icon_picker to the recipe's install list. Without those two lines the recipe fails on a stock install instead of 500ing later.

This should land with or before Vartheme BS5 #3619736. If the theme change ships first, new Varbase Starter sites get a 500 on the header component's edit form until this follows.

Remaining tasks

  • ✅ File an issue
  • ✅ Addition/Change/Update/Fix
  • ✅ Testing to ensure no regression
  • ➖ Automated unit/functional testing coverage
  • ➖ Developer Documentation support
  • ➖ User Guide Documentation support
  • ➖ UX/UI designer responsibilities
  • ➖ Accessibility and Readability
  • ❌ Reviewed by a human
  • ❌ Code review by maintainers
  • ❌ Full testing and approval
  • ❌ Credit contributors
  • ❌ Review with the product owner
  • ❌ Update Release Notes
  • ❌ Release

User interface changes

  • The icon prop of Button, Badge, Icon, Card Icon and Icon Toggle is edited with the Canvas icon picker instead of a select list.

API changes

  • N/A

Data model changes

  • The icon prop is stored as a string field instead of a list_string field. Values stay the bare Bootstrap icon ids already in use.

Release notes snippet

  • Fixed a HTTP 500 on the Drupal Canvas component edit form when a Vartheme BS5 icon prop no longer declares an enum, by re-exporting the five shipped icon component configurations for the Canvas Icon Picker.

AI-Generated: Yes

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:

Comments

rajab natshah created an issue. See original summary.

rajab natshah’s picture

Issue summary: View changes

  • rajab natshah committed 32636c8d on 1.0.x
    fix: #3619772 Re-export the Vartheme BS5 icon component config for the...
rajab natshah’s picture

Issue summary: View changes

  • rajab natshah committed bfbeb5ab on 1.0.x
    fix: #3619772 Re-export the icon component config for the whole...
rajab natshah’s picture

Status: Active » Fixed

Now that this issue is closed, review the contribution record.

As a contributor, attribute any organization that helped you, or if you volunteered your own time.

Maintainers, credit people who helped resolve this issue.

Status: Fixed » Closed (fixed)

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