History

Matt Sherman af24637439 Create @woocommerce/admin-layout package (#37094 ) * Initial admin-layout package skeleton * Changelog files * Use createOrderedChildren and sortFillsByOrder from @woocommerce/components for WooFooterItem * Move WooFooterItem to @woocommerce/admin-layout * Use WooFooterItem from @woocommerce/admin-layout * Suppress errant TS lint errors * Exports for @woocommerce/admin-layout * Fill updates and eslint suppression * Changelogs * Remove suppression of tslint errors * Fix react and @types/react versions * Load @woocommerce/admin-layout script and styles * Move WooHeaderItem, WooHeaderNavigationItem, and WooHeaderPageTitle to @woocommerce/admin-layout * Regenerate lock file post-rebase * Remove duplicate import post-rebase * Add wc-admin-layout to app style dependency * Fix jest mock of @woocommerce/admin-layout * Fix spacing. * Export slot names * Fix typo in .npmrc * Update lock file * Try updating lock file * Update lock file * Update lock file * Update to latest lock file from trunk * Update lock file * Sync dependencies of @woocommerce/admin-layout * Manually sync @wordpress dependencies		2023-03-10 09:58:02 -05:00
..
test	Remove unpublished wc-admin-settings package and update getSetting usage (https://github.com/woocommerce/woocommerce-admin/pull/8057 )	2022-01-06 08:53:30 -04:00
README.md	Manually change i18n text domain from 'woocommerce-admin' to 'woocommerce' in WCA Client .md files	2022-04-01 11:41:32 +08:00
index.js	Create @woocommerce/admin-layout package (#37094 )	2023-03-10 09:58:02 -05:00
style.scss	Migrate header items to slot fills (https://github.com/woocommerce/woocommerce-admin/pull/7805 )	2021-12-14 11:56:42 -05:00
use-header-height.ts	Fix overlapping header elements on product page (#36495 )	2023-01-23 10:14:58 -08:00

README.md

Header

A basic component for the app header. The header outputs breadcrumbs via the sections prop (required) and access to the activity panel. It also sets the document title.

How to use:

import Header from 'header';

render: function() {
	return (
		<Header
			sections={ [
				[ '/analytics', __( 'Analytics', 'woocommerce' ) ],
				__( 'Report Title', 'woocommerce' ),
			] }
		/>
  	);
}

Props

sections (required): Used to generate breadcrumbs. Accepts a single items or an array of items. To make an item a link, wrap it in an array with a relative link (example: [ '/analytics', __( 'Analytics', 'woocommerce' ) ] ).
isEmbedded: Boolean describing if the header is embedded on an existing wp-admin page. False if rendered as part of a full react page.

Activity Panel

This component contains the Activity Panel. This is shown on every page and is rendered as part of the header.