feat: #3617500 Add the header search bar and the search results view component

Issue: #3617500 Add the header search bar and the search results view component

What this changes

Icon Toggle — Bootstrap 5.3's Dropdown now owns the disclosure (show/hide, aria-expanded, Escape, outside click, focus return, Popper flip/shift), so the component asks for vartheme_bs5_educare/bs-dropdown-script and keeps only what Bootstrap does not do: swapping the trigger icon, focusing the panel's field, and the geometry of the new panel style. Two new props:

• panel: popover (boxed panel under the button) or bar (an inline bar on one hairline-underlined line carrying the icon, the field and its own close button).
• expand_in_editor: hold the panel open inside the Drupal Canvas editor preview so its content slot stays reachable for dropping components into.

icon-toggle.stories.json loses a leaked local Storybook server URL and gets the themes/custom/vartheme_bs5_educare story path every other component in this theme already uses.

Views view search — a new organism printing the same variables as the Views view component in the order a results page reads best: the view title as the page <h1>, then the exposed filter bar, then the summary the view header carries, then the rows. An empty result set becomes a bordered notice on the theme's subtle surface. templates/views/views-view--search--page.html.twig includes it.

The filter bar is the theme's own Views exposed filters component, so the results page and the listing pages share one exposed-filter skin.

Views exposed filters — the free-text filter was matched only on form-item-search, the class a listing produces because its filter is named after its own field. A site search view names its filter keywords and produces form-item-keywords, so the field neither grew to fill the row nor carried the search icon. The free-text widget is matched as well, and the actions take the full row width below md alongside the other controls.

The field's label in the bar. The bar already removed the submit button visually while keeping it in the tab order; the field's label is now removed the same way. The bar's icon and placeholder carry it on the line, and the label stays in the accessibility tree — without it the search input has no accessible name on every page of a site that places this component in its header.

Verified

On a Varbase 11 install of the Educare site template, from a dropped database:

• header toggle 40×40, aria-expanded="false", panel display: none at rest; opening it gives a 720×42 inline bar on the header's own line, header height unchanged at 74px, the field focused, the main navigation still rendered
• results page: exactly one <h1>, the filter bar between it and the result summary, keyword field growing to 1210px with the search icon, ghost submit (transparent background, #050833, no border, font-weight: 700, zero padding) on the same line
• rows: one <h2> and one <a> each, uniform 48px spacing, pager present
• empty state: 17.48 contrast (AAA)
• the Events / News / Programs listings render unchanged
• 0 console errors, 0 errors logged
• below lg (390×844): brand, toggle and hamburger on one 62px row; opening gives a full-width band under the header, header height unchanged

Functional coverage for these components is the 12-search suite in Educare #3617501 / MR !34 — 16 scenarios, 85 steps, all passing, alongside that project's accessibility suite at 69/69. They can only be exercised through a site template that places them, and this theme's own CI job installs the Educare recipe, so it picks them up once that MR lands.

Checkpoints:

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

AI-Generated: Yes