AppHeader examples using `slot` property

[ArakTaiRoth]

Info

Reported by Alex T

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

This works fine in Angular because Angular correctly identifies slot as a global property available on all components. React however does not make this same identification and triggers an error on build, because the slot property isn't actually placed on the component in the wrapper.

This was discussed here briefly in a PR.

Workaround

There is a workaround for this right now. People can surround the component using the slot property with a div using that same property and all of this will work as intended.

Acceptance Criteria:

1. Rewrite AppHeader to allow named properties that function as slots as our other components currently use
2. The examples may or may not need to be changed to reflect the new way

[vanessatran-ddi]

I updated the code snippet on the website to use div for React

cc @ArakTaiRoth and @twjeffery FYI