Skip to content

fix(#3762): AppHeader Slots#3909

Open
willcodeforcoffee wants to merge 1 commit into
devfrom
eric/bug3762-AppHeader-slots
Open

fix(#3762): AppHeader Slots#3909
willcodeforcoffee wants to merge 1 commit into
devfrom
eric/bug3762-AppHeader-slots

Conversation

@willcodeforcoffee
Copy link
Copy Markdown
Collaborator

@willcodeforcoffee willcodeforcoffee commented May 5, 2026

Before (the change)

Our AppHeader examples are using a slot property on some of our components, design.alberta.ca/components/app-header#tab-1, specifically, the Header with Navigation example.
See:

  1. https://design.alberta.ca/components/app-header/
  2. https://design.alberta.ca/examples/header-with-navigation/

After (the change)

Several changes have been made to make these controls more consistent with other controls.

  • React: Added props for banner, phase, navigation, and utilities slots.
  • Angular: Added template attributes for banner, phase, navigation, and utilities slots.
  • Renamed Angular files from header to app-header and header-menu to app-header-menu
  • All React and Angular examples updated to use appropriate prop/templates
  • Other documentation updated as well

Backward compatibility with slots is maintained.

Make sure that you've checked the boxes below before you submit the PR

  • I have read and followed the setup steps
  • I have created necessary unit tests
  • I have tested the functionality in both React and Angular.

Steps needed to test

  • backward compatibility maintained
  • props for React components work as expected
  • templates for Angular components work as expected
  • documentation is correct and makes sense

@willcodeforcoffee willcodeforcoffee force-pushed the eric/bug3762-AppHeader-slots branch from 681a117 to c525784 Compare May 8, 2026 15:55
@willcodeforcoffee willcodeforcoffee changed the base branch from main to dev May 8, 2026 16:13
@github-actions
Copy link
Copy Markdown

github-actions Bot commented May 8, 2026

PR Preview Action v1.8.1

QR code for preview link

🚀 View preview at
https://GovAlta.github.io/ui-components/pr-preview-angular/pr-3909/

Built to branch gh-pages at 2026-05-11 20:10 UTC.
Preview will be ready when the GitHub Pages deployment is complete.

@github-actions
Copy link
Copy Markdown

github-actions Bot commented May 8, 2026

Preview links

Target URL
Docs https://govalta.github.io/ui-components/pr-preview/pr-3909/
React playground https://govalta.github.io/ui-components/pr-preview-react/pr-3909/
Angular playground https://govalta.github.io/ui-components/pr-preview-angular/pr-3909/

Built from commit 8685814. Previews are removed automatically when this PR closes.

@willcodeforcoffee willcodeforcoffee force-pushed the eric/bug3762-AppHeader-slots branch from 524280a to 8685814 Compare May 11, 2026 20:07
@willcodeforcoffee willcodeforcoffee self-assigned this May 11, 2026
@willcodeforcoffee willcodeforcoffee added Bug Something isn't working P2 Priority 2 (should have): Improves completeness and reduces the post-launch support load. labels May 11, 2026
@willcodeforcoffee willcodeforcoffee marked this pull request as ready for review May 11, 2026 20:32
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Bug Something isn't working P2 Priority 2 (should have): Improves completeness and reduces the post-launch support load.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant