feat(page-header): add site-wide components - FRONT-3546 (#2337)

Co-authored-by: Romain Emery <emery.romain@gmail.com>
Co-authored-by: planctus <davidepuntoferrante@gmail.com>

.size-limit.json

@@ -7,7 +7,7 @@
   {
     "path": "dist/packages/ec/styles/ecl-ec.css",
     "webpack": false,
-    "limit": "33 KB"
+    "limit": "34 KB"
   },
   {
     "path": "dist/packages/ec/styles/ecl-ec-print.css",
@@ -22,7 +22,7 @@
   {
     "path": "dist/packages/eu/styles/ecl-eu.css",
     "webpack": false,
-    "limit": "35 KB"
+    "limit": "36 KB"
   },
   {
     "path": "dist/packages/eu/styles/ecl-eu-print.css",

src/implementations/twig/components/page-header-harmonised/ec-page-header-harmonised.story.js

@@ -2,7 +2,7 @@ import { withNotes } from '@ecl/storybook-addon-notes';
 import withCode from '@ecl/storybook-addon-code';
 import { correctSvgPath } from '@ecl/story-utils';
 
-import demoTitleContent from '@ecl/specs-component-page-header-harmonised/demo//data--title';
+import demoTitleContent from '@ecl/specs-component-page-header-harmonised/demo/data--title';
 import demoMetaTitleContent from '@ecl/specs-component-page-header-harmonised/demo/data--meta-title';
 import demoMetaTitleDescriptionContent from '@ecl/specs-component-page-header-harmonised/demo/data--meta-title-description';
 import dataBreadcrumbLongEC from '@ecl/specs-component-breadcrumb/demo/data--ec';

src/implementations/twig/components/page-header/.npmignore

@@ -0,0 +1,2 @@
+__snapshots__
+*.js

src/implementations/twig/components/page-header/README.md

@@ -0,0 +1,45 @@
+# ECL Page Header component
+
+npm package: `@ecl/twig-component-page-header`
+
+```shell
+npm install --save @ecl/twig-component-page-header
+```
+
+### Parameters
+
+- **"variant"** (string) (default: '') options: [ negative ] Negative style with a darker background (only for EC)
+- **"title"** (string) (default: '') Title of header
+- **"hide_title"** (boolean) (default: false) Hide the h1 title, for screen reader only
+- **"description"** (string) (default: '') Description of header
+- **"thumbnail"** (associative array) (default: {}) Thumbnail dipslayed alongside the description
+  - "alt" (string) Alternative text
+  - "src" (string) Image path
+- **"meta"** (array) (default: []) Meta of header
+- **"breadcrumb"** (associative array) (default: '') Predefined structure for the ECL Breadcrumb
+- **"background_image_url"** (string) (default: '') Background image url
+- **"extra_classes"** (optional) (string) (default: '') Extra classes (space separated)
+- **"extra_attributes"** (optional) (array) (default: []) Extra attributes
+  - "name" (string) Attribute name, eg. 'data-test'
+  - "value" (string) Attribute value, eg: 'data-test-1'
+
+### Example :
+
+<!-- prettier-ignore -->
+```twig
+{% include '@ecl/page-header/page-header.html.twig' with {  
+  title: 'Page title',  
+  description: 'Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium',  
+  meta: 'News article | 17 October 2015',  
+  breadcrumb: {  
+    links: [  
+      {  
+        label: 'Link 1',  
+        path: '/example'  
+      },  
+    ],  
+    icon_file_path: '/path-to-the-icons-file',  
+    navigation_text: 'You are here:',  
+  },  
+} %}  
+```