civictheme 1.11.0

CivicTheme 1.11.0 converts CivicTheme's component system to Single Directory Components.

ChangeLog

-[#3515220] Convert CivicTheme components to use Single Directory Components
- [#3526584] Create script to convert existing components to SDC components
- [#3525675] SDC - Investigate CT callout CSS specifity issue
- [#3525673] SDC - Back to Top button in Drupal theme has lost white border
- [#3526227] Shipshape requirements have updated
- [#3505931] Group filter theme is not being updated properly with Automated list theme
- [#3518669] Search displays least relevant search results first
- [#3525687] Add documentation to upgrade existing CivicTheme for GovCMS SaaS
- [#3522109] Remove legacy IE10 font
- [#3500869] Call to a member function setSyncing() on null if Drupal view is removed and post_update hook is run
- [#3516354] Update update script to automatically find CivicTheme directory
- [#3522101] Exception thrown when filter label is not set in automated list
- [#3522098] Add passing of the CSS class from view display to a template for Automated List
- [#3520948] Remove Shortcut from theme dependency
- [#3520413] Fix lint standards in CivicTheme
- [#3518342] hook_civictheme_automated_list_view_info_alter example's content type is misleading

Major Architectural Changes

Component Extension Model has changed to match SDC extensions

- Removed: Direct extension of CivicTheme base components in sub-themes
- Supported inheritance types:
- ✅ Custom components in sub-theme
- ✅ Override CivicTheme components completely
- ❌ Extend CivicTheme components partially

Single Directory Components Architecture

- Components bundle HTML, CSS, and JS in single directories
- Converted to use Single Directory Component framework
- CivicTheme components utilse an automated component validation system (within the UI Kit development repository)

See here for an overview of SDC (https://www.drupal.org/docs/develop/theming-drupal/using-single-director...)

UI Kit Enhancements

- Dual component library support (Twig + SDC)
- Separate Storybooks for each component type
- Visual regression testing between Twig and SDC components
- Shared test infrastructure across component types

Twig namespaces for CivicTheme has with SDC

From:

{% include '@atoms/paragraph/paragraph.twig' with {
  theme: theme,
  content: panel.content,
  allow_html: true,
  modifier_class: 'ct-accordion__panels__panel__content__inner',
} only %}

To:

{% include 'civictheme:paragraph' with {
  theme: theme,
  content: panel.content,
  allow_html: true,
  modifier_class: 'ct-accordion__panels__panel__content__inner',
} only %}

```

See migration guide below for how to upgrade your sub-theme components.

Migration Guide

For new sites, there is no migration needed, just install CivicTheme.

For existing sites, custom components need to be updated. We are providing a custom script to assist you with this upgrade.

Update script

The Update Script Repository
provides a script to update your sub-theme to use the required storybook configuration, updates your SASS tools and provides an AI script to make an attempt at converting your existing custom components to Single Directory Components.

Before using the script please read the README.md and follow the instructions on how to use.

If you do not wish to run the AI script you can manually update the script and remove https://github.com/civictheme/upgrade-tools/blob/main/sdc-update/src/update-runner.mjs#L34 (and add a dummy API key in to satisfy validation).

Note: Special care is needed for sites with extended components, these end to be manually migrated, this process is not difficult just needs more thought than can be provided through a script.