@abgov/react-components 7.2.0-dev.20 → 7.2.0-dev.21

package/lib/app-header/app-header.d.ts

@@ -1,4 +1,4 @@
-import { JSX } from 'react';
+import { ReactNode, JSX } from 'react';
 import { DataAttributes } from '@abgov/ui-components-common';
 interface WCProps {
     heading?: string;
@@ -22,7 +22,7 @@ declare module "react" {
 export interface GoabAppHeaderProps extends DataAttributes {
     /** Set the service name to display in the app header. */
     heading?: string;
-    /** V2 only: Secondary text displayed under the service name. */
+    /** Secondary text displayed under the service name. */
     secondaryText?: string;
     /** Set the URL to link from the alberta.ca logo. A full url is required. */
     url?: string;
@@ -31,12 +31,20 @@ export interface GoabAppHeaderProps extends DataAttributes {
     /** Sets the breakpoint in px for the full menu to display. */
     fullMenuBreakpoint?: number;
     /** Content rendered inside the app header, typically navigation links. */
-    children?: React.ReactNode;
+    children?: ReactNode;
     /** Callback fired when the menu button is clicked. When provided, clicking the menu button dispatches a custom event instead of toggling the menu. */
     onMenuClick?: () => void;
     /** Sets a data-testid attribute for automated testing. */
     testId?: string;
+    /** Banner content displayed above the header. */
+    banner?: ReactNode;
+    /** Phase badge content displayed beside the service name. */
+    phase?: ReactNode;
+    /** Links and app header menus appear in the navigation bar below the header. Use plain links for single items and app header menu for grouped items with a dropdown. */
+    navigation?: ReactNode;
+    /** Actions like user account menus appear on the right side of the header. Use menu button for dropdowns with actions. */
+    utilities?: ReactNode;
 }
 /** Provide structure to help users find their way around the service. */
-export declare function GoabAppHeader({ onMenuClick, children, secondaryText, ...rest }: GoabAppHeaderProps): JSX.Element;
+export declare function GoabAppHeader({ onMenuClick, children, secondaryText, banner, phase, navigation, utilities, ...rest }: GoabAppHeaderProps): JSX.Element;
 export {};

package/lib/app-header-menu/app-header-menu.d.ts

@@ -19,7 +19,7 @@ export interface GoabAppHeaderMenuProps extends DataAttributes {
     leadingIcon?: GoabIconType;
     /** Sets a data-testid attribute for automated testing. */
     testId?: string;
-    /** Slot name used to place this menu in the correct slot of the parent component. */
+    /** @deprecated Sets the slot name for the component. Deprecated: use AppHeader navigation prop instead. */
     slotName?: string;
     /** Content rendered inside the menu dropdown, typically navigation links. */
     children?: ReactNode;

package/lib/dropdown/dropdown-item.d.ts

@@ -1,3 +1,4 @@
+import { ReactNode } from 'react';
 import { GoabDropdownItemMountType } from '@abgov/ui-components-common';
 interface WCProps {
     value: string;
@@ -18,17 +19,19 @@ export interface GoabDropdownItemProps {
     value: string;
     /** Display label for the dropdown item. */
     label?: string;
-    /** Text used to filter and match this item in typeahead search. */
+    /** Rich item content. On selection, `label` is shown and `filter` defaults to the content's text. */
     filter?: string;
     /** Sets a data-testid attribute for automated testing. */
     testId?: string;
     /** Controls how the item is registered with the parent dropdown. */
     mountType?: GoabDropdownItemMountType;
+    /** Rich content rendered for this item in the dropdown menu. When set, `label` is shown in the dropdown input on selection and `filter` defaults to the content's text. */
+    children?: ReactNode;
     /** @deprecated */
     name?: string;
 }
 /** Present a list of options to the user to select from. */
 export declare function GoabDropdownOption(props: GoabDropdownItemProps): import("react/jsx-runtime").JSX.Element;
 /** Present a list of options to the user to select from. */
-export declare function GoabDropdownItem({ value, label, filter, name, mountType, }: GoabDropdownItemProps): import("react/jsx-runtime").JSX.Element;
+export declare function GoabDropdownItem({ value, label, filter, name, mountType, children, }: GoabDropdownItemProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abgov/react-components",
-  "version": "7.2.0-dev.20",
+  "version": "7.2.0-dev.21",
   "description": "Government of Alberta - UI components for React",
   "bugs": {
     "url": "https://github.com/GovAlta/ui-components/issues"