From 8bd44ee66983e42eeeb6cf079fc2eda4b7704f47 Mon Sep 17 00:00:00 2001 From: planctus Date: Thu, 17 Oct 2024 11:39:06 +0300 Subject: [PATCH] chore: ECL release 4.8.0 (#3681) --- .size-limit.json | 6 +- CHANGELOG.md | 43 + README.md | 30 +- docs/javascript.md | 4 + lerna.json | 2 +- package.json | 19 +- .../twig/components/accordion/package.json | 6 +- .../twig/components/banner/package.json | 14 +- .../twig/components/blockquote/package.json | 8 +- .../twig/components/breadcrumb/package.json | 12 +- .../twig/components/button/package.json | 8 +- .../twig/components/card/package.json | 10 +- .../twig/components/carousel/package.json | 10 +- .../components/category-filter/package.json | 8 +- .../twig/components/checkbox/package.json | 10 +- .../components/content-block/package.json | 14 +- .../twig/components/content-item/package.json | 12 +- .../twig/components/date-block/package.json | 6 +- .../twig/components/datepicker/package.json | 10 +- .../components/description-list/package.json | 10 +- .../twig/components/expandable/package.json | 8 +- .../twig/components/fact-figures/package.json | 10 +- .../twig/components/featured-item/README.md | 30 +- .../featured-item/featured-item.html.twig | 5 + .../featured-item/featured-item.story.js | 25 +- .../components/featured-item/package.json | 12 +- .../twig/components/file-upload/package.json | 8 +- .../twig/components/file/package.json | 18 +- .../twig/components/form-group/package.json | 42 +- .../twig/components/gallery/package.json | 16 +- .../twig/components/icon/package.json | 8 +- .../components/inpage-navigation/package.json | 10 +- .../twig/components/label/package.json | 6 +- .../twig/components/link/package.json | 8 +- .../components/list-illustration/package.json | 10 +- .../components/media-container/package.json | 14 +- .../__snapshots__/mega-menu.test.js.snap | 104 +- .../twig/components/mega-menu/package.json | 10 +- .../twig/components/menu/package.json | 10 +- .../twig/components/modal/package.json | 10 +- .../components/navigation-list/package.json | 10 +- .../twig/components/news-ticker/package.json | 12 +- .../twig/components/notification/README.md | 2 + .../__snapshots__/notification.test.js.snap | 200 ++ .../notification/notification.html.twig | 43 +- .../notification/notification.story.js | 16 + .../twig/components/notification/package.json | 10 +- .../twig/components/ordered-list/package.json | 6 +- .../twig/components/page-header/package.json | 12 +- .../twig/components/pagination/package.json | 8 +- .../twig/components/picture/package.json | 4 +- .../twig/components/popover/package.json | 8 +- .../twig/components/radio/package.json | 8 +- .../twig/components/range/package.json | 8 +- .../twig/components/rating-field/package.json | 10 +- .../twig/components/search-form/package.json | 12 +- .../twig/components/select/package.json | 10 +- .../twig/components/separator/package.json | 4 +- .../twig/components/site-footer/package.json | 14 +- .../__snapshots__/site-header.test.js.snap | 250 +- .../site-header/ec-site-header.story.js | 16 + .../site-header/eu-site-header.story.js | 16 + .../twig/components/site-header/package.json | 24 +- .../site-header/site-header.html.twig | 6 +- .../twig/components/skip-link/package.json | 8 +- .../social-media-follow/package.json | 8 +- .../social-media-share/package.json | 10 +- .../twig/components/spinner/package.json | 6 +- .../twig/components/splash-page/package.json | 16 +- .../twig/components/table/package.json | 6 +- .../twig/components/tabs/package.json | 10 +- .../twig/components/tag/package.json | 8 +- .../twig/components/text-area/package.json | 8 +- .../twig/components/text-input/package.json | 8 +- .../twig/components/timeline/package.json | 8 +- .../components/unordered-list/package.json | 6 +- .../twig/components/video/package.json | 4 +- .../twig/compositions/etrans/package.json | 18 +- .../file-upload-status/package.json | 6 +- .../twig/layout/grid/package.json | 12 +- .../twig/pages/page-home/.npmignore | 2 + .../twig/pages/page-home/README.md | 7 + .../twig/pages/page-home/package.json | 37 + .../twig/pages/page-home/page-home.html.twig | 73 + .../twig/pages/page-home/page-home.story.js | 85 + .../twig/pages/page-inner/.npmignore | 2 + .../twig/pages/page-inner/README.md | 7 + .../twig/pages/page-inner/package.json | 37 + .../pages/page-inner/page-inner.html.twig | 54 + .../twig/pages/page-inner/page-inner.story.js | 85 + .../twig/pages/page-search/.npmignore | 2 + .../twig/pages/page-search/README.md | 7 + .../twig/pages/page-search/package.json | 36 + .../pages/page-search/page-search.html.twig | 74 + .../pages/page-search/page-search.story.js | 85 + .../vanilla/components/accordion/package.json | 6 +- .../vanilla/components/banner/package.json | 6 +- .../components/blockquote/package.json | 4 +- .../components/breadcrumb/package.json | 6 +- .../vanilla/components/button/package.json | 4 +- .../vanilla/components/card/package.json | 4 +- .../vanilla/components/carousel/package.json | 8 +- .../components/category-filter/package.json | 4 +- .../vanilla/components/checkbox/package.json | 2 +- .../components/content-block/package.json | 4 +- .../content-item/content-item-print.scss | 2 + .../components/content-item/content-item.scss | 6 +- .../components/content-item/package.json | 4 +- .../components/date-block/package.json | 6 +- .../components/datepicker/datepicker.js | 103 +- .../components/datepicker/package.json | 4 +- .../components/description-list/package.json | 6 +- .../components/expandable/package.json | 4 +- .../components/fact-figures/package.json | 4 +- .../components/featured-item/package.json | 4 +- .../components/file-upload/package.json | 6 +- .../vanilla/components/file/file.scss | 4 - .../vanilla/components/file/package.json | 6 +- .../components/form-group/package.json | 2 +- .../vanilla/components/gallery/package.json | 8 +- .../vanilla/components/icon/package.json | 2 +- .../components/inpage-navigation/package.json | 6 +- .../vanilla/components/label/package.json | 2 +- .../vanilla/components/link/package.json | 4 +- .../components/list-illustration/package.json | 4 +- .../components/media-container/package.json | 8 +- .../vanilla/components/mega-menu/mega-menu.js | 7 +- .../vanilla/components/mega-menu/package.json | 6 +- .../vanilla/components/menu/menu.js | 61 +- .../vanilla/components/menu/package.json | 6 +- .../vanilla/components/modal/modal.scss | 5 +- .../vanilla/components/modal/package.json | 6 +- .../components/navigation-list/package.json | 4 +- .../components/news-ticker/package.json | 6 +- .../notification/notification-print.scss | 4 + .../components/notification/notification.js | 50 +- .../components/notification/notification.scss | 46 +- .../components/notification/package.json | 6 +- .../components/ordered-list/package.json | 2 +- .../components/page-header/package.json | 4 +- .../components/pagination/package.json | 4 +- .../vanilla/components/picture/package.json | 2 +- .../vanilla/components/popover/package.json | 6 +- .../vanilla/components/radio/package.json | 2 +- .../vanilla/components/range/package.json | 6 +- .../components/rating-field/package.json | 4 +- .../components/search-form/package.json | 6 +- .../vanilla/components/select/package.json | 10 +- .../vanilla/components/select/select.scss | 4 + .../vanilla/components/separator/package.json | 2 +- .../components/site-footer/package.json | 4 +- .../_site-header-language-switcher.scss | 1 + .../components/site-header/package.json | 6 +- .../components/site-header/site-header.js | 28 + .../vanilla/components/skip-link/package.json | 4 +- .../social-media-follow/package.json | 4 +- .../social-media-share/package.json | 4 +- .../vanilla/components/spinner/package.json | 2 +- .../components/splash-page/package.json | 4 +- .../components/splash-page/splash-page.scss | 1 + .../vanilla/components/table/package.json | 10 +- .../vanilla/components/tabs/package.json | 8 +- .../vanilla/components/tabs/tabs.scss | 5 - .../vanilla/components/tag/package.json | 2 +- .../vanilla/components/text-area/package.json | 4 +- .../components/text-input/package.json | 4 +- .../vanilla/components/timeline/package.json | 6 +- .../components/unordered-list/package.json | 2 +- .../vanilla/components/video/package.json | 2 +- .../vanilla/layout/form/package.json | 4 +- .../vanilla/layout/grid/package.json | 2 +- .../vanilla/utilities/background/package.json | 2 +- .../vanilla/utilities/border/package.json | 4 +- .../vanilla/utilities/clearfix/package.json | 2 +- .../vanilla/utilities/dimension/package.json | 2 +- .../utilities/disablescroll/package.json | 2 +- .../vanilla/utilities/display/package.json | 4 +- .../vanilla/utilities/flex/package.json | 4 +- .../vanilla/utilities/float/package.json | 2 +- .../vanilla/utilities/media/package.json | 4 +- .../vanilla/utilities/print/package.json | 2 +- .../utilities/screen-reader/package.json | 2 +- .../vanilla/utilities/shadow/package.json | 2 +- .../vanilla/utilities/spacing/package.json | 4 +- .../vanilla/utilities/typography/package.json | 4 +- .../vanilla/utilities/z-index/package.json | 2 +- .../addons/story-utils/package.json | 12 +- .../addons/storybook-addon-code/package.json | 12 +- .../addons/storybook-addon-notes/package.json | 6 +- .../package.json | 10 +- src/playground/ec/.storybook/environment.js | 5 + src/playground/ec/package.json | 26 +- src/playground/eu/.storybook/environment.js | 5 + src/playground/eu/package.json | 26 +- src/presets/ec/package.json | 164 +- src/presets/eu/package.json | 164 +- src/presets/reset/package.json | 4 +- src/presets/rtl/package.json | 6 +- src/resources/favicons-ec/package.json | 2 +- src/resources/favicons/package.json | 2 +- src/resources/icons-flag/package.json | 2 +- src/resources/icons-social-media/package.json | 2 +- src/resources/icons/package.json | 2 +- src/resources/logo-ec/package.json | 2 +- src/resources/logo-eu/package.json | 2 +- src/resources/social-icons/package.json | 2 +- src/specs/components/accordion/package.json | 2 +- src/specs/components/banner/package.json | 2 +- src/specs/components/blockquote/package.json | 2 +- src/specs/components/breadcrumb/package.json | 2 +- src/specs/components/button/package.json | 2 +- src/specs/components/card/package.json | 2 +- src/specs/components/carousel/package.json | 2 +- .../components/category-fiter/package.json | 2 +- src/specs/components/checkbox/package.json | 2 +- .../components/content-block/package.json | 2 +- .../components/content-item/package.json | 2 +- src/specs/components/date-block/package.json | 2 +- src/specs/components/datepicker/package.json | 2 +- .../components/description-list/package.json | 2 +- src/specs/components/expandable/package.json | 2 +- .../components/fact-figures/package.json | 2 +- .../components/featured-item/package.json | 2 +- src/specs/components/file-upload/package.json | 2 +- src/specs/components/file/package.json | 2 +- src/specs/components/gallery/package.json | 2 +- src/specs/components/icon/package.json | 2 +- .../components/inpage-navigation/package.json | 2 +- src/specs/components/label/package.json | 2 +- src/specs/components/link/package.json | 2 +- .../components/list-illustration/package.json | 2 +- .../components/media-container/package.json | 2 +- src/specs/components/mega-menu/demo/data.js | 5 +- src/specs/components/mega-menu/package.json | 2 +- src/specs/components/menu/package.json | 2 +- src/specs/components/modal/package.json | 2 +- .../components/navigation-list/package.json | 2 +- src/specs/components/news-ticker/package.json | 2 +- .../notification/demo/data--error-eu.js | 2 +- .../notification/demo/data--info-ec.js | 14 + .../notification/demo/data--info-eu.js | 16 +- .../notification/demo/data--success-eu.js | 2 +- .../notification/demo/data--warning-eu.js | 2 +- .../components/notification/package.json | 2 +- .../components/ordered-list/package.json | 2 +- src/specs/components/page-header/package.json | 2 +- src/specs/components/pagination/package.json | 2 +- src/specs/components/picture/package.json | 2 +- src/specs/components/popover/package.json | 2 +- src/specs/components/radio/package.json | 2 +- src/specs/components/range/package.json | 2 +- .../components/rating-field/package.json | 2 +- src/specs/components/search-form/package.json | 2 +- src/specs/components/select/package.json | 2 +- src/specs/components/site-footer/package.json | 2 +- .../components/site-header/demo/data--ec.js | 26 +- .../components/site-header/demo/data--eu.js | 26 +- src/specs/components/site-header/package.json | 2 +- src/specs/components/skip-link/package.json | 2 +- .../social-media-follow/package.json | 2 +- .../social-media-share/package.json | 2 +- src/specs/components/spinner/package.json | 2 +- src/specs/components/splash-page/package.json | 2 +- src/specs/components/table/package.json | 2 +- src/specs/components/tabs/package.json | 2 +- src/specs/components/tag/package.json | 2 +- src/specs/components/text-area/package.json | 2 +- src/specs/components/text-input/package.json | 2 +- src/specs/components/timeline/package.json | 2 +- .../components/unordered-list/package.json | 2 +- src/specs/components/video/package.json | 2 +- src/specs/compositions/etrans/package.json | 2 +- src/specs/pages/page-home/demo/data.js | 61 + src/specs/pages/page-home/package.json | 33 + src/specs/pages/page-inner/demo/data.js | 53 + src/specs/pages/page-inner/package.json | 35 + src/specs/pages/page-search/demo/data.js | 70 + src/specs/pages/page-search/package.json | 36 + src/specs/utilities/typography/package.json | 2 +- src/themes/ec/package.json | 2 +- src/themes/ec/variables/_language-list.scss | 10 +- src/themes/ec/variables/_modal.scss | 5 +- src/themes/ec/variables/_notification.scss | 18 +- src/themes/eu/package.json | 2 +- src/themes/eu/variables/_language-list.scss | 12 +- src/themes/eu/variables/_modal.scss | 5 +- src/themes/eu/variables/_notification.scss | 26 +- src/tools/builder/package.json | 14 +- src/tools/builder/scripts/scripts.js | 3 + src/tools/dom-utils/package.json | 2 +- src/tools/event-manager/package.json | 2 +- src/tools/test-utils/package.json | 2 +- src/website/package.json | 31 +- .../media/featured-item/demo/index.js | 13 + .../media/media-container/docs/api.mdx | 52 + .../src/pages/ec/getting-started/index.mdx | 2 + src/website/src/pages/ec/whats-new/index.md | 39 + .../media/featured-item/demo/index.js | 13 + .../media/media-container/docs/api.mdx | 52 + src/website/src/pages/eu/whats-new/index.md | 38 + yarn.lock | 2928 +++++++++-------- 301 files changed, 4539 insertions(+), 2388 deletions(-) create mode 100644 src/implementations/twig/pages/page-home/.npmignore create mode 100644 src/implementations/twig/pages/page-home/README.md create mode 100644 src/implementations/twig/pages/page-home/package.json create mode 100644 src/implementations/twig/pages/page-home/page-home.html.twig create mode 100644 src/implementations/twig/pages/page-home/page-home.story.js create mode 100644 src/implementations/twig/pages/page-inner/.npmignore create mode 100644 src/implementations/twig/pages/page-inner/README.md create mode 100644 src/implementations/twig/pages/page-inner/package.json create mode 100644 src/implementations/twig/pages/page-inner/page-inner.html.twig create mode 100644 src/implementations/twig/pages/page-inner/page-inner.story.js create mode 100644 src/implementations/twig/pages/page-search/.npmignore create mode 100644 src/implementations/twig/pages/page-search/README.md create mode 100644 src/implementations/twig/pages/page-search/package.json create mode 100644 src/implementations/twig/pages/page-search/page-search.html.twig create mode 100644 src/implementations/twig/pages/page-search/page-search.story.js create mode 100644 src/specs/pages/page-home/demo/data.js create mode 100644 src/specs/pages/page-home/package.json create mode 100644 src/specs/pages/page-inner/demo/data.js create mode 100644 src/specs/pages/page-inner/package.json create mode 100644 src/specs/pages/page-search/demo/data.js create mode 100644 src/specs/pages/page-search/package.json create mode 100644 src/website/src/pages/ec/components/media/media-container/docs/api.mdx create mode 100644 src/website/src/pages/eu/components/media/media-container/docs/api.mdx diff --git a/.size-limit.json b/.size-limit.json index 618160ac776..75806873f28 100644 --- a/.size-limit.json +++ b/.size-limit.json @@ -1,7 +1,7 @@ [ { "path": "dist/packages/ec/styles/ecl-ec.css", - "limit": "30 KB", + "limit": "31 KB", "webpack": false, "gzip": false }, @@ -27,14 +27,14 @@ }, { "path": "dist/packages/ec/scripts/ecl-ec.js", - "limit": "235 KB", + "limit": "240 KB", "webpack": false, "gzip": false, "brotli": false }, { "path": "dist/packages/eu/scripts/ecl-eu.js", - "limit": "235 KB", + "limit": "240 KB", "webpack": false, "gzip": false, "brotli": false diff --git a/CHANGELOG.md b/CHANGELOG.md index 86ce8bf8c36..1272d516632 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,48 @@ # Changelog +# 4.8.0 + +#### :warning: Markup Changes + +- [#3656](https://github.com/ec-europa/europa-component-library/pull/3656) fix(site-header): Removing containers when removing notification - FRONT-4637 ([@planctus](https://github.com/planctus)) +- [#3645](https://github.com/ec-europa/europa-component-library/pull/3645) feat(notification): Adding links, updating styles - FRONT-4630 ([@planctus](https://github.com/planctus)) + +#### :warning: Data Changes + +- [#3645](https://github.com/ec-europa/europa-component-library/pull/3645) feat(notification): Adding links, updating styles - FRONT-4630 ([@planctus](https://github.com/planctus)) + +#### :bug: Bug Fix + +- [#3668](https://github.com/ec-europa/europa-component-library/pull/3668) fix(datepicker): Parsing user input, use moment for custom formats, handle resize - FRONT-4643 ([@planctus](https://github.com/planctus)) +- [#3670](https://github.com/ec-europa/europa-component-library/pull/3670) fix(language-list): Fixing styles - FRONT-4647 ([@planctus](https://github.com/planctus)) +- [#3660](https://github.com/ec-europa/europa-component-library/pull/3660) fix(mega-menu): Setting opacity: 1 on the container when opened - FRONT-4641 ([@planctus](https://github.com/planctus)) +- [#3666](https://github.com/ec-europa/europa-component-library/pull/3666) fix(content-item): revert height change - FRONT-4645 ([@emeryro](https://github.com/emeryro)) +- [#3661](https://github.com/ec-europa/europa-component-library/pull/3661) fix(multiselect): Setting margin-top when there is a label and no helper text - FRONT-4640 ([@planctus](https://github.com/planctus)) +- [#3656](https://github.com/ec-europa/europa-component-library/pull/3656) fix(site-header): Removing containers when removing notification - FRONT-4637 ([@planctus](https://github.com/planctus)) +- [#3653](https://github.com/ec-europa/europa-component-library/pull/3653) fix(tabs): fix icon position on mobile - FRONT-4321 ([@emeryro](https://github.com/emeryro)) +- [#3647](https://github.com/ec-europa/europa-component-library/pull/3647) fix(menu): fix touch devices - FRONT-4632 ([@emeryro](https://github.com/emeryro)) +- [#3649](https://github.com/ec-europa/europa-component-library/pull/3649) fix(modal): fix close button position on rtl - FRONT-4623 ([@emeryro](https://github.com/emeryro)) + +#### :nail_care: Enhancement + +- [#3654](https://github.com/ec-europa/europa-component-library/pull/3654) feat(content-item): set 100% height - FRONT-4627 ([@emeryro](https://github.com/emeryro)) +- [#3657](https://github.com/ec-europa/europa-component-library/pull/3657) feat(js): Adding version propery to the ECL object - FRONT-4638 ([@planctus](https://github.com/planctus)) +- [#3645](https://github.com/ec-europa/europa-component-library/pull/3645) feat(notification): Adding links, updating styles - FRONT-4630 ([@planctus](https://github.com/planctus)) + +#### :house: Internal + +- [#3673](https://github.com/ec-europa/europa-component-library/pull/3673) feat(featured-item): Deprecating footer - FRONT-4650 ([@planctus](https://github.com/planctus)) +- [#3674](https://github.com/ec-europa/europa-component-library/pull/3674) chore(deps): Updates 14-10-24 ([@planctus](https://github.com/planctus)) +- [#3664](https://github.com/ec-europa/europa-component-library/pull/3664) chore(deps): Updates - 07-10-24 ([@planctus](https://github.com/planctus)) +- [#3593](https://github.com/ec-europa/europa-component-library/pull/3593) docs(showcase): provide example of full pages - FRONT-4383 ([@emeryro](https://github.com/emeryro)) +- [#3659](https://github.com/ec-europa/europa-component-library/pull/3659) chore(deps): Updates 01-10-24 ([@planctus](https://github.com/planctus)) +- [#3651](https://github.com/ec-europa/europa-component-library/pull/3651) feat(apis): Adding api docs for media container - FRONT-4635 ([@planctus](https://github.com/planctus)) + +#### Committers: 2 + +- Romain Emery ([@emeryro](https://github.com/emeryro)) +- [@planctus](https://github.com/planctus) + # 4.7.0 #### :warning In this version of ECL node 20.9.0 is being used, for those who need to compile ECL on their side please upgrade the node version before integrating this release. diff --git a/README.md b/README.md index 07d90fbb9b3..0797f09db97 100644 --- a/README.md +++ b/README.md @@ -34,8 +34,8 @@ The ECL is bundled in various [presets](docs/presets.md) in order to accomodate ```html @@ -44,8 +44,8 @@ The ECL is bundled in various [presets](docs/presets.md) in order to accomodate ```html @@ -54,8 +54,8 @@ The ECL is bundled in various [presets](docs/presets.md) in order to accomodate ```html @@ -64,8 +64,8 @@ The ECL is bundled in various [presets](docs/presets.md) in order to accomodate ```html @@ -74,8 +74,8 @@ The ECL is bundled in various [presets](docs/presets.md) in order to accomodate ```html @@ -84,9 +84,9 @@ The ECL is bundled in various [presets](docs/presets.md) in order to accomodate ```html @@ -94,8 +94,8 @@ The ECL is bundled in various [presets](docs/presets.md) in order to accomodate ```html ``` diff --git a/docs/javascript.md b/docs/javascript.md index c3dd6c16d87..d32ac5f5627 100644 --- a/docs/javascript.md +++ b/docs/javascript.md @@ -12,6 +12,10 @@ This means that when you include the `ECL` library in your pages, you will have ![ECL library in your browser's console](./assets/ECLjs.png) +## Version in use + +You can get the ECL version you are using running `ECL.version` in the console of your devtools. + ## Instantiation Each component contains `.init()` and `.destroy()` methods. diff --git a/lerna.json b/lerna.json index 0bf6fb2070c..0dc6574d087 100644 --- a/lerna.json +++ b/lerna.json @@ -1,5 +1,5 @@ { - "version": "4.7.0", + "version": "4.8.0", "npmClient": "yarn", "changelog": { "repo": "ec-europa/europa-component-library", diff --git a/package.json b/package.json index 394942c41f2..7786b04c83e 100644 --- a/package.json +++ b/package.json @@ -33,21 +33,22 @@ "update-version": "scripts/update-version.sh" }, "devDependencies": { - "@babel/eslint-parser": "7.25.1", - "@babel/plugin-proposal-export-default-from": "7.24.7", - "@babel/plugin-transform-runtime": "7.25.4", + "@babel/eslint-parser": "7.25.8", + "@babel/plugin-proposal-export-default-from": "7.25.8", + "@babel/plugin-transform-runtime": "7.25.7", + "@babel/plugin-syntax-dynamic-import": "7.8.3", "@prettier/plugin-xml": "3.4.1", - "@size-limit/preset-big-lib": "11.1.5", + "@size-limit/preset-big-lib": "11.1.6", "babel-jest": "29.7.0", "classnames": "2.5.1", "eslint": "8.57.0", "eslint-config-airbnb": "19.0.4", "eslint-config-airbnb-base": "15.0.0", - "eslint-plugin-import": "2.30.0", + "eslint-plugin-import": "2.31.0", "eslint-plugin-jest": "27.9.0", "eslint-plugin-jsx-a11y": "6.10.0", "eslint-plugin-prettier": "5.2.1", - "eslint-plugin-react": "7.36.1", + "eslint-plugin-react": "7.37.1", "eslint-plugin-react-hooks": "4.6.2", "glob": "11.0.0", "husky": "9.1.6", @@ -65,9 +66,9 @@ "react": "18.3.1", "react-dom": "18.3.1", "rimraf": "6.0.1", - "size-limit": "11.1.5", + "size-limit": "11.1.6", "ssri": "10.0.6", - "stylelint": "16.9.0", + "stylelint": "16.10.0", "stylelint-config-css-modules": "4.4.0", "stylelint-config-prettier": "9.0.5", "stylelint-config-standard": "36.0.1", @@ -112,8 +113,6 @@ "ip": ">=2.0.1", "ws": ">=8.17.1", "micromatch": ">=4.0.8", - "serve-static": ">=1.16.0", - "send": ">=0.19.0", "path-to-regexp": "0.1.10" }, "engines": { diff --git a/src/implementations/twig/components/accordion/package.json b/src/implementations/twig/components/accordion/package.json index 1e843819adf..95191e9d1b3 100644 --- a/src/implementations/twig/components/accordion/package.json +++ b/src/implementations/twig/components/accordion/package.json @@ -2,7 +2,7 @@ "name": "@ecl/twig-component-accordion", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Accordion", "publishConfig": { "access": "public" @@ -11,8 +11,8 @@ "@ecl/twig-component-icon": "^3.0.0" }, "devDependencies": { - "@ecl/specs-component-accordion": "4.7.0", - "@ecl/vanilla-component-accordion": "4.7.0" + "@ecl/specs-component-accordion": "4.8.0", + "@ecl/vanilla-component-accordion": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/banner/package.json b/src/implementations/twig/components/banner/package.json index 91f7ff8cee5..299d73a68a2 100644 --- a/src/implementations/twig/components/banner/package.json +++ b/src/implementations/twig/components/banner/package.json @@ -2,20 +2,20 @@ "name": "@ecl/twig-component-banner", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Banner", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-button": "4.7.0", - "@ecl/twig-component-link": "4.7.0", - "@ecl/twig-component-picture": "4.7.0", - "@ecl/twig-component-video": "4.7.0" + "@ecl/twig-component-button": "4.8.0", + "@ecl/twig-component-link": "4.8.0", + "@ecl/twig-component-picture": "4.8.0", + "@ecl/twig-component-video": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-banner": "4.7.0", - "@ecl/vanilla-component-banner": "4.7.0" + "@ecl/specs-component-banner": "4.8.0", + "@ecl/vanilla-component-banner": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/blockquote/package.json b/src/implementations/twig/components/blockquote/package.json index 3f3de8959d4..0bf61ee7396 100644 --- a/src/implementations/twig/components/blockquote/package.json +++ b/src/implementations/twig/components/blockquote/package.json @@ -2,17 +2,17 @@ "name": "@ecl/twig-component-blockquote", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Blockquote", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-picture": "4.7.0" + "@ecl/twig-component-picture": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-blockquote": "4.7.0", - "@ecl/vanilla-component-blockquote": "4.7.0" + "@ecl/specs-component-blockquote": "4.8.0", + "@ecl/vanilla-component-blockquote": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/breadcrumb/package.json b/src/implementations/twig/components/breadcrumb/package.json index 504fe4d0d0e..c94f1763285 100644 --- a/src/implementations/twig/components/breadcrumb/package.json +++ b/src/implementations/twig/components/breadcrumb/package.json @@ -2,19 +2,19 @@ "name": "@ecl/twig-component-breadcrumb", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Breadcrumb", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-button": "4.7.0", - "@ecl/twig-component-icon": "4.7.0", - "@ecl/twig-component-link": "4.7.0" + "@ecl/twig-component-button": "4.8.0", + "@ecl/twig-component-icon": "4.8.0", + "@ecl/twig-component-link": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-breadcrumb": "4.7.0", - "@ecl/vanilla-component-breadcrumb": "4.7.0" + "@ecl/specs-component-breadcrumb": "4.8.0", + "@ecl/vanilla-component-breadcrumb": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/button/package.json b/src/implementations/twig/components/button/package.json index 6b505c0e1a2..f48187701bf 100644 --- a/src/implementations/twig/components/button/package.json +++ b/src/implementations/twig/components/button/package.json @@ -2,17 +2,17 @@ "name": "@ecl/twig-component-button", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Button", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-icon": "4.7.0" + "@ecl/twig-component-icon": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-button": "4.7.0", - "@ecl/vanilla-component-button": "4.7.0" + "@ecl/specs-component-button": "4.8.0", + "@ecl/vanilla-component-button": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/card/package.json b/src/implementations/twig/components/card/package.json index 6be08e4cf4e..9a337827b7f 100644 --- a/src/implementations/twig/components/card/package.json +++ b/src/implementations/twig/components/card/package.json @@ -2,18 +2,18 @@ "name": "@ecl/twig-component-card", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Card", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-content-block": "4.7.0", - "@ecl/twig-component-picture": "4.7.0" + "@ecl/twig-component-content-block": "4.8.0", + "@ecl/twig-component-picture": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-card": "4.7.0", - "@ecl/vanilla-component-card": "4.7.0" + "@ecl/specs-component-card": "4.8.0", + "@ecl/vanilla-component-card": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/carousel/package.json b/src/implementations/twig/components/carousel/package.json index 060b44a1b28..36abc32d195 100644 --- a/src/implementations/twig/components/carousel/package.json +++ b/src/implementations/twig/components/carousel/package.json @@ -2,18 +2,18 @@ "name": "@ecl/twig-component-carousel", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Carousel", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-banner": "4.7.0", - "@ecl/twig-component-button": "4.7.0" + "@ecl/twig-component-banner": "4.8.0", + "@ecl/twig-component-button": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-carousel": "4.7.0", - "@ecl/vanilla-component-carousel": "4.7.0" + "@ecl/specs-component-carousel": "4.8.0", + "@ecl/vanilla-component-carousel": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/category-filter/package.json b/src/implementations/twig/components/category-filter/package.json index 89718dee818..32c93d4a577 100644 --- a/src/implementations/twig/components/category-filter/package.json +++ b/src/implementations/twig/components/category-filter/package.json @@ -2,17 +2,17 @@ "name": "@ecl/twig-component-category-filter", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Category filter", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-icon": "4.7.0" + "@ecl/twig-component-icon": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-category-filter": "4.7.0", - "@ecl/vanilla-component-category-filter": "4.7.0" + "@ecl/specs-component-category-filter": "4.8.0", + "@ecl/vanilla-component-category-filter": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/checkbox/package.json b/src/implementations/twig/components/checkbox/package.json index 632c930a036..1289893e420 100644 --- a/src/implementations/twig/components/checkbox/package.json +++ b/src/implementations/twig/components/checkbox/package.json @@ -2,18 +2,18 @@ "name": "@ecl/twig-component-checkbox", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Checkbox", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-icon": "4.7.0" + "@ecl/twig-component-icon": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-checkbox": "4.7.0", - "@ecl/vanilla-component-checkbox": "4.7.0", - "@ecl/vanilla-component-form-group": "4.7.0" + "@ecl/specs-component-checkbox": "4.8.0", + "@ecl/vanilla-component-checkbox": "4.8.0", + "@ecl/vanilla-component-form-group": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/content-block/package.json b/src/implementations/twig/components/content-block/package.json index fa9f45e364a..b5a00b694f4 100644 --- a/src/implementations/twig/components/content-block/package.json +++ b/src/implementations/twig/components/content-block/package.json @@ -2,20 +2,20 @@ "name": "@ecl/twig-component-content-block", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Content Block", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-description-list": "4.7.0", - "@ecl/twig-component-icon": "4.7.0", - "@ecl/twig-component-label": "4.7.0", - "@ecl/twig-component-link": "4.7.0" + "@ecl/twig-component-description-list": "4.8.0", + "@ecl/twig-component-icon": "4.8.0", + "@ecl/twig-component-label": "4.8.0", + "@ecl/twig-component-link": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-content-block": "4.7.0", - "@ecl/vanilla-component-content-block": "4.7.0" + "@ecl/specs-component-content-block": "4.8.0", + "@ecl/vanilla-component-content-block": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/content-item/package.json b/src/implementations/twig/components/content-item/package.json index fa60c23848c..3e875eb021f 100644 --- a/src/implementations/twig/components/content-item/package.json +++ b/src/implementations/twig/components/content-item/package.json @@ -2,19 +2,19 @@ "name": "@ecl/twig-component-content-item", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Content item", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-content-block": "4.7.0", - "@ecl/twig-component-date-block": "4.7.0", - "@ecl/twig-component-picture": "4.7.0" + "@ecl/twig-component-content-block": "4.8.0", + "@ecl/twig-component-date-block": "4.8.0", + "@ecl/twig-component-picture": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-content-item": "4.7.0", - "@ecl/vanilla-component-content-item": "4.7.0" + "@ecl/specs-component-content-item": "4.8.0", + "@ecl/vanilla-component-content-item": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/date-block/package.json b/src/implementations/twig/components/date-block/package.json index 908d1b3845c..c7e3637f90a 100644 --- a/src/implementations/twig/components/date-block/package.json +++ b/src/implementations/twig/components/date-block/package.json @@ -2,14 +2,14 @@ "name": "@ecl/twig-component-date-block", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Date Block", "publishConfig": { "access": "public" }, "devDependencies": { - "@ecl/specs-component-date-block": "4.7.0", - "@ecl/vanilla-component-date-block": "4.7.0" + "@ecl/specs-component-date-block": "4.8.0", + "@ecl/vanilla-component-date-block": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/datepicker/package.json b/src/implementations/twig/components/datepicker/package.json index 8fc0d6a15f3..ebdebde8bff 100644 --- a/src/implementations/twig/components/datepicker/package.json +++ b/src/implementations/twig/components/datepicker/package.json @@ -2,18 +2,18 @@ "name": "@ecl/twig-component-datepicker", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Datepicker", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-icon": "4.7.0" + "@ecl/twig-component-icon": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-datepicker": "4.7.0", - "@ecl/vanilla-component-datepicker": "4.7.0", - "@ecl/vanilla-component-form-group": "4.7.0" + "@ecl/specs-component-datepicker": "4.8.0", + "@ecl/vanilla-component-datepicker": "4.8.0", + "@ecl/vanilla-component-form-group": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/description-list/package.json b/src/implementations/twig/components/description-list/package.json index dd5436d6adf..19243f763c8 100644 --- a/src/implementations/twig/components/description-list/package.json +++ b/src/implementations/twig/components/description-list/package.json @@ -2,18 +2,18 @@ "name": "@ecl/twig-component-description-list", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Description list", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-link": "4.7.0", - "@ecl/twig-component-tag": "4.7.0" + "@ecl/twig-component-link": "4.8.0", + "@ecl/twig-component-tag": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-description-list": "4.7.0", - "@ecl/vanilla-component-description-list": "4.7.0" + "@ecl/specs-component-description-list": "4.8.0", + "@ecl/vanilla-component-description-list": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/expandable/package.json b/src/implementations/twig/components/expandable/package.json index af9398f3038..899282b2743 100644 --- a/src/implementations/twig/components/expandable/package.json +++ b/src/implementations/twig/components/expandable/package.json @@ -2,17 +2,17 @@ "name": "@ecl/twig-component-expandable", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Expandable", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-button": "4.7.0" + "@ecl/twig-component-button": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-expandable": "4.7.0", - "@ecl/vanilla-component-expandable": "4.7.0" + "@ecl/specs-component-expandable": "4.8.0", + "@ecl/vanilla-component-expandable": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/fact-figures/package.json b/src/implementations/twig/components/fact-figures/package.json index 4aa77b63b68..df72c1ac26a 100644 --- a/src/implementations/twig/components/fact-figures/package.json +++ b/src/implementations/twig/components/fact-figures/package.json @@ -2,18 +2,18 @@ "name": "@ecl/twig-component-fact-figures", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Fact & Figures", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-icon": "4.7.0", - "@ecl/twig-component-link": "4.7.0" + "@ecl/twig-component-icon": "4.8.0", + "@ecl/twig-component-link": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-fact-figures": "4.7.0", - "@ecl/vanilla-component-fact-figures": "4.7.0" + "@ecl/specs-component-fact-figures": "4.8.0", + "@ecl/vanilla-component-fact-figures": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/featured-item/README.md b/src/implementations/twig/components/featured-item/README.md index 5fe9d9535fa..7cfac4105eb 100644 --- a/src/implementations/twig/components/featured-item/README.md +++ b/src/implementations/twig/components/featured-item/README.md @@ -14,14 +14,17 @@ npm install --save @ecl/twig-component-featured-item - **"link"** (associative array) (default: predefined structure) predefined structure for the Link component - **"media_container"** (associative array) (default: predefined structure) predefined structure for the Media container component - **"position"** (string) (default: 'left') - Media position -- **"footer_description"** (string) (default: ''): short description in the footer -- **"footer_link"** (object) (default: {}): call to action link in the footer; type Link -- **"footer_picture"** (object) (default: {}): picture in the footer; type Picture - **"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'. +### Deprecated: + +- **"footer_description"** (string) (default: ''): short description in the footer +- **"footer_link"** (object) (default: {}): call to action link in the footer; type Link +- **"footer_picture"** (object) (default: {}): picture in the footer; type Picture + ### Example for featured item: @@ -53,26 +56,5 @@ npm install --save @ecl/twig-component-featured-item description: 'Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.', }, - footer_description: 'Suspendisse a nisi elit. Integer vulputate egestas ipsum quis dapibus. In hac habitasse platea dictumst.', - footer_link: { - link: { - type: 'cta', - path: exampleLink, - label: 'See more', - icon_position: 'after', - }, - icon: { - path: '/icons.svg', - name: 'corner-arrow', - size: 'xs', - transform: 'rotate-90', - }, - }, - footer_picture: { - img: { - src: 'https://inno-ecl.s3.amazonaws.com/media/examples/example-image.jpg', - alt: 'Image alt text', - }, - } } %} ``` diff --git a/src/implementations/twig/components/featured-item/featured-item.html.twig b/src/implementations/twig/components/featured-item/featured-item.html.twig index 77ba041d640..5dba4d0ecc8 100644 --- a/src/implementations/twig/components/featured-item/featured-item.html.twig +++ b/src/implementations/twig/components/featured-item/featured-item.html.twig @@ -18,6 +18,11 @@ }, ... ] + + Deprecated: + - "footer_description" (string) (default: ''): short description in the footer + - "footer_link" (object) (default: {}): call to action link in the footer; type Link + - "footer_picture" (object) (default: {}): picture in the footer; type Picture #} {# Internal properties #} diff --git a/src/implementations/twig/components/featured-item/featured-item.story.js b/src/implementations/twig/components/featured-item/featured-item.story.js index 32ffb5ea5c3..99988cb7b07 100644 --- a/src/implementations/twig/components/featured-item/featured-item.story.js +++ b/src/implementations/twig/components/featured-item/featured-item.story.js @@ -13,7 +13,6 @@ const mediaContainer = { ...demoData.media_container }; const getArgs = (data) => { const args = { show_media: true, - show_footer: false, title: data.title, description: data.description, position: 'left', @@ -28,6 +27,8 @@ const getArgs = (data) => { args.footer_description = data.footer_description; } + args.show_footer = false; + return args; }; @@ -43,15 +44,6 @@ const getArgTypes = (data) => { }, }; - argTypes.show_footer = { - type: 'boolean', - name: 'show footer', - description: 'Toggle footer visility', - table: { - category: 'Optional', - }, - }; - argTypes.title = { type: 'string', description: 'Features item content title', @@ -85,6 +77,15 @@ const getArgTypes = (data) => { }; } + argTypes.show_footer = { + type: 'boolean', + name: 'show footer', + description: 'Toggle footer visility', + table: { + category: 'Deprecated', + }, + }; + if (data.footer_link.link.label) { argTypes.footer_link_label = { name: 'footer link label', @@ -93,7 +94,7 @@ const getArgTypes = (data) => { table: { type: { summary: 'string' }, defaultValue: { summary: '' }, - category: 'Content', + category: 'Deprecated', }, if: { arg: 'show_footer' }, }; @@ -107,7 +108,7 @@ const getArgTypes = (data) => { table: { type: { summary: 'string' }, defaultValue: { summary: '' }, - category: 'Content', + category: 'Deprecated', }, if: { arg: 'show_footer' }, }; diff --git a/src/implementations/twig/components/featured-item/package.json b/src/implementations/twig/components/featured-item/package.json index de880805b91..aa3a7ff47ec 100644 --- a/src/implementations/twig/components/featured-item/package.json +++ b/src/implementations/twig/components/featured-item/package.json @@ -2,19 +2,19 @@ "name": "@ecl/twig-component-featured-item", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Featured item", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-link": "4.7.0", - "@ecl/twig-component-media-container": "4.7.0", - "@ecl/twig-component-picture": "4.7.0" + "@ecl/twig-component-link": "4.8.0", + "@ecl/twig-component-media-container": "4.8.0", + "@ecl/twig-component-picture": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-featured-item": "4.7.0", - "@ecl/vanilla-component-featured-item": "4.7.0" + "@ecl/specs-component-featured-item": "4.8.0", + "@ecl/vanilla-component-featured-item": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/file-upload/package.json b/src/implementations/twig/components/file-upload/package.json index feed5347035..dbcac8de890 100644 --- a/src/implementations/twig/components/file-upload/package.json +++ b/src/implementations/twig/components/file-upload/package.json @@ -2,15 +2,15 @@ "name": "@ecl/twig-component-file-upload", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL File Upload", "publishConfig": { "access": "public" }, "devDependencies": { - "@ecl/specs-component-file-upload": "4.7.0", - "@ecl/vanilla-component-file-upload": "4.7.0", - "@ecl/vanilla-component-form-group": "4.7.0" + "@ecl/specs-component-file-upload": "4.8.0", + "@ecl/vanilla-component-file-upload": "4.8.0", + "@ecl/vanilla-component-form-group": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/file/package.json b/src/implementations/twig/components/file/package.json index ce675578c89..e54375568de 100644 --- a/src/implementations/twig/components/file/package.json +++ b/src/implementations/twig/components/file/package.json @@ -2,22 +2,22 @@ "name": "@ecl/twig-component-file", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL File", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-button": "4.7.0", - "@ecl/twig-component-description-list": "4.7.0", - "@ecl/twig-component-icon": "4.7.0", - "@ecl/twig-component-label": "4.7.0", - "@ecl/twig-component-link": "4.7.0", - "@ecl/twig-component-picture": "4.7.0" + "@ecl/twig-component-button": "4.8.0", + "@ecl/twig-component-description-list": "4.8.0", + "@ecl/twig-component-icon": "4.8.0", + "@ecl/twig-component-label": "4.8.0", + "@ecl/twig-component-link": "4.8.0", + "@ecl/twig-component-picture": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-file": "4.7.0", - "@ecl/vanilla-component-file": "4.7.0" + "@ecl/specs-component-file": "4.8.0", + "@ecl/vanilla-component-file": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/form-group/package.json b/src/implementations/twig/components/form-group/package.json index da4daae94b4..85400d6ff1d 100644 --- a/src/implementations/twig/components/form-group/package.json +++ b/src/implementations/twig/components/form-group/package.json @@ -2,34 +2,34 @@ "name": "@ecl/twig-component-form-group", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Form group", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-checkbox": "4.7.0", - "@ecl/twig-component-datepicker": "4.7.0", - "@ecl/twig-component-file-upload": "4.7.0", - "@ecl/twig-component-icon": "4.7.0", - "@ecl/twig-component-radio": "4.7.0", - "@ecl/twig-component-range": "4.7.0", - "@ecl/twig-component-rating-field": "4.7.0", - "@ecl/twig-component-select": "4.7.0", - "@ecl/twig-component-text-area": "4.7.0", - "@ecl/twig-component-text-input": "4.7.0" + "@ecl/twig-component-checkbox": "4.8.0", + "@ecl/twig-component-datepicker": "4.8.0", + "@ecl/twig-component-file-upload": "4.8.0", + "@ecl/twig-component-icon": "4.8.0", + "@ecl/twig-component-radio": "4.8.0", + "@ecl/twig-component-range": "4.8.0", + "@ecl/twig-component-rating-field": "4.8.0", + "@ecl/twig-component-select": "4.8.0", + "@ecl/twig-component-text-area": "4.8.0", + "@ecl/twig-component-text-input": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-checkbox": "4.7.0", - "@ecl/specs-component-datepicker": "4.7.0", - "@ecl/specs-component-file-upload": "4.7.0", - "@ecl/specs-component-radio": "4.7.0", - "@ecl/specs-component-range": "4.7.0", - "@ecl/specs-component-rating-field": "4.7.0", - "@ecl/specs-component-select": "4.7.0", - "@ecl/specs-component-text-area": "4.7.0", - "@ecl/specs-component-text-input": "4.7.0", - "@ecl/vanilla-component-form-group": "4.7.0" + "@ecl/specs-component-checkbox": "4.8.0", + "@ecl/specs-component-datepicker": "4.8.0", + "@ecl/specs-component-file-upload": "4.8.0", + "@ecl/specs-component-radio": "4.8.0", + "@ecl/specs-component-range": "4.8.0", + "@ecl/specs-component-rating-field": "4.8.0", + "@ecl/specs-component-select": "4.8.0", + "@ecl/specs-component-text-area": "4.8.0", + "@ecl/specs-component-text-input": "4.8.0", + "@ecl/vanilla-component-form-group": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/gallery/package.json b/src/implementations/twig/components/gallery/package.json index 2d547021991..2d848b74612 100644 --- a/src/implementations/twig/components/gallery/package.json +++ b/src/implementations/twig/components/gallery/package.json @@ -2,21 +2,21 @@ "name": "@ecl/twig-component-gallery", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Gallery", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-button": "4.7.0", - "@ecl/twig-component-icon": "4.7.0", - "@ecl/twig-component-link": "4.7.0", - "@ecl/twig-component-picture": "4.7.0", - "@ecl/twig-component-video": "4.7.0" + "@ecl/twig-component-button": "4.8.0", + "@ecl/twig-component-icon": "4.8.0", + "@ecl/twig-component-link": "4.8.0", + "@ecl/twig-component-picture": "4.8.0", + "@ecl/twig-component-video": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-gallery": "4.7.0", - "@ecl/vanilla-component-gallery": "4.7.0" + "@ecl/specs-component-gallery": "4.8.0", + "@ecl/vanilla-component-gallery": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/icon/package.json b/src/implementations/twig/components/icon/package.json index 9569eebb03f..41e63bd5cbf 100644 --- a/src/implementations/twig/components/icon/package.json +++ b/src/implementations/twig/components/icon/package.json @@ -2,15 +2,15 @@ "name": "@ecl/twig-component-icon", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Icon", "publishConfig": { "access": "public" }, "devDependencies": { - "@ecl/resources-icons": "4.7.0", - "@ecl/specs-component-icon": "4.7.0", - "@ecl/vanilla-component-icon": "4.7.0" + "@ecl/resources-icons": "4.8.0", + "@ecl/specs-component-icon": "4.8.0", + "@ecl/vanilla-component-icon": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/inpage-navigation/package.json b/src/implementations/twig/components/inpage-navigation/package.json index 5f8c17c72cb..5587869c29d 100644 --- a/src/implementations/twig/components/inpage-navigation/package.json +++ b/src/implementations/twig/components/inpage-navigation/package.json @@ -2,18 +2,18 @@ "name": "@ecl/twig-component-inpage-navigation", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Inpage navigation", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-icon": "4.7.0", - "@ecl/twig-component-link": "4.7.0" + "@ecl/twig-component-icon": "4.8.0", + "@ecl/twig-component-link": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-inpage-navigation": "4.7.0", - "@ecl/vanilla-component-inpage-navigation": "4.7.0", + "@ecl/specs-component-inpage-navigation": "4.8.0", + "@ecl/vanilla-component-inpage-navigation": "4.8.0", "lorem-ipsum": "2.0.8" }, "repository": { diff --git a/src/implementations/twig/components/label/package.json b/src/implementations/twig/components/label/package.json index 2c5082ea9ae..d6f90ea6204 100644 --- a/src/implementations/twig/components/label/package.json +++ b/src/implementations/twig/components/label/package.json @@ -2,14 +2,14 @@ "name": "@ecl/twig-component-label", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Label", "publishConfig": { "access": "public" }, "devDependencies": { - "@ecl/specs-component-label": "4.7.0", - "@ecl/vanilla-component-label": "4.7.0" + "@ecl/specs-component-label": "4.8.0", + "@ecl/vanilla-component-label": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/link/package.json b/src/implementations/twig/components/link/package.json index 8b4113e43eb..1615d23c4a1 100644 --- a/src/implementations/twig/components/link/package.json +++ b/src/implementations/twig/components/link/package.json @@ -2,17 +2,17 @@ "name": "@ecl/twig-component-link", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Link", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-icon": "4.7.0" + "@ecl/twig-component-icon": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-link": "4.7.0", - "@ecl/vanilla-component-link": "4.7.0" + "@ecl/specs-component-link": "4.8.0", + "@ecl/vanilla-component-link": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/list-illustration/package.json b/src/implementations/twig/components/list-illustration/package.json index b3fb0f8d40d..e6f47633e85 100644 --- a/src/implementations/twig/components/list-illustration/package.json +++ b/src/implementations/twig/components/list-illustration/package.json @@ -2,18 +2,18 @@ "name": "@ecl/twig-component-list-illustration", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL List with illustration", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-icon": "4.7.0", - "@ecl/twig-component-picture": "4.7.0" + "@ecl/twig-component-icon": "4.8.0", + "@ecl/twig-component-picture": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-list-illustration": "4.7.0", - "@ecl/vanilla-component-list-illustration": "4.7.0" + "@ecl/specs-component-list-illustration": "4.8.0", + "@ecl/vanilla-component-list-illustration": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/media-container/package.json b/src/implementations/twig/components/media-container/package.json index d48dfcc95f3..f4e114c0189 100644 --- a/src/implementations/twig/components/media-container/package.json +++ b/src/implementations/twig/components/media-container/package.json @@ -2,20 +2,20 @@ "name": "@ecl/twig-component-media-container", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Media Container", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-expandable": "4.7.0", - "@ecl/twig-component-picture": "4.7.0", - "@ecl/twig-component-video": "4.7.0" + "@ecl/twig-component-expandable": "4.8.0", + "@ecl/twig-component-picture": "4.8.0", + "@ecl/twig-component-video": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-media-container": "4.7.0", - "@ecl/specs-component-video": "4.7.0", - "@ecl/vanilla-component-media-container": "4.7.0" + "@ecl/specs-component-media-container": "4.8.0", + "@ecl/specs-component-video": "4.8.0", + "@ecl/vanilla-component-media-container": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/mega-menu/__snapshots__/mega-menu.test.js.snap b/src/implementations/twig/components/mega-menu/__snapshots__/mega-menu.test.js.snap index a0dd3c8e859..566a201102e 100644 --- a/src/implementations/twig/components/mega-menu/__snapshots__/mega-menu.test.js.snap +++ b/src/implementations/twig/components/mega-menu/__snapshots__/mega-menu.test.js.snap @@ -1083,7 +1083,18 @@ exports[`Mega Menu Default renders correctly 1`] = `
-
+
+

+ Minimal demo content for the container option +

+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer placerat magna quis ultricies hendrerit. Suspendisse fermentum elit id hendrerit suscipit. +

+
@@ -2192,7 +2203,18 @@ exports[`Mega Menu Default renders correctly with external items in the first le
-
+
+

+ Minimal demo content for the container option +

+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer placerat magna quis ultricies hendrerit. Suspendisse fermentum elit id hendrerit suscipit. +

+
@@ -3303,7 +3325,18 @@ exports[`Mega Menu Default renders correctly with extra attributes 1`] = `
-
+
+

+ Minimal demo content for the container option +

+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer placerat magna quis ultricies hendrerit. Suspendisse fermentum elit id hendrerit suscipit. +

+
@@ -4413,7 +4446,18 @@ exports[`Mega Menu Default renders correctly with extra attributes for the featu
-
+
+

+ Minimal demo content for the container option +

+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer placerat magna quis ultricies hendrerit. Suspendisse fermentum elit id hendrerit suscipit. +

+
@@ -5523,7 +5567,18 @@ exports[`Mega Menu Default renders correctly with extra attributes for the fist
-
+
+

+ Minimal demo content for the container option +

+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer placerat magna quis ultricies hendrerit. Suspendisse fermentum elit id hendrerit suscipit. +

+
@@ -6633,7 +6688,18 @@ exports[`Mega Menu Default renders correctly with extra attributes for the secon
-
+
+

+ Minimal demo content for the container option +

+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer placerat magna quis ultricies hendrerit. Suspendisse fermentum elit id hendrerit suscipit. +

+
@@ -7743,7 +7809,18 @@ exports[`Mega Menu Default renders correctly with extra attributes for the see a
-
+
+

+ Minimal demo content for the container option +

+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer placerat magna quis ultricies hendrerit. Suspendisse fermentum elit id hendrerit suscipit. +

+
@@ -8852,7 +8929,18 @@ exports[`Mega Menu Default renders correctly with extra class names 1`] = `
-
+
+

+ Minimal demo content for the container option +

+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer placerat magna quis ultricies hendrerit. Suspendisse fermentum elit id hendrerit suscipit. +

+
diff --git a/src/implementations/twig/components/mega-menu/package.json b/src/implementations/twig/components/mega-menu/package.json index 41d06da4b7f..24ab4a13fed 100644 --- a/src/implementations/twig/components/mega-menu/package.json +++ b/src/implementations/twig/components/mega-menu/package.json @@ -2,18 +2,18 @@ "name": "@ecl/twig-component-mega-menu", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Mega Menu", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-button": "4.7.0", - "@ecl/twig-component-link": "4.7.0" + "@ecl/twig-component-button": "4.8.0", + "@ecl/twig-component-link": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-mega-menu": "4.7.0", - "@ecl/vanilla-component-mega-menu": "4.7.0" + "@ecl/specs-component-mega-menu": "4.8.0", + "@ecl/vanilla-component-mega-menu": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/menu/package.json b/src/implementations/twig/components/menu/package.json index 86ff823a4e6..748f5c779e1 100644 --- a/src/implementations/twig/components/menu/package.json +++ b/src/implementations/twig/components/menu/package.json @@ -2,18 +2,18 @@ "name": "@ecl/twig-component-menu", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Menu", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-button": "4.7.0", - "@ecl/twig-component-link": "4.7.0" + "@ecl/twig-component-button": "4.8.0", + "@ecl/twig-component-link": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-menu": "4.7.0", - "@ecl/vanilla-component-menu": "4.7.0" + "@ecl/specs-component-menu": "4.8.0", + "@ecl/vanilla-component-menu": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/modal/package.json b/src/implementations/twig/components/modal/package.json index f8779dbadf2..7456357a0a1 100644 --- a/src/implementations/twig/components/modal/package.json +++ b/src/implementations/twig/components/modal/package.json @@ -2,18 +2,18 @@ "name": "@ecl/twig-component-modal", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Modal", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-button": "4.7.0", - "@ecl/twig-component-icon": "4.7.0" + "@ecl/twig-component-button": "4.8.0", + "@ecl/twig-component-icon": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-modal": "4.7.0", - "@ecl/vanilla-component-modal": "4.7.0" + "@ecl/specs-component-modal": "4.8.0", + "@ecl/vanilla-component-modal": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/navigation-list/package.json b/src/implementations/twig/components/navigation-list/package.json index ae95e4ce4bb..af3fcff1e57 100644 --- a/src/implementations/twig/components/navigation-list/package.json +++ b/src/implementations/twig/components/navigation-list/package.json @@ -2,18 +2,18 @@ "name": "@ecl/twig-component-navigation-list", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Navigation List", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-content-block": "4.7.0", - "@ecl/twig-component-picture": "4.7.0" + "@ecl/twig-component-content-block": "4.8.0", + "@ecl/twig-component-picture": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-navigation-list": "4.7.0", - "@ecl/vanilla-component-navigation-list": "4.7.0" + "@ecl/specs-component-navigation-list": "4.8.0", + "@ecl/vanilla-component-navigation-list": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/news-ticker/package.json b/src/implementations/twig/components/news-ticker/package.json index d2c79eba39d..95b8158b8a0 100644 --- a/src/implementations/twig/components/news-ticker/package.json +++ b/src/implementations/twig/components/news-ticker/package.json @@ -2,19 +2,19 @@ "name": "@ecl/twig-component-news-ticker", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL News ticker", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-button": "4.7.0", - "@ecl/twig-component-icon": "4.7.0", - "@ecl/twig-component-link": "4.7.0" + "@ecl/twig-component-button": "4.8.0", + "@ecl/twig-component-icon": "4.8.0", + "@ecl/twig-component-link": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-news-ticker": "4.7.0", - "@ecl/vanilla-component-news-ticker": "4.7.0" + "@ecl/specs-component-news-ticker": "4.8.0", + "@ecl/vanilla-component-news-ticker": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/notification/README.md b/src/implementations/twig/components/notification/README.md index c6184d249b0..cb2d9eeec3f 100644 --- a/src/implementations/twig/components/notification/README.md +++ b/src/implementations/twig/components/notification/README.md @@ -12,6 +12,8 @@ npm install --save @ecl/twig-component-notification - **"icon"** (object of type "icon") (default: {}) - **"sr_icon"** (string) (default: ''): additional label for the icon; for screen readers - **"title"** (string) (default: '') +- **"description"** (string) (default: '') +- **"links"** (array) (default: []) - **"close"** (object of type "button") (default: {}): close button (optional) - **"extra_classes"** (optional) (string) (default: '') Extra classes (space separated) - **"extra_attributes"** (optional) (array) (default: []) Extra attributes diff --git a/src/implementations/twig/components/notification/__snapshots__/notification.test.js.snap b/src/implementations/twig/components/notification/__snapshots__/notification.test.js.snap index a9ae86e6cbb..65f0d522ce6 100644 --- a/src/implementations/twig/components/notification/__snapshots__/notification.test.js.snap +++ b/src/implementations/twig/components/notification/__snapshots__/notification.test.js.snap @@ -125,6 +125,26 @@ exports[`EC Notification Info renders correctly 1`] = ` > Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam accumsan semper lorem, ac mollis lacus tincidunt eu. Duis scelerisque diam eu tempus fringilla. + + @@ -192,6 +212,26 @@ exports[`EC Notification Info renders correctly with extra attributes 1`] = ` > Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam accumsan semper lorem, ac mollis lacus tincidunt eu. Duis scelerisque diam eu tempus fringilla. + + @@ -257,6 +297,26 @@ exports[`EC Notification Info renders correctly with extra class names 1`] = ` > Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam accumsan semper lorem, ac mollis lacus tincidunt eu. Duis scelerisque diam eu tempus fringilla. + + @@ -317,6 +377,26 @@ exports[`EC Notification Info renders correctly without description 1`] = ` > Information notification + + @@ -377,6 +457,26 @@ exports[`EC Notification Info renders correctly without title 1`] = ` > Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam accumsan semper lorem, ac mollis lacus tincidunt eu. Duis scelerisque diam eu tempus fringilla. + + @@ -640,6 +740,26 @@ exports[`EU Notification Info renders correctly 1`] = ` > Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam accumsan semper lorem, ac mollis lacus tincidunt eu. Duis scelerisque diam eu tempus fringilla. + + @@ -707,6 +827,26 @@ exports[`EU Notification Info renders correctly with extra attributes 1`] = ` > Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam accumsan semper lorem, ac mollis lacus tincidunt eu. Duis scelerisque diam eu tempus fringilla. + + @@ -772,6 +912,26 @@ exports[`EU Notification Info renders correctly with extra class names 1`] = ` > Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam accumsan semper lorem, ac mollis lacus tincidunt eu. Duis scelerisque diam eu tempus fringilla. + + @@ -832,6 +992,26 @@ exports[`EU Notification Info renders correctly without description 1`] = ` > Information notification + + @@ -892,6 +1072,26 @@ exports[`EU Notification Info renders correctly without title 1`] = ` > Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam accumsan semper lorem, ac mollis lacus tincidunt eu. Duis scelerisque diam eu tempus fringilla. + + diff --git a/src/implementations/twig/components/notification/notification.html.twig b/src/implementations/twig/components/notification/notification.html.twig index b6dbac990aa..8490c46608d 100644 --- a/src/implementations/twig/components/notification/notification.html.twig +++ b/src/implementations/twig/components/notification/notification.html.twig @@ -6,6 +6,8 @@ - "icon" (object of type "icon") (default: {}) - "sr_icon" (string) (default: ''): additional label for the icon; for screen readers - "title" (string) (default: '') + - "description" (string) (default: '') + - "links" (array): An array of ECL links objects - "close" (object of type "button") (default: {}): close button (optional) - "extra_classes" (optional) (string) (default: '') Extra classes (space separated) for the select - "extra_attributes" (optional) (array) (default: []) Extra attributes for select @@ -23,6 +25,7 @@ {% set _sr_icon = sr_icon|default('') %} {% set _title = title|default('') %} {% set _close = close|default({}) %} +{% set _links = links|default([]) %} {% set _description = description|default('') %} {% set _css_class = 'ecl-notification' %} {% set _extra_attributes = 'data-ecl-auto-init="Notification"' %} @@ -67,23 +70,29 @@ extra_classes: 'ecl-notification__icon', } only %}
- {% if _close is not empty %} - {% include '@ecl/button/button.html.twig' with _close|merge({ - type: 'button', - variant: 'tertiary', - extra_classes: 'ecl-notification__close', - extra_attributes: [{ - name: 'data-ecl-notification-close', - }], - }) only %} - {% endif %} - - {% if _title is not empty %} -
{{ _title }}
- {% endif %} - {% if _description is not empty %} -
{{ _description }}
- {% endif %} + {% if _close is not empty %} + {% include '@ecl/button/button.html.twig' with _close|merge({ + type: 'button', + variant: 'tertiary', + extra_classes: 'ecl-notification__close', + extra_attributes: [{ + name: 'data-ecl-notification-close', + }], + }) only %} + {% endif %} + {% if _title is not empty %} +
{{ _title }}
+ {% endif %} + {% if _description is not empty %} +
{{ _description }}
+ {% endif %} + {% if _links is not empty and _links is iterable %} + {% for _link in _links %} + + {% endfor %} + {% endif %}
diff --git a/src/implementations/twig/components/notification/notification.story.js b/src/implementations/twig/components/notification/notification.story.js index b07a7bfb48a..08f9b7ceb2a 100644 --- a/src/implementations/twig/components/notification/notification.story.js +++ b/src/implementations/twig/components/notification/notification.story.js @@ -21,11 +21,13 @@ const dataInfo = system === 'eu' ? dataInfoEu : dataInfoEc; const dataSuccess = system === 'eu' ? dataSuccessEu : dataSuccessEc; const dataError = system === 'eu' ? dataErrorEu : dataErrorEc; const dataWarning = system === 'eu' ? dataWarningEu : dataWarningEc; +const dataLinks = [...dataInfo.links]; const getArgs = (data) => ({ show_close: true, show_title: true, title: data.title, + show_links: true, description: data.description, }); @@ -46,6 +48,14 @@ const getArgTypes = () => ({ category: 'Optional', }, }, + show_links: { + name: 'links', + type: { name: 'boolean' }, + description: 'Show the notification links', + table: { + category: 'Optional', + }, + }, title: { name: 'title', type: { name: 'string' }, @@ -80,6 +90,12 @@ const prepareData = (data, args) => { delete clone.close; } + if (args.show_links) { + clone.links = dataLinks; + } else { + clone.links = []; + } + // Other controls if (clone.title) { clone.title = args.title; diff --git a/src/implementations/twig/components/notification/package.json b/src/implementations/twig/components/notification/package.json index e57af4e6bfd..1c23f14f147 100644 --- a/src/implementations/twig/components/notification/package.json +++ b/src/implementations/twig/components/notification/package.json @@ -2,18 +2,18 @@ "name": "@ecl/twig-component-notification", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Notification", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-button": "4.7.0", - "@ecl/twig-component-icon": "4.7.0" + "@ecl/twig-component-button": "4.8.0", + "@ecl/twig-component-icon": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-notification": "4.7.0", - "@ecl/vanilla-component-notification": "4.7.0" + "@ecl/specs-component-notification": "4.8.0", + "@ecl/vanilla-component-notification": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/ordered-list/package.json b/src/implementations/twig/components/ordered-list/package.json index 9e0b8dff31c..3ca4507cfab 100644 --- a/src/implementations/twig/components/ordered-list/package.json +++ b/src/implementations/twig/components/ordered-list/package.json @@ -2,14 +2,14 @@ "name": "@ecl/twig-component-ordered-list", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Ordered list", "publishConfig": { "access": "public" }, "devDependencies": { - "@ecl/specs-component-ordered-list": "4.7.0", - "@ecl/vanilla-component-ordered-list": "4.7.0" + "@ecl/specs-component-ordered-list": "4.8.0", + "@ecl/vanilla-component-ordered-list": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/page-header/package.json b/src/implementations/twig/components/page-header/package.json index f2261e72c0a..33b47c4d62a 100644 --- a/src/implementations/twig/components/page-header/package.json +++ b/src/implementations/twig/components/page-header/package.json @@ -2,19 +2,19 @@ "name": "@ecl/twig-component-page-header", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Page Header", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-breadcrumb": "4.7.0", - "@ecl/twig-component-picture": "4.7.0" + "@ecl/twig-component-breadcrumb": "4.8.0", + "@ecl/twig-component-picture": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-breadcrumb": "4.7.0", - "@ecl/specs-component-page-header": "4.7.0", - "@ecl/vanilla-component-page-header": "4.7.0" + "@ecl/specs-component-breadcrumb": "4.8.0", + "@ecl/specs-component-page-header": "4.8.0", + "@ecl/vanilla-component-page-header": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/pagination/package.json b/src/implementations/twig/components/pagination/package.json index de8056fb894..86f42ef91b0 100644 --- a/src/implementations/twig/components/pagination/package.json +++ b/src/implementations/twig/components/pagination/package.json @@ -2,17 +2,17 @@ "name": "@ecl/twig-component-pagination", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Pagination", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-link": "4.7.0" + "@ecl/twig-component-link": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-pagination": "4.7.0", - "@ecl/vanilla-component-pagination": "4.7.0" + "@ecl/specs-component-pagination": "4.8.0", + "@ecl/vanilla-component-pagination": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/picture/package.json b/src/implementations/twig/components/picture/package.json index 63491bc0385..58559e7349c 100644 --- a/src/implementations/twig/components/picture/package.json +++ b/src/implementations/twig/components/picture/package.json @@ -2,13 +2,13 @@ "name": "@ecl/twig-component-picture", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Picture", "publishConfig": { "access": "public" }, "devDependencies": { - "@ecl/specs-component-picture": "4.7.0" + "@ecl/specs-component-picture": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/popover/package.json b/src/implementations/twig/components/popover/package.json index 0d3de2f9b78..a1f7d3a3c6c 100644 --- a/src/implementations/twig/components/popover/package.json +++ b/src/implementations/twig/components/popover/package.json @@ -2,17 +2,17 @@ "name": "@ecl/twig-component-popover", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Popover", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-link": "4.7.0" + "@ecl/twig-component-link": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-popover": "4.7.0", - "@ecl/vanilla-component-popover": "4.7.0" + "@ecl/specs-component-popover": "4.8.0", + "@ecl/vanilla-component-popover": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/radio/package.json b/src/implementations/twig/components/radio/package.json index 15abda6b7fa..700d7665f42 100644 --- a/src/implementations/twig/components/radio/package.json +++ b/src/implementations/twig/components/radio/package.json @@ -2,15 +2,15 @@ "name": "@ecl/twig-component-radio", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Radio", "publishConfig": { "access": "public" }, "devDependencies": { - "@ecl/specs-component-radio": "4.7.0", - "@ecl/vanilla-component-form-group": "4.7.0", - "@ecl/vanilla-component-radio": "4.7.0" + "@ecl/specs-component-radio": "4.8.0", + "@ecl/vanilla-component-form-group": "4.8.0", + "@ecl/vanilla-component-radio": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/range/package.json b/src/implementations/twig/components/range/package.json index a7233c8c08d..3d9880a7532 100644 --- a/src/implementations/twig/components/range/package.json +++ b/src/implementations/twig/components/range/package.json @@ -2,15 +2,15 @@ "name": "@ecl/twig-component-range", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Range", "publishConfig": { "access": "public" }, "devDependencies": { - "@ecl/specs-component-range": "4.7.0", - "@ecl/vanilla-component-form-group": "4.7.0", - "@ecl/vanilla-component-range": "4.7.0" + "@ecl/specs-component-range": "4.8.0", + "@ecl/vanilla-component-form-group": "4.8.0", + "@ecl/vanilla-component-range": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/rating-field/package.json b/src/implementations/twig/components/rating-field/package.json index d245ecf63ee..116a837ceb6 100644 --- a/src/implementations/twig/components/rating-field/package.json +++ b/src/implementations/twig/components/rating-field/package.json @@ -2,18 +2,18 @@ "name": "@ecl/twig-component-rating-field", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Rating field", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-icon": "4.7.0" + "@ecl/twig-component-icon": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-rating-field": "4.7.0", - "@ecl/vanilla-component-form-group": "4.7.0", - "@ecl/vanilla-component-rating-field": "4.7.0" + "@ecl/specs-component-rating-field": "4.8.0", + "@ecl/vanilla-component-form-group": "4.8.0", + "@ecl/vanilla-component-rating-field": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/search-form/package.json b/src/implementations/twig/components/search-form/package.json index 453e9275700..f94dad5ecb7 100644 --- a/src/implementations/twig/components/search-form/package.json +++ b/src/implementations/twig/components/search-form/package.json @@ -2,19 +2,19 @@ "name": "@ecl/twig-component-search-form", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Search Form", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-button": "4.7.0", - "@ecl/twig-component-form-group": "4.7.0" + "@ecl/twig-component-button": "4.8.0", + "@ecl/twig-component-form-group": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-search-form": "4.7.0", - "@ecl/vanilla-component-form-group": "4.7.0", - "@ecl/vanilla-component-search-form": "4.7.0" + "@ecl/specs-component-search-form": "4.8.0", + "@ecl/vanilla-component-form-group": "4.8.0", + "@ecl/vanilla-component-search-form": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/select/package.json b/src/implementations/twig/components/select/package.json index d175fa464ee..f7e897e2ce2 100644 --- a/src/implementations/twig/components/select/package.json +++ b/src/implementations/twig/components/select/package.json @@ -2,18 +2,18 @@ "name": "@ecl/twig-component-select", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Select", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-button": "4.7.0" + "@ecl/twig-component-button": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-select": "4.7.0", - "@ecl/vanilla-component-form-group": "4.7.0", - "@ecl/vanilla-component-select": "4.7.0" + "@ecl/specs-component-select": "4.8.0", + "@ecl/vanilla-component-form-group": "4.8.0", + "@ecl/vanilla-component-select": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/separator/package.json b/src/implementations/twig/components/separator/package.json index 4d04feac790..30e647ae9f3 100644 --- a/src/implementations/twig/components/separator/package.json +++ b/src/implementations/twig/components/separator/package.json @@ -2,13 +2,13 @@ "name": "@ecl/twig-component-separator", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Separator", "publishConfig": { "access": "public" }, "devDependencies": { - "@ecl/vanilla-component-separator": "4.7.0" + "@ecl/vanilla-component-separator": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/site-footer/package.json b/src/implementations/twig/components/site-footer/package.json index ed57846139a..fa3b36e602a 100644 --- a/src/implementations/twig/components/site-footer/package.json +++ b/src/implementations/twig/components/site-footer/package.json @@ -2,20 +2,20 @@ "name": "@ecl/twig-component-site-footer", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Site Footer", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-link": "4.7.0", - "@ecl/twig-component-picture": "4.7.0" + "@ecl/twig-component-link": "4.8.0", + "@ecl/twig-component-picture": "4.8.0" }, "devDependencies": { - "@ecl/resources-ec-logo": "4.7.0", - "@ecl/resources-eu-logo": "4.7.0", - "@ecl/specs-component-site-footer": "4.7.0", - "@ecl/vanilla-component-site-footer": "4.7.0" + "@ecl/resources-ec-logo": "4.8.0", + "@ecl/resources-eu-logo": "4.8.0", + "@ecl/specs-component-site-footer": "4.8.0", + "@ecl/vanilla-component-site-footer": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/site-header/__snapshots__/site-header.test.js.snap b/src/implementations/twig/components/site-header/__snapshots__/site-header.test.js.snap index fca56ddcf80..055175b45ab 100644 --- a/src/implementations/twig/components/site-header/__snapshots__/site-header.test.js.snap +++ b/src/implementations/twig/components/site-header/__snapshots__/site-header.test.js.snap @@ -981,6 +981,7 @@ exports[`Site Header EC renders correctly 1`] = ` class="ecl-notification ecl-notification--info" data-ecl-auto-init="Notification" data-ecl-notification="" + data-ecl-site-header-notification="" role="alert" > + + + Close + + + +
- Information notification + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam accumsan semper lorem.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam accumsan semper lorem, ac mollis lacus tincidunt eu. Duis scelerisque diam eu tempus fringilla. + + Lorem ipsum + +
+ @@ -2063,6 +2105,7 @@ exports[`Site Header EC renders correctly when logged in 1`] = ` class="ecl-notification ecl-notification--info" data-ecl-auto-init="Notification" data-ecl-notification="" + data-ecl-site-header-notification="" role="alert" > + + + Close + + + +
- Information notification + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam accumsan semper lorem.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam accumsan semper lorem, ac mollis lacus tincidunt eu. Duis scelerisque diam eu tempus fringilla. + + Lorem ipsum + +
+ @@ -3125,6 +3209,7 @@ exports[`Site Header EC renders correctly with extra attributes 1`] = ` class="ecl-notification ecl-notification--info" data-ecl-auto-init="Notification" data-ecl-notification="" + data-ecl-site-header-notification="" role="alert" > + + + Close + + + + +
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam accumsan semper lorem. +
- Information notification + + Lorem ipsum +
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam accumsan semper lorem, ac mollis lacus tincidunt eu. Duis scelerisque diam eu tempus fringilla. + + Nullam accumsan semper lorem +
@@ -4185,6 +4311,7 @@ exports[`Site Header EC renders correctly with extra class names 1`] = ` class="ecl-notification ecl-notification--info" data-ecl-auto-init="Notification" data-ecl-notification="" + data-ecl-site-header-notification="" role="alert" > + + + Close + + + +
- Information notification + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam accumsan semper lorem.
+ + Lorem ipsum + +
+ @@ -5245,6 +5413,7 @@ exports[`Site Header EU renders correctly 1`] = ` class="ecl-notification ecl-notification--info" data-ecl-auto-init="Notification" data-ecl-notification="" + data-ecl-site-header-notification="" role="alert" > + + + Close + + + +
- Information notification + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam accumsan semper lorem.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam accumsan semper lorem, ac mollis lacus tincidunt eu. Duis scelerisque diam eu tempus fringilla. + + Lorem ipsum + +
+ diff --git a/src/implementations/twig/components/site-header/ec-site-header.story.js b/src/implementations/twig/components/site-header/ec-site-header.story.js index ff9031115eb..eace3873259 100644 --- a/src/implementations/twig/components/site-header/ec-site-header.story.js +++ b/src/implementations/twig/components/site-header/ec-site-header.story.js @@ -16,6 +16,7 @@ const dataFull = { ...dataFullEC }; const clonedDataFull = { ...dataFull }; const enMenu = { ...enDataMenu }; const enMegaMenu = { ...enDataMegaMenu }; +const closeButton = { ...dataFull.notification.close }; // Core const dataCore = JSON.parse(JSON.stringify(dataFull)); @@ -41,6 +42,7 @@ const getArgs = (data) => { show_language_selector: true, show_search: true, show_notification: false, + show_notification_close: true, }; if (data.login_box) { @@ -115,6 +117,15 @@ const getArgTypes = (data) => { category: 'Optional', }, }; + argTypes.show_notification_close = { + name: 'notification close button', + type: { name: 'boolean' }, + description: 'Show the notification close button', + table: { + category: 'Optional', + }, + if: { arg: 'show_notification' }, + }; } if (data.banner_top) { argTypes.show_banner_top = { @@ -294,6 +305,11 @@ const prepareData = (data, args) => { delete data.notification; } else { data.notification = clonedDataFull.notification; + if (!args.show_notification_close) { + delete clonedDataFull.notification.close; + } else { + clonedDataFull.notification.close = closeButton; + } } correctPaths(data); diff --git a/src/implementations/twig/components/site-header/eu-site-header.story.js b/src/implementations/twig/components/site-header/eu-site-header.story.js index 33a029f7e10..b104846b471 100644 --- a/src/implementations/twig/components/site-header/eu-site-header.story.js +++ b/src/implementations/twig/components/site-header/eu-site-header.story.js @@ -16,6 +16,7 @@ const dataFull = { ...dataFullEU }; const clonedDataFull = { ...dataFull }; const enMenu = { ...enDataMenu }; const enMegaMenu = { ...enDataMegaMenu }; +const closeButton = { ...dataFull.notification.close }; // Core const dataCore = JSON.parse(JSON.stringify(dataFull)); @@ -34,6 +35,7 @@ const getArgs = (data) => { show_language_selector: true, show_search: true, show_notification: false, + show_notification_close: true, logo_size: 'medium', }; @@ -109,6 +111,15 @@ const getArgTypes = (data) => { category: 'Optional', }, }; + argTypes.show_notification_close = { + name: 'notification close button', + type: { name: 'boolean' }, + description: 'Show the notification close button', + table: { + category: 'Optional', + }, + if: { arg: 'show_notification' }, + }; } if (data.has_menu) { argTypes.show_menu = { @@ -282,6 +293,11 @@ const prepareData = (data, args) => { delete data.notification; } else { data.notification = clonedDataFull.notification; + if (!args.show_notification_close) { + delete clonedDataFull.notification.close; + } else { + clonedDataFull.notification.close = closeButton; + } } data.logged = args.logged; diff --git a/src/implementations/twig/components/site-header/package.json b/src/implementations/twig/components/site-header/package.json index 13a2e10e5be..952f3741e89 100644 --- a/src/implementations/twig/components/site-header/package.json +++ b/src/implementations/twig/components/site-header/package.json @@ -2,25 +2,25 @@ "name": "@ecl/twig-component-site-header", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Site Header", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-button": "4.7.0", - "@ecl/twig-component-icon": "4.7.0", - "@ecl/twig-component-link": "4.7.0", - "@ecl/twig-component-menu": "4.7.0", - "@ecl/twig-component-notification": "4.7.0", - "@ecl/twig-component-picture": "4.7.0", - "@ecl/twig-component-search-form": "4.7.0" + "@ecl/twig-component-button": "4.8.0", + "@ecl/twig-component-icon": "4.8.0", + "@ecl/twig-component-link": "4.8.0", + "@ecl/twig-component-menu": "4.8.0", + "@ecl/twig-component-notification": "4.8.0", + "@ecl/twig-component-picture": "4.8.0", + "@ecl/twig-component-search-form": "4.8.0" }, "devDependencies": { - "@ecl/resources-ec-logo": "4.7.0", - "@ecl/resources-eu-logo": "4.7.0", - "@ecl/specs-component-site-header": "4.7.0", - "@ecl/vanilla-component-site-header": "4.7.0" + "@ecl/resources-ec-logo": "4.8.0", + "@ecl/resources-eu-logo": "4.8.0", + "@ecl/specs-component-site-header": "4.8.0", + "@ecl/vanilla-component-site-header": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/site-header/site-header.html.twig b/src/implementations/twig/components/site-header/site-header.html.twig index bc0830d4b23..69a457a0780 100644 --- a/src/implementations/twig/components/site-header/site-header.html.twig +++ b/src/implementations/twig/components/site-header/site-header.html.twig @@ -370,7 +370,11 @@ {% if _notification is defined and _notification is not empty %}
- {% include '@ecl/notification/notification.html.twig' with _notification only %} + {% include '@ecl/notification/notification.html.twig' with _notification|merge({ + extra_attributes: _notification.extra_attributes|default([])|merge([{ + name: 'data-ecl-site-header-notification', + }]), + }) only %}
{% endif %} diff --git a/src/implementations/twig/components/skip-link/package.json b/src/implementations/twig/components/skip-link/package.json index 342ef39648c..a199237e256 100644 --- a/src/implementations/twig/components/skip-link/package.json +++ b/src/implementations/twig/components/skip-link/package.json @@ -2,17 +2,17 @@ "name": "@ecl/twig-component-skip-link", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL skip-link", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-link": "4.7.0" + "@ecl/twig-component-link": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-skip-link": "4.7.0", - "@ecl/vanilla-component-skip-link": "4.7.0" + "@ecl/specs-component-skip-link": "4.8.0", + "@ecl/vanilla-component-skip-link": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/social-media-follow/package.json b/src/implementations/twig/components/social-media-follow/package.json index 09c06779949..2e16e590132 100644 --- a/src/implementations/twig/components/social-media-follow/package.json +++ b/src/implementations/twig/components/social-media-follow/package.json @@ -2,17 +2,17 @@ "name": "@ecl/twig-component-social-media-follow", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Social Media Follow", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-link": "4.7.0" + "@ecl/twig-component-link": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-social-media-follow": "4.7.0", - "@ecl/vanilla-component-social-media-follow": "4.7.0" + "@ecl/specs-component-social-media-follow": "4.8.0", + "@ecl/vanilla-component-social-media-follow": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/social-media-share/package.json b/src/implementations/twig/components/social-media-share/package.json index a51d2e817b2..5fbc6147111 100644 --- a/src/implementations/twig/components/social-media-share/package.json +++ b/src/implementations/twig/components/social-media-share/package.json @@ -2,18 +2,18 @@ "name": "@ecl/twig-component-social-media-share", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Social Media Share", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-link": "4.7.0", - "@ecl/twig-component-popover": "4.7.0" + "@ecl/twig-component-link": "4.8.0", + "@ecl/twig-component-popover": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-social-media-share": "4.7.0", - "@ecl/vanilla-component-social-media-share": "4.7.0" + "@ecl/specs-component-social-media-share": "4.8.0", + "@ecl/vanilla-component-social-media-share": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/spinner/package.json b/src/implementations/twig/components/spinner/package.json index 8e3390c17db..254177986dd 100644 --- a/src/implementations/twig/components/spinner/package.json +++ b/src/implementations/twig/components/spinner/package.json @@ -2,14 +2,14 @@ "name": "@ecl/twig-component-spinner", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Spinner", "publishConfig": { "access": "public" }, "devDependencies": { - "@ecl/specs-component-spinner": "4.7.0", - "@ecl/vanilla-component-spinner": "4.7.0" + "@ecl/specs-component-spinner": "4.8.0", + "@ecl/vanilla-component-spinner": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/splash-page/package.json b/src/implementations/twig/components/splash-page/package.json index 10b7fb1001b..937de8be600 100644 --- a/src/implementations/twig/components/splash-page/package.json +++ b/src/implementations/twig/components/splash-page/package.json @@ -2,21 +2,21 @@ "name": "@ecl/twig-component-splash-page", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Splash Page", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-icon": "4.7.0", - "@ecl/twig-component-link": "4.7.0", - "@ecl/twig-component-picture": "4.7.0" + "@ecl/twig-component-icon": "4.8.0", + "@ecl/twig-component-link": "4.8.0", + "@ecl/twig-component-picture": "4.8.0" }, "devDependencies": { - "@ecl/resources-ec-logo": "4.7.0", - "@ecl/resources-eu-logo": "4.7.0", - "@ecl/specs-component-splash-page": "4.7.0", - "@ecl/vanilla-component-splash-page": "4.7.0" + "@ecl/resources-ec-logo": "4.8.0", + "@ecl/resources-eu-logo": "4.8.0", + "@ecl/specs-component-splash-page": "4.8.0", + "@ecl/vanilla-component-splash-page": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/table/package.json b/src/implementations/twig/components/table/package.json index eba65476743..3035d142a6f 100644 --- a/src/implementations/twig/components/table/package.json +++ b/src/implementations/twig/components/table/package.json @@ -2,14 +2,14 @@ "name": "@ecl/twig-component-table", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Table", "publishConfig": { "access": "public" }, "devDependencies": { - "@ecl/specs-component-table": "4.7.0", - "@ecl/vanilla-component-table": "4.7.0" + "@ecl/specs-component-table": "4.8.0", + "@ecl/vanilla-component-table": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/tabs/package.json b/src/implementations/twig/components/tabs/package.json index 321a7f75787..d710794ab81 100644 --- a/src/implementations/twig/components/tabs/package.json +++ b/src/implementations/twig/components/tabs/package.json @@ -2,18 +2,18 @@ "name": "@ecl/twig-component-tabs", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Tabs", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-button": "4.7.0", - "@ecl/twig-component-link": "4.7.0" + "@ecl/twig-component-button": "4.8.0", + "@ecl/twig-component-link": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-tabs": "4.7.0", - "@ecl/vanilla-component-tabs": "4.7.0" + "@ecl/specs-component-tabs": "4.8.0", + "@ecl/vanilla-component-tabs": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/tag/package.json b/src/implementations/twig/components/tag/package.json index 8170614d770..b2eda07ca25 100644 --- a/src/implementations/twig/components/tag/package.json +++ b/src/implementations/twig/components/tag/package.json @@ -2,17 +2,17 @@ "name": "@ecl/twig-component-tag", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Tag", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-icon": "4.7.0" + "@ecl/twig-component-icon": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-tag": "4.7.0", - "@ecl/vanilla-component-tag": "4.7.0" + "@ecl/specs-component-tag": "4.8.0", + "@ecl/vanilla-component-tag": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/text-area/package.json b/src/implementations/twig/components/text-area/package.json index 6ac8acfdc5a..f063584adaf 100644 --- a/src/implementations/twig/components/text-area/package.json +++ b/src/implementations/twig/components/text-area/package.json @@ -2,15 +2,15 @@ "name": "@ecl/twig-component-text-area", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Text Area", "publishConfig": { "access": "public" }, "devDependencies": { - "@ecl/specs-component-text-area": "4.7.0", - "@ecl/vanilla-component-form-group": "4.7.0", - "@ecl/vanilla-component-text-area": "4.7.0" + "@ecl/specs-component-text-area": "4.8.0", + "@ecl/vanilla-component-form-group": "4.8.0", + "@ecl/vanilla-component-text-area": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/text-input/package.json b/src/implementations/twig/components/text-input/package.json index 69c355f150a..86fea238ab6 100644 --- a/src/implementations/twig/components/text-input/package.json +++ b/src/implementations/twig/components/text-input/package.json @@ -2,15 +2,15 @@ "name": "@ecl/twig-component-text-input", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Text Input", "publishConfig": { "access": "public" }, "devDependencies": { - "@ecl/specs-component-text-input": "4.7.0", - "@ecl/vanilla-component-form-group": "4.7.0", - "@ecl/vanilla-component-text-input": "4.7.0" + "@ecl/specs-component-text-input": "4.8.0", + "@ecl/vanilla-component-form-group": "4.8.0", + "@ecl/vanilla-component-text-input": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/timeline/package.json b/src/implementations/twig/components/timeline/package.json index 4538965f605..9706e1245af 100644 --- a/src/implementations/twig/components/timeline/package.json +++ b/src/implementations/twig/components/timeline/package.json @@ -2,17 +2,17 @@ "name": "@ecl/twig-component-timeline", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Timeline", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-button": "4.7.0" + "@ecl/twig-component-button": "4.8.0" }, "devDependencies": { - "@ecl/specs-component-timeline": "4.7.0", - "@ecl/vanilla-component-timeline": "4.7.0" + "@ecl/specs-component-timeline": "4.8.0", + "@ecl/vanilla-component-timeline": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/unordered-list/package.json b/src/implementations/twig/components/unordered-list/package.json index d43da1651da..eb1688e046b 100644 --- a/src/implementations/twig/components/unordered-list/package.json +++ b/src/implementations/twig/components/unordered-list/package.json @@ -2,14 +2,14 @@ "name": "@ecl/twig-component-unordered-list", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Unordered list", "publishConfig": { "access": "public" }, "devDependencies": { - "@ecl/specs-component-unordered-list": "4.7.0", - "@ecl/vanilla-component-unordered-list": "4.7.0" + "@ecl/specs-component-unordered-list": "4.8.0", + "@ecl/vanilla-component-unordered-list": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/components/video/package.json b/src/implementations/twig/components/video/package.json index 1707979ebf0..f7f0e7e3880 100644 --- a/src/implementations/twig/components/video/package.json +++ b/src/implementations/twig/components/video/package.json @@ -2,13 +2,13 @@ "name": "@ecl/twig-component-video", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Video", "publishConfig": { "access": "public" }, "devDependencies": { - "@ecl/specs-component-video": "4.7.0" + "@ecl/specs-component-video": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/compositions/etrans/package.json b/src/implementations/twig/compositions/etrans/package.json index 450361a767d..1c5c52c656f 100644 --- a/src/implementations/twig/compositions/etrans/package.json +++ b/src/implementations/twig/compositions/etrans/package.json @@ -2,22 +2,22 @@ "name": "@ecl/twig-composition-etrans", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Etrans", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-button": "4.7.0", - "@ecl/twig-component-link": "4.7.0", - "@ecl/twig-component-notification": "4.7.0" + "@ecl/twig-component-button": "4.8.0", + "@ecl/twig-component-link": "4.8.0", + "@ecl/twig-component-notification": "4.8.0" }, "devDependencies": { - "@ecl/specs-composition-etrans": "4.7.0", - "@ecl/vanilla-utility-background": "4.7.0", - "@ecl/vanilla-utility-display": "4.7.0", - "@ecl/vanilla-utility-spacing": "4.7.0", - "@ecl/vanilla-utility-typography": "4.7.0" + "@ecl/specs-composition-etrans": "4.8.0", + "@ecl/vanilla-utility-background": "4.8.0", + "@ecl/vanilla-utility-display": "4.8.0", + "@ecl/vanilla-utility-spacing": "4.8.0", + "@ecl/vanilla-utility-typography": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/compositions/file-upload-status/package.json b/src/implementations/twig/compositions/file-upload-status/package.json index 4e13fcfb3fd..9ae5f5da71e 100644 --- a/src/implementations/twig/compositions/file-upload-status/package.json +++ b/src/implementations/twig/compositions/file-upload-status/package.json @@ -2,14 +2,14 @@ "name": "@ecl/twig-composition-file-upload-status", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL File upload status", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/twig-component-link": "4.7.0", - "@ecl/twig-component-spinner": "4.7.0" + "@ecl/twig-component-link": "4.8.0", + "@ecl/twig-component-spinner": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/twig/layout/grid/package.json b/src/implementations/twig/layout/grid/package.json index ffd88394988..91ffbfb25ad 100644 --- a/src/implementations/twig/layout/grid/package.json +++ b/src/implementations/twig/layout/grid/package.json @@ -3,13 +3,13 @@ "private": true, "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Layout Grid", "devDependencies": { - "@ecl/vanilla-layout-grid": "4.7.0", - "@ecl/vanilla-utility-background": "4.7.0", - "@ecl/vanilla-utility-border": "4.7.0", - "@ecl/vanilla-utility-spacing": "4.7.0", - "@ecl/vanilla-utility-typography": "4.7.0" + "@ecl/vanilla-layout-grid": "4.8.0", + "@ecl/vanilla-utility-background": "4.8.0", + "@ecl/vanilla-utility-border": "4.8.0", + "@ecl/vanilla-utility-spacing": "4.8.0", + "@ecl/vanilla-utility-typography": "4.8.0" } } diff --git a/src/implementations/twig/pages/page-home/.npmignore b/src/implementations/twig/pages/page-home/.npmignore new file mode 100644 index 00000000000..38460544773 --- /dev/null +++ b/src/implementations/twig/pages/page-home/.npmignore @@ -0,0 +1,2 @@ +__snapshots__ +*.js diff --git a/src/implementations/twig/pages/page-home/README.md b/src/implementations/twig/pages/page-home/README.md new file mode 100644 index 00000000000..c5a7d723098 --- /dev/null +++ b/src/implementations/twig/pages/page-home/README.md @@ -0,0 +1,7 @@ +# ECL Example page - Home + +npm package: `@ecl/twig-page-home` + +```shell +npm install --save @ecl/twig-page-home +``` diff --git a/src/implementations/twig/pages/page-home/package.json b/src/implementations/twig/pages/page-home/package.json new file mode 100644 index 00000000000..b76f1342289 --- /dev/null +++ b/src/implementations/twig/pages/page-home/package.json @@ -0,0 +1,37 @@ +{ + "name": "@ecl/twig-page-home", + "author": "European Commission", + "license": "EUPL-1.2", + "version": "4.8.0", + "description": "ECL Example page - Home", + "publishConfig": { + "access": "restricted" + }, + "dependencies": { + "@ecl/twig-component-banner": "4.8.0", + "@ecl/twig-component-card": "4.8.0", + "@ecl/twig-component-content-item": "4.8.0", + "@ecl/twig-component-featured-item": "4.8.0", + "@ecl/twig-component-link": "4.8.0", + "@ecl/twig-component-navigation-list": "4.8.0", + "@ecl/twig-component-site-footer": "4.8.0", + "@ecl/twig-component-site-header": "4.8.0" + }, + "devDependencies": { + "@ecl/specs-page-home": "4.8.0" + }, + "repository": { + "type": "git", + "url": "git+https://github.com/ec-europa/europa-component-library.git" + }, + "bugs": { + "url": "https://github.com/ec-europa/europa-component-library/issues" + }, + "homepage": "https://github.com/ec-europa/europa-component-library", + "keywords": [ + "ecl", + "europa-component-library", + "design-system", + "twig" + ] +} diff --git a/src/implementations/twig/pages/page-home/page-home.html.twig b/src/implementations/twig/pages/page-home/page-home.html.twig new file mode 100644 index 00000000000..82d25165f9f --- /dev/null +++ b/src/implementations/twig/pages/page-home/page-home.html.twig @@ -0,0 +1,73 @@ + +{%- include '@ecl/site-header/site-header.html.twig' with site_header -%} + +
+
+ + {%- include '@ecl/banner/banner.html.twig' with banner -%} + +

Maecenas sagittis est

+ + +
+
+ {%- include '@ecl/card/card.html.twig' with card -%} +
+
+ {%- include '@ecl/card/card.html.twig' with card -%} +
+
+ {%- include '@ecl/card/card.html.twig' with card -%} +
+
+ +

Orci varius natoque penatibus

+ + +
+
+ {%- include '@ecl/content-item/content-item.html.twig' with content_item|merge({ + divider: true, + }) -%} +
+
+ {%- include '@ecl/content-item/content-item.html.twig' with content_item|merge({ + divider: true, + }) -%} +
+
+ {%- include '@ecl/content-item/content-item.html.twig' with content_item -%} +
+
+ {%- include '@ecl/content-item/content-item.html.twig' with content_item -%} +
+
+ {%- include '@ecl/link/link.html.twig' with { + link: { + type: 'standalone', + label: 'View more events', + path: '#', + }, + icon: { + path: icon_path, + name: 'corner-arrow', + size: 'xs', + transform: 'rotate-90', + }, + } -%} + +

Vivamus et eros

+ + + {%- include '@ecl/featured-item/featured-item.html.twig' with featured_item -%} + +

Aliquam massa est, facilisis eget eleifend ut

+ + + {%- include '@ecl/navigation-list/navigation-list.html.twig' with navigation_list -%} + +
+
+ + +{%- include '@ecl/site-footer/site-footer.html.twig' with site_footer -%} diff --git a/src/implementations/twig/pages/page-home/page-home.story.js b/src/implementations/twig/pages/page-home/page-home.story.js new file mode 100644 index 00000000000..227e970e181 --- /dev/null +++ b/src/implementations/twig/pages/page-home/page-home.story.js @@ -0,0 +1,85 @@ +import { correctPaths } from '@ecl/story-utils'; +import { withNotes } from '@ecl/storybook-addon-notes'; +import withCode from '@ecl/storybook-addon-code'; +import getSystem from '@ecl/builder/utils/getSystem'; + +import logoEC from '@ecl/resources-ec-logo/dist/positive/logo-ec--en.svg'; +import logoMobileEC from '@ecl/resources-ec-logo/dist/logo-ec--mute.svg'; +import logoNegativeEC from '@ecl/resources-ec-logo/dist/negative/logo-ec--en.svg'; +import logoEU from '@ecl/resources-eu-logo/dist/standard-version/positive/logo-eu--en.svg'; +import logoMobileEU from '@ecl/resources-eu-logo/dist/condensed-version/positive/logo-eu--en.svg'; + +import dataHome from '@ecl/specs-page-home/demo/data'; +import home from './page-home.html.twig'; +import notes from './README.md'; + +const system = getSystem(); +const prepareData = (data) => { + correctPaths(data); + + // Logo path; to be done after correctPaths + if (system === 'eu') { + data.site_header.logo.src_desktop = logoEU; + data.site_header.logo.src_mobile = logoMobileEU; + data.site_header.logo.size = 'm'; + data.site_footer.rows[1][0][0].logo.src_desktop = logoEU; + data.site_footer.rows[1][0][0].logo.src_mobile = logoMobileEU; + } else { + data.site_header.logo.src_desktop = logoEC; + data.site_header.logo.src_mobile = logoMobileEC; + data.site_footer.rows[2][0][0].logo.src_desktop = logoNegativeEC; + } + + return data; +}; + +export default { + title: 'Page examples/Home', + decorators: [ + withNotes, + withCode, + (story) => { + function createLink(href, media) { + const link = document.createElement('link'); + link.rel = 'stylesheet'; + link.type = 'text/css'; + link.href = href; + link.media = media || 'all'; + return link; + } + const head = document.head || document.getElementsByTagName('head')[0]; + head.appendChild(createLink('./styles/optional/ecl-reset.css', 'screen')); + head.appendChild( + createLink(`./styles/optional/ecl-${system}-default.css`, 'screen'), + ); + head.appendChild(createLink(`./styles/ecl-${system}.css`, 'screen')); + head.appendChild( + createLink(`./styles/optional/ecl-${system}-utilities.css`, 'screen'), + ); + head.appendChild(createLink(`./styles/ecl-${system}-print.css`, 'print')); + head.appendChild( + createLink( + `./styles/optional/ecl-${system}-default-print.css`, + 'print', + ), + ); + + return story(); + }, + ], + parameters: { + controls: { disable: true }, + EclNotes: { disable: true }, + layout: 'fullscreen', + }, +}; + +export const Default = (_, { loaded: { component } }) => component; + +Default.render = async () => { + const renderedHome = await home(prepareData(dataHome)); + return renderedHome; +}; +Default.storyName = 'default'; +Default.parameters = { notes: { markdown: notes } }; +Default.tags = ['!dev']; diff --git a/src/implementations/twig/pages/page-inner/.npmignore b/src/implementations/twig/pages/page-inner/.npmignore new file mode 100644 index 00000000000..38460544773 --- /dev/null +++ b/src/implementations/twig/pages/page-inner/.npmignore @@ -0,0 +1,2 @@ +__snapshots__ +*.js diff --git a/src/implementations/twig/pages/page-inner/README.md b/src/implementations/twig/pages/page-inner/README.md new file mode 100644 index 00000000000..192617e8590 --- /dev/null +++ b/src/implementations/twig/pages/page-inner/README.md @@ -0,0 +1,7 @@ +# ECL Example page - Inner + +npm package: `@ecl/twig-page-inner` + +```shell +npm install --save @ecl/twig-page-inner +``` diff --git a/src/implementations/twig/pages/page-inner/package.json b/src/implementations/twig/pages/page-inner/package.json new file mode 100644 index 00000000000..09b4763173e --- /dev/null +++ b/src/implementations/twig/pages/page-inner/package.json @@ -0,0 +1,37 @@ +{ + "name": "@ecl/twig-page-inner", + "author": "European Commission", + "license": "EUPL-1.2", + "version": "4.8.0", + "description": "ECL Example page - Inner", + "publishConfig": { + "access": "restricted" + }, + "dependencies": { + "@ecl/twig-component-accordion": "4.8.0", + "@ecl/twig-component-file": "4.8.0", + "@ecl/twig-component-gallery": "4.8.0", + "@ecl/twig-component-inpage-navigation": "4.8.0", + "@ecl/twig-component-page-header": "4.8.0", + "@ecl/twig-component-site-footer": "4.8.0", + "@ecl/twig-component-site-header": "4.8.0", + "@ecl/twig-component-unordered-list": "4.8.0" + }, + "devDependencies": { + "@ecl/specs-page-inner": "4.8.0" + }, + "repository": { + "type": "git", + "url": "git+https://github.com/ec-europa/europa-component-library.git" + }, + "bugs": { + "url": "https://github.com/ec-europa/europa-component-library/issues" + }, + "homepage": "https://github.com/ec-europa/europa-component-library", + "keywords": [ + "ecl", + "europa-component-library", + "design-system", + "twig" + ] +} diff --git a/src/implementations/twig/pages/page-inner/page-inner.html.twig b/src/implementations/twig/pages/page-inner/page-inner.html.twig new file mode 100644 index 00000000000..790fcd02b10 --- /dev/null +++ b/src/implementations/twig/pages/page-inner/page-inner.html.twig @@ -0,0 +1,54 @@ + +{% include '@ecl/site-header/site-header.html.twig' with site_header %} + +
+
+ + {% include '@ecl/page-header/page-header.html.twig' with page_header %} + +
+
+ + {% include '@ecl/inpage-navigation/inpage-navigation.html.twig' with inpage_navigation|merge({ + extra_classes: 'ecl-u-mt-2xl', + }) %} +
+
+

Donec nec ex condimentum

+ + +

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed non consequat enim. Donec egestas nulla cursus, convallis urna id, malesuada magna. +

+ +

+ Ut maximus euismod velit, et mollis nibh gravida suscipit. Curabitur faucibus ex eu enim consectetur posuere et vitae nisl. Ut rutrum, mauris eget dictum ornare, orci velit elementum nunc, quis ornare urna velit et neque. Integer et ultrices mi. Nullam posuere gravida justo, ornare aliquam sapien interdum vel. Aenean at congue mauris. Vestibulum fermentum nisi bibendum dolor fermentum volutpat. +

+ + + {% include '@ecl/unordered-list/unordered-list.html.twig' with unordered_list %} + +

Curabitur faucibus ex eu

+ + + {% include '@ecl/accordion/accordion.html.twig' with accordion %} + +

Maecenas ultrices mi rutrum urna volutpat

+ + + {% include '@ecl/file/file.html.twig' with file %} + {% include '@ecl/file/file.html.twig' with file|merge({ + extra_classes: 'ecl-u-mt-l', + }) %} + +

Nullam

+ + + {% include '@ecl/gallery/gallery.html.twig' with gallery %} +
+
+
+
+ + +{% include '@ecl/site-footer/site-footer.html.twig' with site_footer %} diff --git a/src/implementations/twig/pages/page-inner/page-inner.story.js b/src/implementations/twig/pages/page-inner/page-inner.story.js new file mode 100644 index 00000000000..b816eece630 --- /dev/null +++ b/src/implementations/twig/pages/page-inner/page-inner.story.js @@ -0,0 +1,85 @@ +import { correctPaths } from '@ecl/story-utils'; +import { withNotes } from '@ecl/storybook-addon-notes'; +import withCode from '@ecl/storybook-addon-code'; +import getSystem from '@ecl/builder/utils/getSystem'; + +import logoEC from '@ecl/resources-ec-logo/dist/positive/logo-ec--en.svg'; +import logoMobileEC from '@ecl/resources-ec-logo/dist/logo-ec--mute.svg'; +import logoNegativeEC from '@ecl/resources-ec-logo/dist/negative/logo-ec--en.svg'; +import logoEU from '@ecl/resources-eu-logo/dist/standard-version/positive/logo-eu--en.svg'; +import logoMobileEU from '@ecl/resources-eu-logo/dist/condensed-version/positive/logo-eu--en.svg'; + +import dataInner from '@ecl/specs-page-inner/demo/data'; +import inner from './page-inner.html.twig'; +import notes from './README.md'; + +const system = getSystem(); +const prepareData = (data) => { + correctPaths(data); + + // Logo path; to be done after correctPaths + if (system === 'eu') { + data.site_header.logo.src_desktop = logoEU; + data.site_header.logo.src_mobile = logoMobileEU; + data.site_header.logo.size = 'm'; + data.site_footer.rows[1][0][0].logo.src_desktop = logoEU; + data.site_footer.rows[1][0][0].logo.src_mobile = logoMobileEU; + } else { + data.site_header.logo.src_desktop = logoEC; + data.site_header.logo.src_mobile = logoMobileEC; + data.site_footer.rows[2][0][0].logo.src_desktop = logoNegativeEC; + } + + return data; +}; + +export default { + title: 'Page examples/Inner', + decorators: [ + withNotes, + withCode, + (story) => { + function createLink(href, media) { + const link = document.createElement('link'); + link.rel = 'stylesheet'; + link.type = 'text/css'; + link.href = href; + link.media = media || 'all'; + return link; + } + const head = document.head || document.getElementsByTagName('head')[0]; + head.appendChild(createLink('./styles/optional/ecl-reset.css', 'screen')); + head.appendChild( + createLink(`./styles/optional/ecl-${system}-default.css`, 'screen'), + ); + head.appendChild(createLink(`./styles/ecl-${system}.css`, 'screen')); + head.appendChild( + createLink(`./styles/optional/ecl-${system}-utilities.css`, 'screen'), + ); + head.appendChild(createLink(`./styles/ecl-${system}-print.css`, 'print')); + head.appendChild( + createLink( + `./styles/optional/ecl-${system}-default-print.css`, + 'print', + ), + ); + + return story(); + }, + ], + parameters: { + controls: { disable: true }, + EclNotes: { disable: true }, + layout: 'fullscreen', + }, +}; + +export const Default = (_, { loaded: { component } }) => component; + +Default.render = async () => { + const renderedInner = await inner(prepareData(dataInner)); + return renderedInner; +}; +Default.storyName = 'default'; +Default.parameters = { notes: { markdown: notes } }; +Default.tags = ['!dev']; diff --git a/src/implementations/twig/pages/page-search/.npmignore b/src/implementations/twig/pages/page-search/.npmignore new file mode 100644 index 00000000000..38460544773 --- /dev/null +++ b/src/implementations/twig/pages/page-search/.npmignore @@ -0,0 +1,2 @@ +__snapshots__ +*.js diff --git a/src/implementations/twig/pages/page-search/README.md b/src/implementations/twig/pages/page-search/README.md new file mode 100644 index 00000000000..f09ab612339 --- /dev/null +++ b/src/implementations/twig/pages/page-search/README.md @@ -0,0 +1,7 @@ +# ECL Example page - Search + +npm package: `@ecl/twig-page-search` + +```shell +npm install --save @ecl/twig-page-search +``` diff --git a/src/implementations/twig/pages/page-search/package.json b/src/implementations/twig/pages/page-search/package.json new file mode 100644 index 00000000000..5d8800d381b --- /dev/null +++ b/src/implementations/twig/pages/page-search/package.json @@ -0,0 +1,36 @@ +{ + "name": "@ecl/twig-page-search", + "author": "European Commission", + "license": "EUPL-1.2", + "version": "4.8.0", + "description": "ECL Example page - Search", + "publishConfig": { + "access": "restricted" + }, + "dependencies": { + "@ecl/twig-component-button": "4.8.0", + "@ecl/twig-component-content-item": "4.8.0", + "@ecl/twig-component-form-group": "4.8.0", + "@ecl/twig-component-page-header": "4.8.0", + "@ecl/twig-component-pagination": "4.8.0", + "@ecl/twig-component-site-footer": "4.8.0", + "@ecl/twig-component-site-header": "4.8.0" + }, + "devDependencies": { + "@ecl/specs-page-search": "4.8.0" + }, + "repository": { + "type": "git", + "url": "git+https://github.com/ec-europa/europa-component-library.git" + }, + "bugs": { + "url": "https://github.com/ec-europa/europa-component-library/issues" + }, + "homepage": "https://github.com/ec-europa/europa-component-library", + "keywords": [ + "ecl", + "europa-component-library", + "design-system", + "twig" + ] +} diff --git a/src/implementations/twig/pages/page-search/page-search.html.twig b/src/implementations/twig/pages/page-search/page-search.html.twig new file mode 100644 index 00000000000..9745d1df524 --- /dev/null +++ b/src/implementations/twig/pages/page-search/page-search.html.twig @@ -0,0 +1,74 @@ + +{% include '@ecl/site-header/site-header.html.twig' with site_header %} + +
+
+ + {% include '@ecl/page-header/page-header.html.twig' with page_header %} + +
+
+

Filters

+ +
+ {%- include '@ecl/form-group/form-group.html.twig' with text_input|merge({ + extra_classes: 'ecl-u-mb-xl', + }) -%} + {%- include '@ecl/form-group/form-group.html.twig' with select_multiple|merge({ + extra_classes: 'ecl-u-mb-xl', + }) -%} + {%- include '@ecl/form-group/form-group.html.twig' with checkbox|merge({ + extra_classes: 'ecl-u-mb-xl', + }) -%} + +
+ {%- include '@ecl/button/button.html.twig' with button_primary -%} +
+ {%- include '@ecl/button/button.html.twig' with button_secondary -%} +
+
+
+
+
+

Search results

+

Showing results 30 to 40

+ + {%- include '@ecl/content-item/content-item.html.twig' with content_item|merge({ + extra_classes: 'ecl-u-mb-2xl', + }) -%} + {%- include '@ecl/content-item/content-item.html.twig' with content_item|merge({ + extra_classes: 'ecl-u-mb-2xl', + }) -%} + {%- include '@ecl/content-item/content-item.html.twig' with content_item|merge({ + extra_classes: 'ecl-u-mb-2xl', + }) -%} + {%- include '@ecl/content-item/content-item.html.twig' with content_item|merge({ + extra_classes: 'ecl-u-mb-2xl', + }) -%} + {%- include '@ecl/content-item/content-item.html.twig' with content_item|merge({ + extra_classes: 'ecl-u-mb-2xl', + }) -%} + {%- include '@ecl/content-item/content-item.html.twig' with content_item|merge({ + extra_classes: 'ecl-u-mb-2xl', + }) -%} + {%- include '@ecl/content-item/content-item.html.twig' with content_item|merge({ + extra_classes: 'ecl-u-mb-2xl', + }) -%} + {%- include '@ecl/content-item/content-item.html.twig' with content_item|merge({ + extra_classes: 'ecl-u-mb-2xl', + }) -%} + {%- include '@ecl/content-item/content-item.html.twig' with content_item|merge({ + extra_classes: 'ecl-u-mb-2xl', + }) -%} + {%- include '@ecl/content-item/content-item.html.twig' with content_item|merge({ + extra_classes: 'ecl-u-mb-2xl', + }) -%} + + {%- include '@ecl/pagination/pagination.html.twig' with pagination -%} +
+
+
+
+ + +{% include '@ecl/site-footer/site-footer.html.twig' with site_footer %} diff --git a/src/implementations/twig/pages/page-search/page-search.story.js b/src/implementations/twig/pages/page-search/page-search.story.js new file mode 100644 index 00000000000..5cac3376d95 --- /dev/null +++ b/src/implementations/twig/pages/page-search/page-search.story.js @@ -0,0 +1,85 @@ +import { correctPaths } from '@ecl/story-utils'; +import { withNotes } from '@ecl/storybook-addon-notes'; +import withCode from '@ecl/storybook-addon-code'; +import getSystem from '@ecl/builder/utils/getSystem'; + +import logoEC from '@ecl/resources-ec-logo/dist/positive/logo-ec--en.svg'; +import logoMobileEC from '@ecl/resources-ec-logo/dist/logo-ec--mute.svg'; +import logoNegativeEC from '@ecl/resources-ec-logo/dist/negative/logo-ec--en.svg'; +import logoEU from '@ecl/resources-eu-logo/dist/standard-version/positive/logo-eu--en.svg'; +import logoMobileEU from '@ecl/resources-eu-logo/dist/condensed-version/positive/logo-eu--en.svg'; + +import dataSearch from '@ecl/specs-page-search/demo/data'; +import search from './page-search.html.twig'; +import notes from './README.md'; + +const system = getSystem(); +const prepareData = (data) => { + correctPaths(data); + + // Logo path; to be done after correctPaths + if (system === 'eu') { + data.site_header.logo.src_desktop = logoEU; + data.site_header.logo.src_mobile = logoMobileEU; + data.site_header.logo.size = 'm'; + data.site_footer.rows[1][0][0].logo.src_desktop = logoEU; + data.site_footer.rows[1][0][0].logo.src_mobile = logoMobileEU; + } else { + data.site_header.logo.src_desktop = logoEC; + data.site_header.logo.src_mobile = logoMobileEC; + data.site_footer.rows[2][0][0].logo.src_desktop = logoNegativeEC; + } + + return data; +}; + +export default { + title: 'Page examples/Search', + decorators: [ + withNotes, + withCode, + (story) => { + function createLink(href, media) { + const link = document.createElement('link'); + link.rel = 'stylesheet'; + link.type = 'text/css'; + link.href = href; + link.media = media || 'all'; + return link; + } + const head = document.head || document.getElementsByTagName('head')[0]; + head.appendChild(createLink('./styles/optional/ecl-reset.css', 'screen')); + head.appendChild( + createLink(`./styles/optional/ecl-${system}-default.css`, 'screen'), + ); + head.appendChild(createLink(`./styles/ecl-${system}.css`, 'screen')); + head.appendChild( + createLink(`./styles/optional/ecl-${system}-utilities.css`, 'screen'), + ); + head.appendChild(createLink(`./styles/ecl-${system}-print.css`, 'print')); + head.appendChild( + createLink( + `./styles/optional/ecl-${system}-default-print.css`, + 'print', + ), + ); + + return story(); + }, + ], + parameters: { + controls: { disable: true }, + EclNotes: { disable: true }, + layout: 'fullscreen', + }, +}; + +export const Default = (_, { loaded: { component } }) => component; + +Default.render = async () => { + const renderedSearch = await search(prepareData(dataSearch)); + return renderedSearch; +}; +Default.storyName = 'default'; +Default.parameters = { notes: { markdown: notes } }; +Default.tags = ['!dev']; diff --git a/src/implementations/vanilla/components/accordion/package.json b/src/implementations/vanilla/components/accordion/package.json index fe556639a37..8bffa24c129 100644 --- a/src/implementations/vanilla/components/accordion/package.json +++ b/src/implementations/vanilla/components/accordion/package.json @@ -2,15 +2,15 @@ "name": "@ecl/vanilla-component-accordion", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Accordion", "style": "accordion.scss", "sass": "accordion.scss", "main": "accordion.js", "module": "accordion.js", "dependencies": { - "@ecl/dom-utils": "4.7.0", - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/dom-utils": "4.8.0", + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/banner/package.json b/src/implementations/vanilla/components/banner/package.json index 950e2c8d46b..730dc0695ec 100644 --- a/src/implementations/vanilla/components/banner/package.json +++ b/src/implementations/vanilla/components/banner/package.json @@ -2,15 +2,15 @@ "name": "@ecl/vanilla-component-banner", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Banner", "style": "banner.scss", "sass": "banner.scss", "main": "banner.js", "module": "banner.js", "dependencies": { - "@ecl/dom-utils": "4.7.0", - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/dom-utils": "4.8.0", + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/blockquote/package.json b/src/implementations/vanilla/components/blockquote/package.json index b5d5d1431e1..5d0507d1582 100644 --- a/src/implementations/vanilla/components/blockquote/package.json +++ b/src/implementations/vanilla/components/blockquote/package.json @@ -2,12 +2,12 @@ "name": "@ecl/vanilla-component-blockquote", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Blockquotes", "style": "blockquote.scss", "sass": "blockquote.scss", "dependencies": { - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/breadcrumb/package.json b/src/implementations/vanilla/components/breadcrumb/package.json index 3147e1e648c..0e663f68026 100644 --- a/src/implementations/vanilla/components/breadcrumb/package.json +++ b/src/implementations/vanilla/components/breadcrumb/package.json @@ -1,6 +1,6 @@ { "name": "@ecl/vanilla-component-breadcrumb", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Breadcrumb", "main": "breadcrumb.js", "module": "breadcrumb.js", @@ -9,8 +9,8 @@ "author": "European Commission", "license": "EUPL-1.2", "dependencies": { - "@ecl/dom-utils": "4.7.0", - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/dom-utils": "4.8.0", + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/button/package.json b/src/implementations/vanilla/components/button/package.json index 5921d57079d..da2b962830a 100644 --- a/src/implementations/vanilla/components/button/package.json +++ b/src/implementations/vanilla/components/button/package.json @@ -2,12 +2,12 @@ "name": "@ecl/vanilla-component-button", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Buttons", "style": "button.scss", "sass": "button.scss", "dependencies": { - "@ecl/vanilla-utility-screen-reader": "4.7.0" + "@ecl/vanilla-utility-screen-reader": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/card/package.json b/src/implementations/vanilla/components/card/package.json index c434ed72e93..c92bf793630 100644 --- a/src/implementations/vanilla/components/card/package.json +++ b/src/implementations/vanilla/components/card/package.json @@ -2,12 +2,12 @@ "name": "@ecl/vanilla-component-card", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Card", "style": "card.scss", "sass": "card.scss", "dependencies": { - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/carousel/package.json b/src/implementations/vanilla/components/carousel/package.json index 46540c75f8c..aa397805329 100644 --- a/src/implementations/vanilla/components/carousel/package.json +++ b/src/implementations/vanilla/components/carousel/package.json @@ -2,7 +2,7 @@ "name": "@ecl/vanilla-component-carousel", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Carousel", "main": "carousel.js", "module": "carousel.js", @@ -12,9 +12,9 @@ "access": "public" }, "dependencies": { - "@ecl/dom-utils": "4.7.0", - "@ecl/vanilla-component-banner": "4.7.0", - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/dom-utils": "4.8.0", + "@ecl/vanilla-component-banner": "4.8.0", + "@ecl/vanilla-layout-grid": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/vanilla/components/category-filter/package.json b/src/implementations/vanilla/components/category-filter/package.json index c3b96c08e94..da5c0e97adb 100644 --- a/src/implementations/vanilla/components/category-filter/package.json +++ b/src/implementations/vanilla/components/category-filter/package.json @@ -2,14 +2,14 @@ "name": "@ecl/vanilla-component-category-filter", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Category filter", "module": "category-filter.js", "main": "category-filter.js", "style": "category-filter.scss", "sass": "category-filter.scss", "dependencies": { - "@ecl/dom-utils": "4.7.0" + "@ecl/dom-utils": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/checkbox/package.json b/src/implementations/vanilla/components/checkbox/package.json index 5cad6a68078..3b50cb755c8 100644 --- a/src/implementations/vanilla/components/checkbox/package.json +++ b/src/implementations/vanilla/components/checkbox/package.json @@ -2,7 +2,7 @@ "name": "@ecl/vanilla-component-checkbox", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Checkbox", "style": "checkbox.scss", "sass": "checkbox.scss", diff --git a/src/implementations/vanilla/components/content-block/package.json b/src/implementations/vanilla/components/content-block/package.json index d445a0b780a..bc53ed080a4 100644 --- a/src/implementations/vanilla/components/content-block/package.json +++ b/src/implementations/vanilla/components/content-block/package.json @@ -2,14 +2,14 @@ "name": "@ecl/vanilla-component-content-block", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Content block", "style": "content-block.scss", "sass": "content-block.scss", "module": "content-block.js", "main": "content-block.js", "dependencies": { - "@ecl/dom-utils": "4.7.0" + "@ecl/dom-utils": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/content-item/content-item-print.scss b/src/implementations/vanilla/components/content-item/content-item-print.scss index 92c302c1663..eaf32d7f4fb 100644 --- a/src/implementations/vanilla/components/content-item/content-item-print.scss +++ b/src/implementations/vanilla/components/content-item/content-item-print.scss @@ -11,7 +11,9 @@ $content-item: null !default; .ecl-content-item { align-items: flex-start; + box-sizing: border-box; display: flex; + height: 100%; flex-direction: row; margin: 0; } diff --git a/src/implementations/vanilla/components/content-item/content-item.scss b/src/implementations/vanilla/components/content-item/content-item.scss index 6aee3da2365..6a0111e2adf 100644 --- a/src/implementations/vanilla/components/content-item/content-item.scss +++ b/src/implementations/vanilla/components/content-item/content-item.scss @@ -55,8 +55,10 @@ $content-item: null !default; } @include breakpoints.up('m') { - .ecl-content-item:not(.ecl-content-item--stack) { - flex-direction: row; + .ecl-content-item { + &:not(.ecl-content-item--stack) { + flex-direction: row; + } } .ecl-content-item__picture { diff --git a/src/implementations/vanilla/components/content-item/package.json b/src/implementations/vanilla/components/content-item/package.json index 82f7b9097e3..b44ecd85e6d 100644 --- a/src/implementations/vanilla/components/content-item/package.json +++ b/src/implementations/vanilla/components/content-item/package.json @@ -2,12 +2,12 @@ "name": "@ecl/vanilla-component-content-item", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Content item", "style": "content-item.scss", "sass": "content-item.scss", "dependencies": { - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/date-block/package.json b/src/implementations/vanilla/components/date-block/package.json index 00fc982e12d..765fae93f29 100644 --- a/src/implementations/vanilla/components/date-block/package.json +++ b/src/implementations/vanilla/components/date-block/package.json @@ -2,13 +2,13 @@ "name": "@ecl/vanilla-component-date-block", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Date Block", "style": "date-block.scss", "sass": "date-block.scss", "dependencies": { - "@ecl/vanilla-layout-grid": "4.7.0", - "@ecl/vanilla-utility-screen-reader": "4.7.0" + "@ecl/vanilla-layout-grid": "4.8.0", + "@ecl/vanilla-utility-screen-reader": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/datepicker/datepicker.js b/src/implementations/vanilla/components/datepicker/datepicker.js index 2bcf97633de..c6ce4edfb4b 100644 --- a/src/implementations/vanilla/components/datepicker/datepicker.js +++ b/src/implementations/vanilla/components/datepicker/datepicker.js @@ -1,3 +1,5 @@ +/* global moment */ + /** * @param {HTMLElement} element DOM element for component instantiation and scope * @param {Object} options @@ -26,6 +28,7 @@ export class Datepicker { theme = 'ecl-datepicker-theme', yearRange = 40, reposition = false, + attachResizeListener = true, i18n = { previousMonth: 'Previous Month', nextMonth: 'Next Month', @@ -69,6 +72,8 @@ export class Datepicker { // Options this.picker = null; + this.resizeTimer = null; + this.pikadayEl = null; this.format = format; this.theme = theme; this.yearRange = yearRange; @@ -78,6 +83,10 @@ export class Datepicker { enableSelectionDaysInNextAndPreviousMonths; this.reposition = reposition; this.direction = 'ltr'; + this.attachResizeListener = attachResizeListener; + + // Bindings + this.handleResize = this.handleResize.bind(this); } /** @@ -96,6 +105,41 @@ export class Datepicker { this.direction = getComputedStyle(this.element).direction; + if (this.attachResizeListener) { + window.addEventListener('resize', this.handleResize); + } + + /** + * Resize logic. + * + * @param {HTMLElement} el - The pikaday dropdown. + */ + Datepicker.resizeLogic = (el) => { + this.pikadayEl = el; + const vw = Math.max( + document.documentElement.clientWidth || 0, + window.innerWidth || 0, + ); + const { direction } = getComputedStyle(el); + const elRect = el.getBoundingClientRect(); + + if (direction === 'rtl') { + const pickerMargin = vw - elRect.right; + if (vw < 768) { + el.style.left = `${pickerMargin}px`; + } else { + el.style.left = 'auto'; + } + } else { + const pickerMargin = elRect.left; + if (vw < 768) { + el.style.right = `${pickerMargin}px`; + } else { + el.style.right = 'auto'; + } + } + }; + const options = { field: this.element, yearRange: this.yearRange, @@ -121,35 +165,30 @@ export class Datepicker { return `${day}-${month}-${year}`; }; } - // eslint-disable-next-line no-undef this.picker = new Pikaday({ ...options, - onOpen() { - this.direction = getComputedStyle(this.el).direction; - - // Extend picker size on mobile - const vw = Math.max( - document.documentElement.clientWidth || 0, - window.innerWidth || 0, - ); - const elRect = this.el.getBoundingClientRect(); - - if (this.direction === 'rtl') { - const pickerMargin = vw - elRect.right; - if (vw < 768) { - this.el.style.left = `${pickerMargin}px`; - } else { - this.el.style.left = 'auto'; - } - } else { - const pickerMargin = elRect.left; - if (vw < 768) { - this.el.style.right = `${pickerMargin}px`; - } else { - this.el.style.right = 'auto'; + parse(input, format) { + if (!options.format) { + // Here we are using the default DD-MM-YYYY + const [day, month, year] = input.split('-').map(Number); + const fullYear = year < 100 ? 2000 + year : year; + return new Date(fullYear, month - 1, day); + } + // If we have a custom format we rely on moment.js + if (typeof moment !== 'undefined' && input !== '') { + const parsedDate = moment(input, format, false); + + if (parsedDate.isValid()) { + return parsedDate.toDate(); } } + + return input; + }, + onOpen() { + // Call the static method to check styles. + Datepicker.resizeLogic(this.el); }, }); @@ -168,11 +207,27 @@ export class Datepicker { this.picker.destroy(); this.picker = null; } + if (this.attachResizeListener) { + window.removeEventListener('resize', this.handleResize); + } if (this.element) { this.element.removeAttribute('data-ecl-auto-initialized'); ECL.components.delete(this.element); } } + + /** + * Instance method to handle resizing with debouncing + */ + handleResize() { + clearTimeout(this.resizeTimer); + + this.resizeTimer = setTimeout(() => { + if (this.pikadayEl) { + Datepicker.resizeLogic(this.pikadayEl); + } + }, 150); + } } export default Datepicker; diff --git a/src/implementations/vanilla/components/datepicker/package.json b/src/implementations/vanilla/components/datepicker/package.json index ca4ba9e7a90..e0479518523 100644 --- a/src/implementations/vanilla/components/datepicker/package.json +++ b/src/implementations/vanilla/components/datepicker/package.json @@ -2,14 +2,14 @@ "name": "@ecl/vanilla-component-datepicker", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Datepicker", "main": "datepicker.js", "module": "datepicker.js", "style": "datepicker.scss", "sass": "datepicker.scss", "dependencies": { - "@ecl/vanilla-layout-grid": "4.7.0", + "@ecl/vanilla-layout-grid": "4.8.0", "pikaday": "1.8.2" }, "publishConfig": { diff --git a/src/implementations/vanilla/components/description-list/package.json b/src/implementations/vanilla/components/description-list/package.json index ac8fdde6563..017d7df8740 100644 --- a/src/implementations/vanilla/components/description-list/package.json +++ b/src/implementations/vanilla/components/description-list/package.json @@ -2,15 +2,15 @@ "name": "@ecl/vanilla-component-description-list", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Description List", "style": "description-list.scss", "sass": "description-list.scss", "main": "description-list.js", "module": "description-list.js", "dependencies": { - "@ecl/dom-utils": "4.7.0", - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/dom-utils": "4.8.0", + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/expandable/package.json b/src/implementations/vanilla/components/expandable/package.json index 183deb0f563..79d096e8455 100644 --- a/src/implementations/vanilla/components/expandable/package.json +++ b/src/implementations/vanilla/components/expandable/package.json @@ -2,14 +2,14 @@ "name": "@ecl/vanilla-component-expandable", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Expandable", "main": "expandable.js", "module": "expandable.js", "style": "expandable.scss", "sass": "expandable.scss", "dependencies": { - "@ecl/dom-utils": "4.7.0" + "@ecl/dom-utils": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/fact-figures/package.json b/src/implementations/vanilla/components/fact-figures/package.json index c071020c673..88c68a8fc9e 100644 --- a/src/implementations/vanilla/components/fact-figures/package.json +++ b/src/implementations/vanilla/components/fact-figures/package.json @@ -2,12 +2,12 @@ "name": "@ecl/vanilla-component-fact-figures", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Fact and Figures", "style": "fact-figures.scss", "sass": "fact-figures.scss", "dependencies": { - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/featured-item/package.json b/src/implementations/vanilla/components/featured-item/package.json index 759fa22f974..bbcdb44eb31 100644 --- a/src/implementations/vanilla/components/featured-item/package.json +++ b/src/implementations/vanilla/components/featured-item/package.json @@ -2,12 +2,12 @@ "name": "@ecl/vanilla-component-featured-item", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Featured item", "style": "featured-item.scss", "sass": "featured-item.scss", "dependencies": { - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/file-upload/package.json b/src/implementations/vanilla/components/file-upload/package.json index 2c2ae627f2e..e768f9634f7 100644 --- a/src/implementations/vanilla/components/file-upload/package.json +++ b/src/implementations/vanilla/components/file-upload/package.json @@ -2,15 +2,15 @@ "name": "@ecl/vanilla-component-file-upload", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL File upload", "style": "file-upload.scss", "sass": "file-upload.scss", "module": "file-upload.js", "main": "file-upload.js", "dependencies": { - "@ecl/dom-utils": "4.7.0", - "@ecl/vanilla-utility-screen-reader": "4.7.0" + "@ecl/dom-utils": "4.8.0", + "@ecl/vanilla-utility-screen-reader": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/file/file.scss b/src/implementations/vanilla/components/file/file.scss index c3ee3913347..bf6a814bc10 100644 --- a/src/implementations/vanilla/components/file/file.scss +++ b/src/implementations/vanilla/components/file/file.scss @@ -257,10 +257,6 @@ $file: null !default; margin-top: 0; } - .ecl-file__info { - margin-inline-end: var(--s-m); - } - .ecl-file__translation-item { flex-direction: row; max-width: 100%; diff --git a/src/implementations/vanilla/components/file/package.json b/src/implementations/vanilla/components/file/package.json index c3ad01236fa..4d3ac075610 100644 --- a/src/implementations/vanilla/components/file/package.json +++ b/src/implementations/vanilla/components/file/package.json @@ -2,15 +2,15 @@ "name": "@ecl/vanilla-component-file", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL File", "style": "file.scss", "sass": "file.scss", "module": "file.js", "main": "file.js", "dependencies": { - "@ecl/dom-utils": "4.7.0", - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/dom-utils": "4.8.0", + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/form-group/package.json b/src/implementations/vanilla/components/form-group/package.json index c0ae5f74e33..fab444d99a5 100644 --- a/src/implementations/vanilla/components/form-group/package.json +++ b/src/implementations/vanilla/components/form-group/package.json @@ -2,7 +2,7 @@ "name": "@ecl/vanilla-component-form-group", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Form Group", "style": "form-group.scss", "sass": "form-group.scss", diff --git a/src/implementations/vanilla/components/gallery/package.json b/src/implementations/vanilla/components/gallery/package.json index fdebba22e2d..ce9c84546f6 100644 --- a/src/implementations/vanilla/components/gallery/package.json +++ b/src/implementations/vanilla/components/gallery/package.json @@ -2,16 +2,16 @@ "name": "@ecl/vanilla-component-gallery", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Gallery", "style": "gallery.scss", "sass": "gallery.scss", "module": "gallery.js", "main": "gallery.js", "dependencies": { - "@ecl/dom-utils": "4.7.0", - "@ecl/vanilla-layout-grid": "4.7.0", - "@ecl/vanilla-utility-screen-reader": "4.7.0", + "@ecl/dom-utils": "4.8.0", + "@ecl/vanilla-layout-grid": "4.8.0", + "@ecl/vanilla-utility-screen-reader": "4.8.0", "focus-trap": "7.6.0" }, "publishConfig": { diff --git a/src/implementations/vanilla/components/icon/package.json b/src/implementations/vanilla/components/icon/package.json index ca546b2906d..30cf17b7cbe 100644 --- a/src/implementations/vanilla/components/icon/package.json +++ b/src/implementations/vanilla/components/icon/package.json @@ -2,7 +2,7 @@ "name": "@ecl/vanilla-component-icon", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Icons", "style": "icon.scss", "sass": "icon.scss", diff --git a/src/implementations/vanilla/components/inpage-navigation/package.json b/src/implementations/vanilla/components/inpage-navigation/package.json index 92135c2449e..fd9c93a0c0f 100644 --- a/src/implementations/vanilla/components/inpage-navigation/package.json +++ b/src/implementations/vanilla/components/inpage-navigation/package.json @@ -2,15 +2,15 @@ "name": "@ecl/vanilla-component-inpage-navigation", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL In-page Navigation", "main": "inpage-navigation.js", "module": "inpage-navigation.js", "style": "inpage-navigation.scss", "sass": "inpage-navigation.scss", "dependencies": { - "@ecl/dom-utils": "4.7.0", - "@ecl/vanilla-layout-grid": "4.7.0", + "@ecl/dom-utils": "4.8.0", + "@ecl/vanilla-layout-grid": "4.8.0", "focus-trap": "7.6.0", "gumshoejs": "5.1.2", "stickyfilljs": "2.1.0" diff --git a/src/implementations/vanilla/components/label/package.json b/src/implementations/vanilla/components/label/package.json index 754f95fa0d4..d135fe3d6d0 100644 --- a/src/implementations/vanilla/components/label/package.json +++ b/src/implementations/vanilla/components/label/package.json @@ -2,7 +2,7 @@ "name": "@ecl/vanilla-component-label", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Labels", "style": "label.scss", "sass": "label.scss", diff --git a/src/implementations/vanilla/components/link/package.json b/src/implementations/vanilla/components/link/package.json index c49e3b149ee..a6f05ef782a 100644 --- a/src/implementations/vanilla/components/link/package.json +++ b/src/implementations/vanilla/components/link/package.json @@ -2,12 +2,12 @@ "name": "@ecl/vanilla-component-link", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Links", "style": "link.scss", "sass": "link.scss", "dependencies": { - "@ecl/vanilla-utility-screen-reader": "4.7.0" + "@ecl/vanilla-utility-screen-reader": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/list-illustration/package.json b/src/implementations/vanilla/components/list-illustration/package.json index 2cc2d5781d6..11c2b77020d 100644 --- a/src/implementations/vanilla/components/list-illustration/package.json +++ b/src/implementations/vanilla/components/list-illustration/package.json @@ -2,12 +2,12 @@ "name": "@ecl/vanilla-component-list-illustration", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL List with illustration", "style": "list-illustration.scss", "sass": "list-illustration.scss", "dependencies": { - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/media-container/package.json b/src/implementations/vanilla/components/media-container/package.json index c23899028ac..b181cb2f365 100644 --- a/src/implementations/vanilla/components/media-container/package.json +++ b/src/implementations/vanilla/components/media-container/package.json @@ -2,16 +2,16 @@ "name": "@ecl/vanilla-component-media-container", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Media container", "style": "media-container.scss", "sass": "media-container.scss", "main": "media-container.js", "module": "media-container.js", "dependencies": { - "@ecl/dom-utils": "4.7.0", - "@ecl/vanilla-utility-media": "4.7.0", - "@ecl/vanilla-utility-screen-reader": "4.7.0" + "@ecl/dom-utils": "4.8.0", + "@ecl/vanilla-utility-media": "4.8.0", + "@ecl/vanilla-utility-screen-reader": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/mega-menu/mega-menu.js b/src/implementations/vanilla/components/mega-menu/mega-menu.js index eb444b42de9..f432bd935cb 100644 --- a/src/implementations/vanilla/components/mega-menu/mega-menu.js +++ b/src/implementations/vanilla/components/mega-menu/mega-menu.js @@ -706,6 +706,7 @@ export class MegaMenu { ); if (container) { container.firstElementChild.style.height = `${viewportHeight - mainTop}px`; + mainPanel.style.opacity = 1; return; } } @@ -1561,13 +1562,11 @@ export class MegaMenu { this.inner.classList.remove('ecl-mega-menu__inner--expanded'); // Reset heights - const megaMenus = queryAll( - '.ecl-mega-menu__item > .ecl-mega-menu__wrapper > .ecl-container > [data-ecl-mega-menu-mega]', - this.element, - ); + const megaMenus = queryAll('[data-ecl-mega-menu-mega]', this.element); megaMenus.forEach((mega) => { mega.style.height = ''; mega.style.top = ''; + mega.style.opacity = ''; }); let currentItem = false; // Remove css class and attribute from menu items diff --git a/src/implementations/vanilla/components/mega-menu/package.json b/src/implementations/vanilla/components/mega-menu/package.json index af6f53e241e..8ab07cb6342 100644 --- a/src/implementations/vanilla/components/mega-menu/package.json +++ b/src/implementations/vanilla/components/mega-menu/package.json @@ -2,15 +2,15 @@ "name": "@ecl/vanilla-component-mega-menu", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Mega Menu", "module": "mega-menu.js", "main": "mega-menu.js", "style": "mega-menu.scss", "sass": "mega-menu.scss", "dependencies": { - "@ecl/dom-utils": "4.7.0", - "@ecl/vanilla-layout-grid": "4.7.0", + "@ecl/dom-utils": "4.8.0", + "@ecl/vanilla-layout-grid": "4.8.0", "mobile-device-detect": "0.4.3" }, "publishConfig": { diff --git a/src/implementations/vanilla/components/menu/menu.js b/src/implementations/vanilla/components/menu/menu.js index 2f177a38699..af9ef88c165 100644 --- a/src/implementations/vanilla/components/menu/menu.js +++ b/src/implementations/vanilla/components/menu/menu.js @@ -23,6 +23,7 @@ import { createFocusTrap } from 'focus-trap'; * @param {String} options.labelOpenAttribute The data attribute for open label * @param {String} options.labelCloseAttribute The data attribute for close label * @param {Boolean} options.attachClickListener Whether or not to bind click events + * @param {Boolean} options.attachTouchListener Whether or not to bind touch events * @param {Boolean} options.attachHoverListener Whether or not to bind hover events * @param {Boolean} options.attachFocusListener Whether or not to bind focus events * @param {Boolean} options.attachKeyListener Whether or not to bind keyboard events @@ -79,6 +80,7 @@ export class Menu { labelOpenAttribute = 'data-ecl-menu-label-open', labelCloseAttribute = 'data-ecl-menu-label-close', attachClickListener = true, + attachTouchListener = true, attachHoverListener = true, attachFocusListener = true, attachKeyListener = true, @@ -115,6 +117,7 @@ export class Menu { this.labelOpenAttribute = labelOpenAttribute; this.labelCloseAttribute = labelCloseAttribute; this.attachClickListener = attachClickListener; + this.attachTouchListener = attachTouchListener; this.attachHoverListener = attachHoverListener; this.attachFocusListener = attachFocusListener; this.attachKeyListener = attachKeyListener; @@ -146,6 +149,7 @@ export class Menu { this.totalItemsWidth = 0; this.breakpointL = 996; this.windowWidth = null; + this.ignorehover = false; // Bind `this` for use in callbacks this.handleClickOnOpen = this.handleClickOnOpen.bind(this); @@ -157,6 +161,9 @@ export class Menu { this.handleClickOnPreviousItems.bind(this); this.handleClickOnCaret = this.handleClickOnCaret.bind(this); this.handleClickGlobal = this.handleClickGlobal.bind(this); + this.openItem = this.openItem.bind(this); + this.closeItem = this.closeItem.bind(this); + this.handleTouchOnCaret = this.handleTouchOnCaret.bind(this); this.handleHoverOnItem = this.handleHoverOnItem.bind(this); this.handleHoverOffItem = this.handleHoverOffItem.bind(this); this.handleFocusIn = this.handleFocusIn.bind(this); @@ -268,6 +275,13 @@ export class Menu { if (this.attachClickListener) { caret.addEventListener('click', this.handleClickOnCaret); } + + if (caret.parentElement.hasAttribute('data-ecl-has-children')) { + // Bind touch events on caret + if (this.attachTouchListener) { + caret.addEventListener('touchstart', this.handleTouchOnCaret); + } + } }); } @@ -300,7 +314,7 @@ export class Menu { this.totalItemsWidth += item.offsetWidth; if (item.hasAttribute('data-ecl-has-children')) { - // Bind hover and focus events on menu items + // Bind hover events on menu items if (this.attachHoverListener) { item.addEventListener('mouseover', this.handleHoverOnItem); item.addEventListener('mouseout', this.handleHoverOffItem); @@ -1138,9 +1152,9 @@ export class Menu { // Desktop display if (menuExpanded === 'false') { if (menuItem.getAttribute('aria-expanded') === 'true') { - this.handleHoverOffItem(e); + this.closeItem(e); } else { - this.handleHoverOnItem(e); + this.openItem(e); } return; } @@ -1171,13 +1185,16 @@ export class Menu { if (firstItem) { firstItem.focus(); } + + // Reactivate hover event + this.ignorehover = false; } /** - * Hover on a menu item + * Open a menu item * @param {Event} e */ - handleHoverOnItem(e) { + openItem(e) { const menuItem = e.target.closest(this.itemSelector); // Ignore hidden or partially hidden items @@ -1211,10 +1228,10 @@ export class Menu { } /** - * Deselect a menu item + * Close a menu item * @param {Event} e */ - handleHoverOffItem(e) { + closeItem(e) { // Remove attribute to current item const menuItem = e.target.closest(this.itemSelector); menuItem.setAttribute('aria-expanded', 'false'); @@ -1227,6 +1244,36 @@ export class Menu { return this; } + /** + * Touch on a caret + */ + handleTouchOnCaret() { + // Disable hover event, as they are triggered also by touch screens + this.ignorehover = true; + } + + /** + * Hover on a menu item + * @param {Event} e + */ + handleHoverOnItem(e) { + // Ignore touch screen + if (this.ignorehover) return; + + this.openItem(e); + } + + /** + * Hover off a menu item + * @param {Event} e + */ + handleHoverOffItem(e) { + // Ignore touch screen + if (this.ignorehover) return; + + this.closeItem(e); + } + /** * Deselect any opened menu item */ diff --git a/src/implementations/vanilla/components/menu/package.json b/src/implementations/vanilla/components/menu/package.json index 6cb4a0a7175..f1673fbb5f4 100644 --- a/src/implementations/vanilla/components/menu/package.json +++ b/src/implementations/vanilla/components/menu/package.json @@ -2,15 +2,15 @@ "name": "@ecl/vanilla-component-menu", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Menu", "module": "menu.js", "main": "menu.js", "style": "menu.scss", "sass": "menu.scss", "dependencies": { - "@ecl/dom-utils": "4.7.0", - "@ecl/vanilla-layout-grid": "4.7.0", + "@ecl/dom-utils": "4.8.0", + "@ecl/vanilla-layout-grid": "4.8.0", "mobile-device-detect": "0.4.3", "stickyfilljs": "2.1.0" }, diff --git a/src/implementations/vanilla/components/modal/modal.scss b/src/implementations/vanilla/components/modal/modal.scss index 14ab5ec87d0..ef8f31dbb10 100644 --- a/src/implementations/vanilla/components/modal/modal.scss +++ b/src/implementations/vanilla/components/modal/modal.scss @@ -180,7 +180,10 @@ $overflow-height: 2rem; } .ecl-modal__close { - margin: map.get($modal, 'close-margin'); + margin-bottom: 0; + margin-inline-end: map.get($modal, 'close', 'margin-end'); + margin-inline-start: 0; + margin-top: map.get($modal, 'close', 'margin-top'); .ecl-button__icon { margin: 0; diff --git a/src/implementations/vanilla/components/modal/package.json b/src/implementations/vanilla/components/modal/package.json index c0f4349323d..f46f0309aee 100644 --- a/src/implementations/vanilla/components/modal/package.json +++ b/src/implementations/vanilla/components/modal/package.json @@ -2,15 +2,15 @@ "name": "@ecl/vanilla-component-modal", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Modal", "main": "modal.js", "module": "modal.js", "style": "modal.scss", "sass": "modal.scss", "dependencies": { - "@ecl/dom-utils": "4.7.0", - "@ecl/vanilla-layout-grid": "4.7.0", + "@ecl/dom-utils": "4.8.0", + "@ecl/vanilla-layout-grid": "4.8.0", "focus-trap": "7.6.0" }, "publishConfig": { diff --git a/src/implementations/vanilla/components/navigation-list/package.json b/src/implementations/vanilla/components/navigation-list/package.json index c841d1b2f1f..5ac8901a3f2 100644 --- a/src/implementations/vanilla/components/navigation-list/package.json +++ b/src/implementations/vanilla/components/navigation-list/package.json @@ -2,12 +2,12 @@ "name": "@ecl/vanilla-component-navigation-list", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Navigation List", "style": "navigation-list.scss", "sass": "navigation-list.scss", "dependencies": { - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/news-ticker/package.json b/src/implementations/vanilla/components/news-ticker/package.json index c957c4002d0..d290aeb0ab7 100644 --- a/src/implementations/vanilla/components/news-ticker/package.json +++ b/src/implementations/vanilla/components/news-ticker/package.json @@ -2,15 +2,15 @@ "name": "@ecl/vanilla-component-news-ticker", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL News ticker", "main": "news-ticker.js", "module": "news-ticker.js", "style": "news-ticker.scss", "sass": "news-ticker.scss", "dependencies": { - "@ecl/dom-utils": "4.7.0", - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/dom-utils": "4.8.0", + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/notification/notification-print.scss b/src/implementations/vanilla/components/notification/notification-print.scss index ae2be95bf09..5b75e835a1f 100644 --- a/src/implementations/vanilla/components/notification/notification-print.scss +++ b/src/implementations/vanilla/components/notification/notification-print.scss @@ -41,6 +41,10 @@ $notification-print: null !default; max-width: var(--max-w); } +.ecl-notification__link { + grid-column-start: 1; +} + .ecl-notification__description { grid-column-start: 1; margin: 0; diff --git a/src/implementations/vanilla/components/notification/notification.js b/src/implementations/vanilla/components/notification/notification.js index b43a71f291b..5ed003a22e1 100644 --- a/src/implementations/vanilla/components/notification/notification.js +++ b/src/implementations/vanilla/components/notification/notification.js @@ -1,4 +1,5 @@ import { queryOne } from '@ecl/dom-utils'; +import EventManager from '@ecl/event-manager'; /** * @param {HTMLElement} element DOM element for component instantiation and scope @@ -22,6 +23,15 @@ export class Notification { return notification; } + /** + * An array of supported events for this component. + * + * @type {Array} + * @event Notification#onClose + * @memberof Notification + */ + supportedEvents = ['onClose']; + constructor( element, { @@ -37,6 +47,7 @@ export class Notification { } this.element = element; + this.eventManager = new EventManager(); // Options this.closeSelector = closeSelector; @@ -70,6 +81,37 @@ export class Notification { ECL.components.set(this.element, this); } + /** + * Register a callback function for a specific event. + * + * @param {string} eventName - The name of the event to listen for. + * @param {Function} callback - The callback function to be invoked when the event occurs. + * @returns {void} + * @memberof Notification + * @instance + * + * @example + * // Registering a callback for the 'close' event + * notification.on('onClose', (event) => { + * console.log('Close event occurred!', event); + * }); + */ + on(eventName, callback) { + this.eventManager.on(eventName, callback); + } + + /** + * Trigger a component event. + * + * @param {string} eventName - The name of the event to trigger. + * @param {any} eventData - Data associated with the event. + * + * @memberof Notification + */ + trigger(eventName, eventData) { + this.eventManager.trigger(eventName, eventData); + } + /** * Destroy component. */ @@ -85,13 +127,19 @@ export class Notification { /** * Remove the notification component. + * + * @param {Event} e + * + * @fires Notification#onClose */ - handleClickOnClose() { + handleClickOnClose(e) { // IE way to remove a node... if (this.element.parentNode) { this.element.parentNode.removeChild(this.element); } + this.trigger('onClose', e); + return this; } } diff --git a/src/implementations/vanilla/components/notification/notification.scss b/src/implementations/vanilla/components/notification/notification.scss index 3d802c4cff1..a779cd280a0 100644 --- a/src/implementations/vanilla/components/notification/notification.scss +++ b/src/implementations/vanilla/components/notification/notification.scss @@ -18,10 +18,10 @@ $notification: null !default; display: flex; font: map.get($notification, 'font'); margin: 0; - padding-bottom: map.get($notification, 'padding'); - padding-inline-start: map.get($notification, 'padding-start'); - padding-inline-end: map.get($notification, 'padding-end'); - padding-top: map.get($notification, 'padding'); + padding-bottom: map.get($notification, 'padding-mobile'); + padding-inline-start: map.get($notification, 'padding-start-mobile'); + padding-inline-end: map.get($notification, 'padding-end-mobile'); + padding-top: map.get($notification, 'padding-mobile'); position: relative; } @@ -46,10 +46,14 @@ $notification: null !default; .ecl-notification__description { grid-column-start: 1; - margin: 0 0 var(--s-xs); + margin: 0; max-width: var(--max-w); } +.ecl-notification__link { + grid-column-start: 1; +} + .ecl-notification__close { align-self: self-start; color: map.get($notification, 'close-color'); @@ -67,6 +71,17 @@ $notification: null !default; /* stylelint-disable-next-line order/order */ @include breakpoints.up('m') { + .ecl-notification { + padding-bottom: map.get($notification, 'padding'); + padding-inline-end: map.get($notification, 'padding-end'); + padding-inline-start: map.get($notification, 'padding-start'); + padding-top: map.get($notification, 'padding'); + } + + .ecl-notification__icon { + margin-inline-end: var(--s-m); + } + .ecl-notification__description { margin-bottom: 0; padding-bottom: 0; @@ -110,11 +125,28 @@ $notification: null !default; .ecl-notification__icon-background { background: map.get($notification, 'warning', 'icon-background-color'); height: map.get($notification, 'warning', 'icon-background-height'); - left: map.get($notification, 'warning', 'icon-background-left'); + left: map.get($notification, 'warning', 'icon-background-left-mobile'); position: absolute; width: map.get($notification, 'warning', 'icon-background-width'); - top: map.get($notification, 'warning', 'icon-background-top'); + top: map.get($notification, 'warning', 'icon-background-top-mobile'); z-index: 1; + + &:dir(rtl) { + left: auto; + right: map.get($notification, 'warning', 'icon-background-left-mobile'); + } + } +} + +@include breakpoints.up('m') { + .ecl-notification--warning .ecl-notification__icon-background { + left: map.get($notification, 'warning', 'icon-background-left'); + top: map.get($notification, 'warning', 'icon-background-top'); + + &:dir(rtl) { + left: auto; + right: map.get($notification, 'warning', 'icon-background-left'); + } } } diff --git a/src/implementations/vanilla/components/notification/package.json b/src/implementations/vanilla/components/notification/package.json index 3a159b7000a..8d62703eab8 100644 --- a/src/implementations/vanilla/components/notification/package.json +++ b/src/implementations/vanilla/components/notification/package.json @@ -2,15 +2,15 @@ "name": "@ecl/vanilla-component-notification", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Notification", "main": "notification.js", "module": "notification.js", "style": "notification.scss", "sass": "notification.scss", "dependencies": { - "@ecl/dom-utils": "4.7.0", - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/dom-utils": "4.8.0", + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/ordered-list/package.json b/src/implementations/vanilla/components/ordered-list/package.json index 2d4103129ad..efa93223fe3 100644 --- a/src/implementations/vanilla/components/ordered-list/package.json +++ b/src/implementations/vanilla/components/ordered-list/package.json @@ -2,7 +2,7 @@ "name": "@ecl/vanilla-component-ordered-list", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Ordered List", "style": "ordered-list.scss", "sass": "ordered-list.scss", diff --git a/src/implementations/vanilla/components/page-header/package.json b/src/implementations/vanilla/components/page-header/package.json index 0b02e562f4b..5208bf5651a 100644 --- a/src/implementations/vanilla/components/page-header/package.json +++ b/src/implementations/vanilla/components/page-header/package.json @@ -2,12 +2,12 @@ "name": "@ecl/vanilla-component-page-header", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Page Header", "style": "page-header.scss", "sass": "page-header.scss", "dependencies": { - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/pagination/package.json b/src/implementations/vanilla/components/pagination/package.json index c739aa50a9f..a025f362d44 100644 --- a/src/implementations/vanilla/components/pagination/package.json +++ b/src/implementations/vanilla/components/pagination/package.json @@ -2,12 +2,12 @@ "name": "@ecl/vanilla-component-pagination", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Pagination", "style": "pagination.scss", "sass": "pagination.scss", "dependencies": { - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/picture/package.json b/src/implementations/vanilla/components/picture/package.json index 73accce8605..ddb943a69ed 100644 --- a/src/implementations/vanilla/components/picture/package.json +++ b/src/implementations/vanilla/components/picture/package.json @@ -2,7 +2,7 @@ "name": "@ecl/vanilla-component-picture", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Picture", "style": "picture.scss", "sass": "picture.scss", diff --git a/src/implementations/vanilla/components/popover/package.json b/src/implementations/vanilla/components/popover/package.json index 032d3a68aa6..0d0bdbbc62f 100644 --- a/src/implementations/vanilla/components/popover/package.json +++ b/src/implementations/vanilla/components/popover/package.json @@ -2,15 +2,15 @@ "name": "@ecl/vanilla-component-popover", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Popover", "main": "popover.js", "module": "popover.js", "style": "popover.scss", "sass": "popover.scss", "dependencies": { - "@ecl/dom-utils": "4.7.0", - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/dom-utils": "4.8.0", + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/radio/package.json b/src/implementations/vanilla/components/radio/package.json index 41e44c9e96b..e1034ff55be 100644 --- a/src/implementations/vanilla/components/radio/package.json +++ b/src/implementations/vanilla/components/radio/package.json @@ -2,7 +2,7 @@ "name": "@ecl/vanilla-component-radio", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Radio", "style": "radio.scss", "sass": "radio.scss", diff --git a/src/implementations/vanilla/components/range/package.json b/src/implementations/vanilla/components/range/package.json index 18d7635ee00..9a86b9b460d 100644 --- a/src/implementations/vanilla/components/range/package.json +++ b/src/implementations/vanilla/components/range/package.json @@ -2,15 +2,15 @@ "name": "@ecl/vanilla-component-range", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Range", "style": "range.scss", "sass": "range.scss", "main": "range.js", "module": "range.js", "dependencies": { - "@ecl/dom-utils": "4.7.0", - "@ecl/vanilla-layout-form": "4.7.0" + "@ecl/dom-utils": "4.8.0", + "@ecl/vanilla-layout-form": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/rating-field/package.json b/src/implementations/vanilla/components/rating-field/package.json index feadd054d78..3f249fcd54c 100644 --- a/src/implementations/vanilla/components/rating-field/package.json +++ b/src/implementations/vanilla/components/rating-field/package.json @@ -2,12 +2,12 @@ "name": "@ecl/vanilla-component-rating-field", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Rating field", "style": "rating-field.scss", "sass": "rating-field.scss", "dependencies": { - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/search-form/package.json b/src/implementations/vanilla/components/search-form/package.json index 637337465ad..e591da0dfa0 100644 --- a/src/implementations/vanilla/components/search-form/package.json +++ b/src/implementations/vanilla/components/search-form/package.json @@ -2,13 +2,13 @@ "name": "@ecl/vanilla-component-search-form", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Search form", "style": "search-form.scss", "sass": "search-form.scss", "dependencies": { - "@ecl/vanilla-layout-grid": "4.7.0", - "@ecl/vanilla-utility-screen-reader": "4.7.0" + "@ecl/vanilla-layout-grid": "4.8.0", + "@ecl/vanilla-utility-screen-reader": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/select/package.json b/src/implementations/vanilla/components/select/package.json index e10ac6f5f86..84698ec0784 100644 --- a/src/implementations/vanilla/components/select/package.json +++ b/src/implementations/vanilla/components/select/package.json @@ -2,17 +2,17 @@ "name": "@ecl/vanilla-component-select", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Select", "main": "select.js", "module": "select.js", "style": "select.scss", "sass": "select.scss", "dependencies": { - "@ecl/builder": "4.7.0", - "@ecl/dom-utils": "4.7.0", - "@ecl/resources-icons": "4.7.0", - "@ecl/vanilla-layout-form": "4.7.0" + "@ecl/builder": "4.8.0", + "@ecl/dom-utils": "4.8.0", + "@ecl/resources-icons": "4.8.0", + "@ecl/vanilla-layout-form": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/select/select.scss b/src/implementations/vanilla/components/select/select.scss index 6f664bb61d5..f6e53e20bc4 100644 --- a/src/implementations/vanilla/components/select/select.scss +++ b/src/implementations/vanilla/components/select/select.scss @@ -234,6 +234,10 @@ $select: null !default; position: relative; max-width: 100%; + .ecl-form-label + .ecl-select__container--hidden + & { + margin-top: var(--s-xs); + } + .ecl-select__multiple-dropdown { background-color: map.get($select, 'multiple-dropdown-background-color'); border: map.get($select, 'multiple-dropdown-border'); diff --git a/src/implementations/vanilla/components/separator/package.json b/src/implementations/vanilla/components/separator/package.json index 0715668173b..78fbc98ec97 100644 --- a/src/implementations/vanilla/components/separator/package.json +++ b/src/implementations/vanilla/components/separator/package.json @@ -2,7 +2,7 @@ "name": "@ecl/vanilla-component-separator", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Separator", "style": "separator.scss", "sass": "separator.scss", diff --git a/src/implementations/vanilla/components/site-footer/package.json b/src/implementations/vanilla/components/site-footer/package.json index ea10fa2e15e..e7c48518e8a 100644 --- a/src/implementations/vanilla/components/site-footer/package.json +++ b/src/implementations/vanilla/components/site-footer/package.json @@ -2,12 +2,12 @@ "name": "@ecl/vanilla-component-site-footer", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Site Footer", "style": "site-footer.scss", "sass": "site-footer.scss", "dependencies": { - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/site-header/_site-header-language-switcher.scss b/src/implementations/vanilla/components/site-header/_site-header-language-switcher.scss index ce90513e1bf..b94ad8a6530 100644 --- a/src/implementations/vanilla/components/site-header/_site-header-language-switcher.scss +++ b/src/implementations/vanilla/components/site-header/_site-header-language-switcher.scss @@ -78,6 +78,7 @@ $language-list: null !default; align-items: center; display: flex; justify-content: space-between; + padding-inline-start: var(--s-s); } .ecl-site-header__language-title { diff --git a/src/implementations/vanilla/components/site-header/package.json b/src/implementations/vanilla/components/site-header/package.json index 1beab723c5f..455e38c509e 100644 --- a/src/implementations/vanilla/components/site-header/package.json +++ b/src/implementations/vanilla/components/site-header/package.json @@ -2,15 +2,15 @@ "name": "@ecl/vanilla-component-site-header", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Site Header", "main": "site-header.js", "module": "site-header.js", "style": "site-header.scss", "sass": "site-header.scss", "dependencies": { - "@ecl/dom-utils": "4.7.0", - "@ecl/vanilla-layout-grid": "4.7.0", + "@ecl/dom-utils": "4.8.0", + "@ecl/vanilla-layout-grid": "4.8.0", "focus-trap": "7.6.0" }, "publishConfig": { diff --git a/src/implementations/vanilla/components/site-header/site-header.js b/src/implementations/vanilla/components/site-header/site-header.js index 2552772dc78..f4984b1bdfd 100644 --- a/src/implementations/vanilla/components/site-header/site-header.js +++ b/src/implementations/vanilla/components/site-header/site-header.js @@ -48,6 +48,7 @@ export class SiteHeader { searchFormSelector = '[data-ecl-search-form]', loginToggleSelector = '[data-ecl-login-toggle]', loginBoxSelector = '[data-ecl-login-box]', + notificationSelector = '[data-ecl-site-header-notification]', attachClickListener = true, attachKeyListener = true, attachResizeListener = true, @@ -74,6 +75,7 @@ export class SiteHeader { this.searchToggleSelector = searchToggleSelector; this.searchFormSelector = searchFormSelector; this.loginToggleSelector = loginToggleSelector; + this.notificationSelector = notificationSelector; this.loginBoxSelector = loginBoxSelector; this.attachClickListener = attachClickListener; this.attachKeyListener = attachKeyListener; @@ -95,6 +97,7 @@ export class SiteHeader { this.loginBox = null; this.resizeTimer = null; this.direction = null; + this.notificationContainer = null; // Bind `this` for use in callbacks this.openOverlay = this.openOverlay.bind(this); @@ -109,6 +112,7 @@ export class SiteHeader { this.handleClickGlobal = this.handleClickGlobal.bind(this); this.handleResize = this.handleResize.bind(this); this.setLanguageListHeight = this.setLanguageListHeight.bind(this); + this.handleNotificationClose = this.handleNotificationClose.bind(this); } /** @@ -141,6 +145,7 @@ export class SiteHeader { this.languageListNonEu = queryOne(this.languageListNonEuSelector); this.languageListContent = queryOne(this.languageListContentSelector); this.close = queryOne(this.closeOverlaySelector); + this.notification = queryOne(this.notificationSelector); // direction this.direction = getComputedStyle(this.element).direction; @@ -186,6 +191,20 @@ export class SiteHeader { // Set ecl initialized attribute this.element.setAttribute('data-ecl-auto-initialized', 'true'); ECL.components.set(this.element, this); + + if (this.notification) { + this.notificationContainer = this.notification.closest( + '.ecl-site-header__notification', + ); + + setTimeout(() => { + const eclNotification = ECL.components.get(this.notification); + + if (eclNotification) { + eclNotification.on('onClose', this.handleNotificationClose); + } + }, 0); + } } /** @@ -400,6 +419,15 @@ export class SiteHeader { } } + /** + * Removes the containers of the notification element + */ + handleNotificationClose() { + if (this.notificationContainer) { + this.notificationContainer.remove(); + } + } + /** * Set a max height for the language list content */ diff --git a/src/implementations/vanilla/components/skip-link/package.json b/src/implementations/vanilla/components/skip-link/package.json index a1c1ff23bc1..bef8e5674b6 100644 --- a/src/implementations/vanilla/components/skip-link/package.json +++ b/src/implementations/vanilla/components/skip-link/package.json @@ -2,12 +2,12 @@ "name": "@ecl/vanilla-component-skip-link", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Skip link", "style": "skip-link.scss", "sass": "skip-link.scss", "dependencies": { - "@ecl/vanilla-utility-screen-reader": "4.7.0" + "@ecl/vanilla-utility-screen-reader": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/social-media-follow/package.json b/src/implementations/vanilla/components/social-media-follow/package.json index 7dbd2faf3e3..41af53b335b 100644 --- a/src/implementations/vanilla/components/social-media-follow/package.json +++ b/src/implementations/vanilla/components/social-media-follow/package.json @@ -2,12 +2,12 @@ "name": "@ecl/vanilla-component-social-media-follow", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Social Media Follow", "style": "social-media-follow.scss", "sass": "social-media-follow.scss", "dependencies": { - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/social-media-share/package.json b/src/implementations/vanilla/components/social-media-share/package.json index 03689151198..81f9f826ae0 100644 --- a/src/implementations/vanilla/components/social-media-share/package.json +++ b/src/implementations/vanilla/components/social-media-share/package.json @@ -2,12 +2,12 @@ "name": "@ecl/vanilla-component-social-media-share", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Social Media Share", "style": "social-media-share.scss", "sass": "social-media-share.scss", "dependencies": { - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/spinner/package.json b/src/implementations/vanilla/components/spinner/package.json index 622ba7e2a77..ee95821796f 100644 --- a/src/implementations/vanilla/components/spinner/package.json +++ b/src/implementations/vanilla/components/spinner/package.json @@ -2,7 +2,7 @@ "name": "@ecl/vanilla-component-spinner", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Spinner", "style": "spinner.scss", "sass": "spinner.scss", diff --git a/src/implementations/vanilla/components/splash-page/package.json b/src/implementations/vanilla/components/splash-page/package.json index 4d4a24e55a5..4071c0d4cb3 100644 --- a/src/implementations/vanilla/components/splash-page/package.json +++ b/src/implementations/vanilla/components/splash-page/package.json @@ -2,12 +2,12 @@ "name": "@ecl/vanilla-component-splash-page", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Splash page", "style": "splash-page.scss", "sass": "splash-page.scss", "dependencies": { - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/splash-page/splash-page.scss b/src/implementations/vanilla/components/splash-page/splash-page.scss index 7243ac35364..390ba0d2b6e 100644 --- a/src/implementations/vanilla/components/splash-page/splash-page.scss +++ b/src/implementations/vanilla/components/splash-page/splash-page.scss @@ -45,6 +45,7 @@ $language-list: null !default; .ecl-splash-page__language-title { font: map.get($language-list, 'header-font-mobile'); margin: 0; + padding-inline-start: var(--s-s); } .ecl-splash-page__language-content { diff --git a/src/implementations/vanilla/components/table/package.json b/src/implementations/vanilla/components/table/package.json index 3abf6c18ff4..6a8f73945b4 100644 --- a/src/implementations/vanilla/components/table/package.json +++ b/src/implementations/vanilla/components/table/package.json @@ -2,17 +2,17 @@ "name": "@ecl/vanilla-component-table", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Table", "style": "table.scss", "sass": "table.scss", "main": "table.js", "module": "table.js", "dependencies": { - "@ecl/builder": "4.7.0", - "@ecl/dom-utils": "4.7.0", - "@ecl/resources-icons": "4.7.0", - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/builder": "4.8.0", + "@ecl/dom-utils": "4.8.0", + "@ecl/resources-icons": "4.8.0", + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/tabs/package.json b/src/implementations/vanilla/components/tabs/package.json index 648035b13a3..a04618f4196 100644 --- a/src/implementations/vanilla/components/tabs/package.json +++ b/src/implementations/vanilla/components/tabs/package.json @@ -2,16 +2,16 @@ "name": "@ecl/vanilla-component-tabs", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Tabs", "main": "tabs.js", "module": "tabs.js", "style": "tabs.scss", "sass": "tabs.scss", "dependencies": { - "@ecl/dom-utils": "4.7.0", - "@ecl/vanilla-layout-grid": "4.7.0", - "@ecl/vanilla-utility-screen-reader": "4.7.0" + "@ecl/dom-utils": "4.8.0", + "@ecl/vanilla-layout-grid": "4.8.0", + "@ecl/vanilla-utility-screen-reader": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/tabs/tabs.scss b/src/implementations/vanilla/components/tabs/tabs.scss index 2a49babfced..5405e029d38 100644 --- a/src/implementations/vanilla/components/tabs/tabs.scss +++ b/src/implementations/vanilla/components/tabs/tabs.scss @@ -237,11 +237,6 @@ $button-width: 44px; top: 0; height: $button-width; - .ecl-button__container { - height: 100%; - width: 100%; - } - .ecl-icon { height: 1rem; width: 1rem; diff --git a/src/implementations/vanilla/components/tag/package.json b/src/implementations/vanilla/components/tag/package.json index bbf21e816b4..2d587be6ee8 100644 --- a/src/implementations/vanilla/components/tag/package.json +++ b/src/implementations/vanilla/components/tag/package.json @@ -2,7 +2,7 @@ "name": "@ecl/vanilla-component-tag", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL tags", "style": "tag.scss", "sass": "tag.scss", diff --git a/src/implementations/vanilla/components/text-area/package.json b/src/implementations/vanilla/components/text-area/package.json index 964f1327091..9bc6e228c2e 100644 --- a/src/implementations/vanilla/components/text-area/package.json +++ b/src/implementations/vanilla/components/text-area/package.json @@ -2,12 +2,12 @@ "name": "@ecl/vanilla-component-text-area", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Text Area", "style": "text-area.scss", "sass": "text-area.scss", "dependencies": { - "@ecl/vanilla-layout-form": "4.7.0" + "@ecl/vanilla-layout-form": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/text-input/package.json b/src/implementations/vanilla/components/text-input/package.json index 5c59b1c55b5..29809a3816e 100644 --- a/src/implementations/vanilla/components/text-input/package.json +++ b/src/implementations/vanilla/components/text-input/package.json @@ -2,12 +2,12 @@ "name": "@ecl/vanilla-component-text-input", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "", "style": "text-input.scss", "sass": "text-input.scss", "dependencies": { - "@ecl/vanilla-layout-form": "4.7.0" + "@ecl/vanilla-layout-form": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/timeline/package.json b/src/implementations/vanilla/components/timeline/package.json index da036eea612..05b9e355aed 100644 --- a/src/implementations/vanilla/components/timeline/package.json +++ b/src/implementations/vanilla/components/timeline/package.json @@ -6,11 +6,11 @@ "style": "timeline.scss", "sass": "timeline.scss", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Timeline", "dependencies": { - "@ecl/dom-utils": "4.7.0", - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/dom-utils": "4.8.0", + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/components/unordered-list/package.json b/src/implementations/vanilla/components/unordered-list/package.json index e43e62f3cf2..16dbcf046e6 100644 --- a/src/implementations/vanilla/components/unordered-list/package.json +++ b/src/implementations/vanilla/components/unordered-list/package.json @@ -2,7 +2,7 @@ "name": "@ecl/vanilla-component-unordered-list", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Unordered List", "style": "unordered-list.scss", "sass": "unordered-list.scss", diff --git a/src/implementations/vanilla/components/video/package.json b/src/implementations/vanilla/components/video/package.json index 7defb50966f..1187e197225 100644 --- a/src/implementations/vanilla/components/video/package.json +++ b/src/implementations/vanilla/components/video/package.json @@ -2,7 +2,7 @@ "name": "@ecl/vanilla-component-video", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Video", "style": "video.scss", "sass": "video.scss", diff --git a/src/implementations/vanilla/layout/form/package.json b/src/implementations/vanilla/layout/form/package.json index eaa9688a2cc..bcba4a3b3fb 100644 --- a/src/implementations/vanilla/layout/form/package.json +++ b/src/implementations/vanilla/layout/form/package.json @@ -2,13 +2,13 @@ "name": "@ecl/vanilla-layout-form", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Form", "publishConfig": { "access": "public" }, "dependencies": { - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/vanilla-layout-grid": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/vanilla/layout/grid/package.json b/src/implementations/vanilla/layout/grid/package.json index eb11324fa9d..c084fa9c827 100644 --- a/src/implementations/vanilla/layout/grid/package.json +++ b/src/implementations/vanilla/layout/grid/package.json @@ -2,7 +2,7 @@ "name": "@ecl/vanilla-layout-grid", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Grid", "style": "grid.scss", "publishConfig": { diff --git a/src/implementations/vanilla/utilities/background/package.json b/src/implementations/vanilla/utilities/background/package.json index 1d764231054..175e9af022b 100644 --- a/src/implementations/vanilla/utilities/background/package.json +++ b/src/implementations/vanilla/utilities/background/package.json @@ -2,7 +2,7 @@ "name": "@ecl/vanilla-utility-background", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Utility Background", "style": "background.scss", "sass": "background.scss", diff --git a/src/implementations/vanilla/utilities/border/package.json b/src/implementations/vanilla/utilities/border/package.json index acebce8eeae..4516735e00b 100644 --- a/src/implementations/vanilla/utilities/border/package.json +++ b/src/implementations/vanilla/utilities/border/package.json @@ -2,7 +2,7 @@ "name": "@ecl/vanilla-utility-border", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Border", "style": "border.scss", "sass": "border.scss", @@ -10,7 +10,7 @@ "access": "public" }, "dependencies": { - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/vanilla-layout-grid": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/vanilla/utilities/clearfix/package.json b/src/implementations/vanilla/utilities/clearfix/package.json index 18b6e8b1a27..34a061b1ed2 100644 --- a/src/implementations/vanilla/utilities/clearfix/package.json +++ b/src/implementations/vanilla/utilities/clearfix/package.json @@ -2,7 +2,7 @@ "name": "@ecl/vanilla-utility-clearfix", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Utility Clearfix", "style": "clearfix.scss", "sass": "clearfix.scss", diff --git a/src/implementations/vanilla/utilities/dimension/package.json b/src/implementations/vanilla/utilities/dimension/package.json index d4e582e1a70..fe318e32ff3 100644 --- a/src/implementations/vanilla/utilities/dimension/package.json +++ b/src/implementations/vanilla/utilities/dimension/package.json @@ -2,7 +2,7 @@ "name": "@ecl/vanilla-utility-dimension", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Utility Dimension", "style": "dimension.scss", "sass": "dimension.scss", diff --git a/src/implementations/vanilla/utilities/disablescroll/package.json b/src/implementations/vanilla/utilities/disablescroll/package.json index e8d07518fef..7b7f5ba3440 100644 --- a/src/implementations/vanilla/utilities/disablescroll/package.json +++ b/src/implementations/vanilla/utilities/disablescroll/package.json @@ -2,7 +2,7 @@ "name": "@ecl/vanilla-utility-disablescroll", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Disable scroll", "style": "disablescroll.scss", "sass": "disablescroll.scss", diff --git a/src/implementations/vanilla/utilities/display/package.json b/src/implementations/vanilla/utilities/display/package.json index 7a86a159e5f..c3454a26c3e 100644 --- a/src/implementations/vanilla/utilities/display/package.json +++ b/src/implementations/vanilla/utilities/display/package.json @@ -2,12 +2,12 @@ "name": "@ecl/vanilla-utility-display", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Utility Display", "style": "display.scss", "sass": "display.scss", "dependencies": { - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/utilities/flex/package.json b/src/implementations/vanilla/utilities/flex/package.json index 49f526849e3..31aa8d772a7 100644 --- a/src/implementations/vanilla/utilities/flex/package.json +++ b/src/implementations/vanilla/utilities/flex/package.json @@ -2,12 +2,12 @@ "name": "@ecl/vanilla-utility-flex", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Utility Flex", "style": "flex.scss", "sass": "flex.scss", "dependencies": { - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/utilities/float/package.json b/src/implementations/vanilla/utilities/float/package.json index 10fa69a735b..41e06656649 100644 --- a/src/implementations/vanilla/utilities/float/package.json +++ b/src/implementations/vanilla/utilities/float/package.json @@ -2,7 +2,7 @@ "name": "@ecl/vanilla-utility-float", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Float", "style": "float.scss", "sass": "float.scss", diff --git a/src/implementations/vanilla/utilities/media/package.json b/src/implementations/vanilla/utilities/media/package.json index 91851677ed7..26d2d276fc1 100644 --- a/src/implementations/vanilla/utilities/media/package.json +++ b/src/implementations/vanilla/utilities/media/package.json @@ -2,12 +2,12 @@ "name": "@ecl/vanilla-utility-media", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Utility Media", "style": "media.scss", "sass": "media.scss", "dependencies": { - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/utilities/print/package.json b/src/implementations/vanilla/utilities/print/package.json index 8bebf4b21f1..4c29acde752 100644 --- a/src/implementations/vanilla/utilities/print/package.json +++ b/src/implementations/vanilla/utilities/print/package.json @@ -2,7 +2,7 @@ "name": "@ecl/vanilla-utility-print", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL EC Print", "style": "print.scss", "sass": "print.scss", diff --git a/src/implementations/vanilla/utilities/screen-reader/package.json b/src/implementations/vanilla/utilities/screen-reader/package.json index 33c68a7e6cb..e086d463536 100644 --- a/src/implementations/vanilla/utilities/screen-reader/package.json +++ b/src/implementations/vanilla/utilities/screen-reader/package.json @@ -2,7 +2,7 @@ "name": "@ecl/vanilla-utility-screen-reader", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Utility Screen reader", "style": "screen-reader.scss", "sass": "screen-reader.scss", diff --git a/src/implementations/vanilla/utilities/shadow/package.json b/src/implementations/vanilla/utilities/shadow/package.json index aa8fc62d4ec..da05a0b8158 100644 --- a/src/implementations/vanilla/utilities/shadow/package.json +++ b/src/implementations/vanilla/utilities/shadow/package.json @@ -2,7 +2,7 @@ "name": "@ecl/vanilla-utility-shadow", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Utility Shadow", "style": "shadow.scss", "sass": "shadow.scss", diff --git a/src/implementations/vanilla/utilities/spacing/package.json b/src/implementations/vanilla/utilities/spacing/package.json index 0a9630fbacf..5097eb94bd3 100644 --- a/src/implementations/vanilla/utilities/spacing/package.json +++ b/src/implementations/vanilla/utilities/spacing/package.json @@ -2,12 +2,12 @@ "name": "@ecl/vanilla-utility-spacing", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Utility Spacing", "style": "spacing.scss", "sass": "spacing.scss", "dependencies": { - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/vanilla-layout-grid": "4.8.0" }, "publishConfig": { "access": "public" diff --git a/src/implementations/vanilla/utilities/typography/package.json b/src/implementations/vanilla/utilities/typography/package.json index 7f6b8918d62..10cdec1a3b6 100644 --- a/src/implementations/vanilla/utilities/typography/package.json +++ b/src/implementations/vanilla/utilities/typography/package.json @@ -2,7 +2,7 @@ "name": "@ecl/vanilla-utility-typography", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL EC Typography", "style": "typography.scss", "sass": "typography.scss", @@ -10,7 +10,7 @@ "access": "public" }, "dependencies": { - "@ecl/vanilla-layout-grid": "4.7.0" + "@ecl/vanilla-layout-grid": "4.8.0" }, "repository": { "type": "git", diff --git a/src/implementations/vanilla/utilities/z-index/package.json b/src/implementations/vanilla/utilities/z-index/package.json index 03d5365b6c8..f9e0d6258fe 100644 --- a/src/implementations/vanilla/utilities/z-index/package.json +++ b/src/implementations/vanilla/utilities/z-index/package.json @@ -2,7 +2,7 @@ "name": "@ecl/vanilla-utility-z-index", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Utility Z-index", "style": "z-index.scss", "sass": "z-index.scss", diff --git a/src/playground/addons/story-utils/package.json b/src/playground/addons/story-utils/package.json index f648e510c25..30dec962a08 100644 --- a/src/playground/addons/story-utils/package.json +++ b/src/playground/addons/story-utils/package.json @@ -1,15 +1,15 @@ { "name": "@ecl/story-utils", - "version": "4.7.0", + "version": "4.8.0", "description": "Providng helpers for the story creation", "main": "index.js", "private": true, "dependencies": { - "@ecl/builder": "4.7.0", - "@ecl/resources-ec-social-icons": "4.7.0", - "@ecl/resources-flag-icons": "4.7.0", - "@ecl/resources-icons": "4.7.0", - "@ecl/resources-social-media-icons": "4.7.0", + "@ecl/builder": "4.8.0", + "@ecl/resources-ec-social-icons": "4.8.0", + "@ecl/resources-flag-icons": "4.8.0", + "@ecl/resources-icons": "4.8.0", + "@ecl/resources-social-media-icons": "4.8.0", "he": "1.2.0" } } diff --git a/src/playground/addons/storybook-addon-code/package.json b/src/playground/addons/storybook-addon-code/package.json index 749f1f17647..8f4ed939304 100644 --- a/src/playground/addons/storybook-addon-code/package.json +++ b/src/playground/addons/storybook-addon-code/package.json @@ -1,15 +1,15 @@ { "name": "@ecl/storybook-addon-code", - "version": "4.7.0", + "version": "4.8.0", "description": "Preview HTML source code", "main": "index.js", "private": true, "dependencies": { - "@ecl/builder": "4.7.0", - "@storybook/components": "8.3.3", - "@storybook/manager-api": "8.3.3", - "@storybook/preview-api": "8.3.3", - "@storybook/theming": "8.3.3", + "@ecl/builder": "4.8.0", + "@storybook/components": "8.3.5", + "@storybook/manager-api": "8.3.5", + "@storybook/preview-api": "8.3.5", + "@storybook/theming": "8.3.5", "html-entities": "2.5.2", "js-beautify": "1.15.1", "prop-types": "15.8.1", diff --git a/src/playground/addons/storybook-addon-notes/package.json b/src/playground/addons/storybook-addon-notes/package.json index e431b4e97ad..8619223b91e 100644 --- a/src/playground/addons/storybook-addon-notes/package.json +++ b/src/playground/addons/storybook-addon-notes/package.json @@ -1,14 +1,14 @@ { "name": "@ecl/storybook-addon-notes", - "version": "4.7.0", + "version": "4.8.0", "description": "A custom Storybook addon", "main": "index.js", "private": true, "dependencies": { "@emotion/react": "11.13.3", "@emotion/styled": "11.13.0", - "@storybook/manager-api": "8.3.3", - "@storybook/preview-api": "8.3.3", + "@storybook/manager-api": "8.3.5", + "@storybook/preview-api": "8.3.5", "he": "1.2.0", "marked": "10.0.0", "prismjs": "1.29.0", diff --git a/src/playground/addons/storybook-addon-system-switcher/package.json b/src/playground/addons/storybook-addon-system-switcher/package.json index 955f7eda418..d92b8eec155 100644 --- a/src/playground/addons/storybook-addon-system-switcher/package.json +++ b/src/playground/addons/storybook-addon-system-switcher/package.json @@ -1,6 +1,6 @@ { "name": "@ecl/storybook-addon-system-switcher", - "version": "4.7.0", + "version": "4.8.0", "description": "EC/EU System switcher addon for storybook", "private": true, "main": "index.js", @@ -8,10 +8,10 @@ "storybook-addons" ], "dependencies": { - "@ecl/builder": "4.7.0", - "@storybook/components": "8.3.3", - "@storybook/manager-api": "8.3.3", - "@storybook/preview-api": "8.3.3", + "@ecl/builder": "4.8.0", + "@storybook/components": "8.3.5", + "@storybook/manager-api": "8.3.5", + "@storybook/preview-api": "8.3.5", "react": "18.3.1", "react-dom": "18.3.1" } diff --git a/src/playground/ec/.storybook/environment.js b/src/playground/ec/.storybook/environment.js index a1198cd5444..d138b45d862 100644 --- a/src/playground/ec/.storybook/environment.js +++ b/src/playground/ec/.storybook/environment.js @@ -9,6 +9,10 @@ const compositionsAbsPath = path.resolve( __dirname, '../../../implementations/twig/compositions', ); +const pageAbsPath = path.resolve( + __dirname, + '../../../implementations/twig/pages', +); const loader = new TwingLoaderFilesystem(componentAbsPath); @@ -18,6 +22,7 @@ if (typeof loader.addPath === 'function') { // Add namespace. loader.addPath(componentAbsPath, 'ecl'); loader.addPath(compositionsAbsPath, 'ecl'); + loader.addPath(pageAbsPath, 'ecl'); } module.exports = new TwingEnvironment(loader, { autoescape: false }); diff --git a/src/playground/ec/package.json b/src/playground/ec/package.json index 689295ebdc8..7bf7ac592a4 100644 --- a/src/playground/ec/package.json +++ b/src/playground/ec/package.json @@ -3,28 +3,28 @@ "name": "@ecl/twig-ec-storybook", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "Storybook EC Twig", "scripts": { "build": "STORYBOOK_SYSTEM=EC sb build -c .storybook -o build", "start": "STORYBOOK_SYSTEM=EC node start.js" }, "devDependencies": { - "@babel/core": "7.25.2", - "@babel/preset-env": "7.25.4", - "@babel/preset-react": "7.24.7", - "@babel/runtime": "7.25.6", + "@babel/core": "7.25.8", + "@babel/preset-env": "7.25.8", + "@babel/preset-react": "7.25.7", + "@babel/runtime": "7.25.7", "@iframe-resizer/child": "5.3.1", - "@storybook/addon-a11y": "8.3.3", + "@storybook/addon-a11y": "8.3.5", "@storybook/addon-cssresources": "6.2.9", - "@storybook/addon-essentials": "8.3.3", - "@storybook/addon-links": "8.3.3", - "@storybook/builder-webpack5": "8.3.3", - "@storybook/cli": "8.3.3", - "@storybook/html": "8.3.3", - "@storybook/html-webpack5": "8.3.3", + "@storybook/addon-essentials": "8.3.5", + "@storybook/addon-links": "8.3.5", + "@storybook/builder-webpack5": "8.3.5", + "@storybook/cli": "8.3.5", + "@storybook/html": "8.3.5", + "@storybook/html-webpack5": "8.3.5", "babel-loader": "9.2.1", - "browser-update": "3.3.53", + "browser-update": "3.3.54", "buffer": "6.0.3", "core-js": "3.38.1", "react": "18.3.1", diff --git a/src/playground/eu/.storybook/environment.js b/src/playground/eu/.storybook/environment.js index a1198cd5444..d138b45d862 100644 --- a/src/playground/eu/.storybook/environment.js +++ b/src/playground/eu/.storybook/environment.js @@ -9,6 +9,10 @@ const compositionsAbsPath = path.resolve( __dirname, '../../../implementations/twig/compositions', ); +const pageAbsPath = path.resolve( + __dirname, + '../../../implementations/twig/pages', +); const loader = new TwingLoaderFilesystem(componentAbsPath); @@ -18,6 +22,7 @@ if (typeof loader.addPath === 'function') { // Add namespace. loader.addPath(componentAbsPath, 'ecl'); loader.addPath(compositionsAbsPath, 'ecl'); + loader.addPath(pageAbsPath, 'ecl'); } module.exports = new TwingEnvironment(loader, { autoescape: false }); diff --git a/src/playground/eu/package.json b/src/playground/eu/package.json index d57f85d360c..91cf29dfccc 100644 --- a/src/playground/eu/package.json +++ b/src/playground/eu/package.json @@ -3,28 +3,28 @@ "name": "@ecl/twig-eu-storybook", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "Storybook EU Twig", "scripts": { "build": "STORYBOOK_SYSTEM=EU sb build -c .storybook -o build", "start": "STORYBOOK_SYSTEM=EU node start.js" }, "devDependencies": { - "@babel/core": "7.25.2", - "@babel/preset-env": "7.25.4", - "@babel/preset-react": "7.24.7", - "@babel/runtime": "7.25.6", + "@babel/core": "7.25.8", + "@babel/preset-env": "7.25.8", + "@babel/preset-react": "7.25.7", + "@babel/runtime": "7.25.7", "@iframe-resizer/child": "5.3.1", - "@storybook/addon-a11y": "8.3.3", + "@storybook/addon-a11y": "8.3.5", "@storybook/addon-cssresources": "6.2.9", - "@storybook/addon-essentials": "8.3.3", - "@storybook/addon-links": "8.3.3", - "@storybook/builder-webpack5": "8.3.3", - "@storybook/cli": "8.3.3", - "@storybook/html": "8.3.3", - "@storybook/html-webpack5": "8.3.3", + "@storybook/addon-essentials": "8.3.5", + "@storybook/addon-links": "8.3.5", + "@storybook/builder-webpack5": "8.3.5", + "@storybook/cli": "8.3.5", + "@storybook/html": "8.3.5", + "@storybook/html-webpack5": "8.3.5", "babel-loader": "9.2.1", - "browser-update": "3.3.53", + "browser-update": "3.3.54", "buffer": "6.0.3", "core-js": "3.38.1", "react": "18.3.1", diff --git a/src/presets/ec/package.json b/src/presets/ec/package.json index be0fbc167f3..ae7bb341574 100644 --- a/src/presets/ec/package.json +++ b/src/presets/ec/package.json @@ -2,7 +2,7 @@ "name": "@ecl/preset-ec", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL EC preset", "main": "dist/scripts/ecl-ec.js", "style": "dist/styles/ecl-ec.css", @@ -20,89 +20,89 @@ "prepublish": "npm run clean && npm run build && npm run dist" }, "dependencies": { - "@ecl/dom-utils": "4.7.0", - "@ecl/vanilla-component-accordion": "4.7.0", - "@ecl/vanilla-component-banner": "4.7.0", - "@ecl/vanilla-component-blockquote": "4.7.0", - "@ecl/vanilla-component-breadcrumb": "4.7.0", - "@ecl/vanilla-component-button": "4.7.0", - "@ecl/vanilla-component-card": "4.7.0", - "@ecl/vanilla-component-carousel": "4.7.0", - "@ecl/vanilla-component-category-filter": "4.7.0", - "@ecl/vanilla-component-checkbox": "4.7.0", - "@ecl/vanilla-component-content-block": "4.7.0", - "@ecl/vanilla-component-content-item": "4.7.0", - "@ecl/vanilla-component-date-block": "4.7.0", - "@ecl/vanilla-component-datepicker": "4.7.0", - "@ecl/vanilla-component-description-list": "4.7.0", - "@ecl/vanilla-component-expandable": "4.7.0", - "@ecl/vanilla-component-fact-figures": "4.7.0", - "@ecl/vanilla-component-featured-item": "4.7.0", - "@ecl/vanilla-component-file": "4.7.0", - "@ecl/vanilla-component-file-upload": "4.7.0", - "@ecl/vanilla-component-form-group": "4.7.0", - "@ecl/vanilla-component-gallery": "4.7.0", - "@ecl/vanilla-component-icon": "4.7.0", - "@ecl/vanilla-component-inpage-navigation": "4.7.0", - "@ecl/vanilla-component-label": "4.7.0", - "@ecl/vanilla-component-link": "4.7.0", - "@ecl/vanilla-component-list-illustration": "4.7.0", - "@ecl/vanilla-component-media-container": "4.7.0", - "@ecl/vanilla-component-menu": "4.7.0", - "@ecl/vanilla-component-modal": "4.7.0", - "@ecl/vanilla-component-navigation-list": "4.7.0", - "@ecl/vanilla-component-news-ticker": "4.7.0", - "@ecl/vanilla-component-notification": "4.7.0", - "@ecl/vanilla-component-ordered-list": "4.7.0", - "@ecl/vanilla-component-page-header": "4.7.0", - "@ecl/vanilla-component-pagination": "4.7.0", - "@ecl/vanilla-component-popover": "4.7.0", - "@ecl/vanilla-component-radio": "4.7.0", - "@ecl/vanilla-component-range": "4.7.0", - "@ecl/vanilla-component-rating-field": "4.7.0", - "@ecl/vanilla-component-search-form": "4.7.0", - "@ecl/vanilla-component-select": "4.7.0", - "@ecl/vanilla-component-separator": "4.7.0", - "@ecl/vanilla-component-site-footer": "4.7.0", - "@ecl/vanilla-component-site-header": "4.7.0", - "@ecl/vanilla-component-skip-link": "4.7.0", - "@ecl/vanilla-component-social-media-follow": "4.7.0", - "@ecl/vanilla-component-social-media-share": "4.7.0", - "@ecl/vanilla-component-spinner": "4.7.0", - "@ecl/vanilla-component-splash-page": "4.7.0", - "@ecl/vanilla-component-table": "4.7.0", - "@ecl/vanilla-component-tabs": "4.7.0", - "@ecl/vanilla-component-tag": "4.7.0", - "@ecl/vanilla-component-text-area": "4.7.0", - "@ecl/vanilla-component-text-input": "4.7.0", - "@ecl/vanilla-component-timeline": "4.7.0", - "@ecl/vanilla-component-unordered-list": "4.7.0", - "@ecl/vanilla-component-video": "4.7.0", - "@ecl/vanilla-utility-background": "4.7.0", - "@ecl/vanilla-utility-border": "4.7.0", - "@ecl/vanilla-utility-clearfix": "4.7.0", - "@ecl/vanilla-utility-dimension": "4.7.0", - "@ecl/vanilla-utility-disablescroll": "4.7.0", - "@ecl/vanilla-utility-display": "4.7.0", - "@ecl/vanilla-utility-flex": "4.7.0", - "@ecl/vanilla-utility-float": "4.7.0", - "@ecl/vanilla-utility-media": "4.7.0", - "@ecl/vanilla-utility-print": "4.7.0", - "@ecl/vanilla-utility-screen-reader": "4.7.0", - "@ecl/vanilla-utility-shadow": "4.7.0", - "@ecl/vanilla-utility-spacing": "4.7.0", - "@ecl/vanilla-utility-typography": "4.7.0", - "@ecl/vanilla-utility-z-index": "4.7.0" + "@ecl/dom-utils": "4.8.0", + "@ecl/vanilla-component-accordion": "4.8.0", + "@ecl/vanilla-component-banner": "4.8.0", + "@ecl/vanilla-component-blockquote": "4.8.0", + "@ecl/vanilla-component-breadcrumb": "4.8.0", + "@ecl/vanilla-component-button": "4.8.0", + "@ecl/vanilla-component-card": "4.8.0", + "@ecl/vanilla-component-carousel": "4.8.0", + "@ecl/vanilla-component-category-filter": "4.8.0", + "@ecl/vanilla-component-checkbox": "4.8.0", + "@ecl/vanilla-component-content-block": "4.8.0", + "@ecl/vanilla-component-content-item": "4.8.0", + "@ecl/vanilla-component-date-block": "4.8.0", + "@ecl/vanilla-component-datepicker": "4.8.0", + "@ecl/vanilla-component-description-list": "4.8.0", + "@ecl/vanilla-component-expandable": "4.8.0", + "@ecl/vanilla-component-fact-figures": "4.8.0", + "@ecl/vanilla-component-featured-item": "4.8.0", + "@ecl/vanilla-component-file": "4.8.0", + "@ecl/vanilla-component-file-upload": "4.8.0", + "@ecl/vanilla-component-form-group": "4.8.0", + "@ecl/vanilla-component-gallery": "4.8.0", + "@ecl/vanilla-component-icon": "4.8.0", + "@ecl/vanilla-component-inpage-navigation": "4.8.0", + "@ecl/vanilla-component-label": "4.8.0", + "@ecl/vanilla-component-link": "4.8.0", + "@ecl/vanilla-component-list-illustration": "4.8.0", + "@ecl/vanilla-component-media-container": "4.8.0", + "@ecl/vanilla-component-menu": "4.8.0", + "@ecl/vanilla-component-modal": "4.8.0", + "@ecl/vanilla-component-navigation-list": "4.8.0", + "@ecl/vanilla-component-news-ticker": "4.8.0", + "@ecl/vanilla-component-notification": "4.8.0", + "@ecl/vanilla-component-ordered-list": "4.8.0", + "@ecl/vanilla-component-page-header": "4.8.0", + "@ecl/vanilla-component-pagination": "4.8.0", + "@ecl/vanilla-component-popover": "4.8.0", + "@ecl/vanilla-component-radio": "4.8.0", + "@ecl/vanilla-component-range": "4.8.0", + "@ecl/vanilla-component-rating-field": "4.8.0", + "@ecl/vanilla-component-search-form": "4.8.0", + "@ecl/vanilla-component-select": "4.8.0", + "@ecl/vanilla-component-separator": "4.8.0", + "@ecl/vanilla-component-site-footer": "4.8.0", + "@ecl/vanilla-component-site-header": "4.8.0", + "@ecl/vanilla-component-skip-link": "4.8.0", + "@ecl/vanilla-component-social-media-follow": "4.8.0", + "@ecl/vanilla-component-social-media-share": "4.8.0", + "@ecl/vanilla-component-spinner": "4.8.0", + "@ecl/vanilla-component-splash-page": "4.8.0", + "@ecl/vanilla-component-table": "4.8.0", + "@ecl/vanilla-component-tabs": "4.8.0", + "@ecl/vanilla-component-tag": "4.8.0", + "@ecl/vanilla-component-text-area": "4.8.0", + "@ecl/vanilla-component-text-input": "4.8.0", + "@ecl/vanilla-component-timeline": "4.8.0", + "@ecl/vanilla-component-unordered-list": "4.8.0", + "@ecl/vanilla-component-video": "4.8.0", + "@ecl/vanilla-utility-background": "4.8.0", + "@ecl/vanilla-utility-border": "4.8.0", + "@ecl/vanilla-utility-clearfix": "4.8.0", + "@ecl/vanilla-utility-dimension": "4.8.0", + "@ecl/vanilla-utility-disablescroll": "4.8.0", + "@ecl/vanilla-utility-display": "4.8.0", + "@ecl/vanilla-utility-flex": "4.8.0", + "@ecl/vanilla-utility-float": "4.8.0", + "@ecl/vanilla-utility-media": "4.8.0", + "@ecl/vanilla-utility-print": "4.8.0", + "@ecl/vanilla-utility-screen-reader": "4.8.0", + "@ecl/vanilla-utility-shadow": "4.8.0", + "@ecl/vanilla-utility-spacing": "4.8.0", + "@ecl/vanilla-utility-typography": "4.8.0", + "@ecl/vanilla-utility-z-index": "4.8.0" }, "devDependencies": { - "@ecl/builder": "4.7.0", - "@ecl/preset-reset": "4.7.0", - "@ecl/preset-rtl": "4.7.0", - "@ecl/resources-ec-logo": "4.7.0", - "@ecl/resources-flag-icons": "4.7.0", - "@ecl/resources-icons": "4.7.0", - "@ecl/resources-social-media-icons": "4.7.0", - "@ecl/theme-ec": "4.7.0", + "@ecl/builder": "4.8.0", + "@ecl/preset-reset": "4.8.0", + "@ecl/preset-rtl": "4.8.0", + "@ecl/resources-ec-logo": "4.8.0", + "@ecl/resources-flag-icons": "4.8.0", + "@ecl/resources-icons": "4.8.0", + "@ecl/resources-social-media-icons": "4.8.0", + "@ecl/theme-ec": "4.8.0", "cross-env": "7.0.3", "ncp": "2.0.0", "npm-run-all": "4.1.5", diff --git a/src/presets/eu/package.json b/src/presets/eu/package.json index afb9e041521..eac6dcca85d 100644 --- a/src/presets/eu/package.json +++ b/src/presets/eu/package.json @@ -2,7 +2,7 @@ "name": "@ecl/preset-eu", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL EU preset", "main": "dist/scripts/ecl-eu.js", "style": "dist/styles/ecl-eu.css", @@ -20,89 +20,89 @@ "prepublish": "npm run clean && npm run build && npm run dist" }, "dependencies": { - "@ecl/dom-utils": "4.7.0", - "@ecl/vanilla-component-accordion": "4.7.0", - "@ecl/vanilla-component-banner": "4.7.0", - "@ecl/vanilla-component-blockquote": "4.7.0", - "@ecl/vanilla-component-breadcrumb": "4.7.0", - "@ecl/vanilla-component-button": "4.7.0", - "@ecl/vanilla-component-card": "4.7.0", - "@ecl/vanilla-component-carousel": "4.7.0", - "@ecl/vanilla-component-category-filter": "4.7.0", - "@ecl/vanilla-component-checkbox": "4.7.0", - "@ecl/vanilla-component-content-block": "4.7.0", - "@ecl/vanilla-component-content-item": "4.7.0", - "@ecl/vanilla-component-date-block": "4.7.0", - "@ecl/vanilla-component-datepicker": "4.7.0", - "@ecl/vanilla-component-description-list": "4.7.0", - "@ecl/vanilla-component-expandable": "4.7.0", - "@ecl/vanilla-component-fact-figures": "4.7.0", - "@ecl/vanilla-component-featured-item": "4.7.0", - "@ecl/vanilla-component-file": "4.7.0", - "@ecl/vanilla-component-file-upload": "4.7.0", - "@ecl/vanilla-component-form-group": "4.7.0", - "@ecl/vanilla-component-gallery": "4.7.0", - "@ecl/vanilla-component-icon": "4.7.0", - "@ecl/vanilla-component-inpage-navigation": "4.7.0", - "@ecl/vanilla-component-label": "4.7.0", - "@ecl/vanilla-component-link": "4.7.0", - "@ecl/vanilla-component-list-illustration": "4.7.0", - "@ecl/vanilla-component-media-container": "4.7.0", - "@ecl/vanilla-component-menu": "4.7.0", - "@ecl/vanilla-component-modal": "4.7.0", - "@ecl/vanilla-component-navigation-list": "4.7.0", - "@ecl/vanilla-component-news-ticker": "4.7.0", - "@ecl/vanilla-component-notification": "4.7.0", - "@ecl/vanilla-component-ordered-list": "4.7.0", - "@ecl/vanilla-component-page-header": "4.7.0", - "@ecl/vanilla-component-pagination": "4.7.0", - "@ecl/vanilla-component-popover": "4.7.0", - "@ecl/vanilla-component-radio": "4.7.0", - "@ecl/vanilla-component-range": "4.7.0", - "@ecl/vanilla-component-rating-field": "4.7.0", - "@ecl/vanilla-component-search-form": "4.7.0", - "@ecl/vanilla-component-select": "4.7.0", - "@ecl/vanilla-component-separator": "4.7.0", - "@ecl/vanilla-component-site-footer": "4.7.0", - "@ecl/vanilla-component-site-header": "4.7.0", - "@ecl/vanilla-component-skip-link": "4.7.0", - "@ecl/vanilla-component-social-media-follow": "4.7.0", - "@ecl/vanilla-component-social-media-share": "4.7.0", - "@ecl/vanilla-component-spinner": "4.7.0", - "@ecl/vanilla-component-splash-page": "4.7.0", - "@ecl/vanilla-component-table": "4.7.0", - "@ecl/vanilla-component-tabs": "4.7.0", - "@ecl/vanilla-component-tag": "4.7.0", - "@ecl/vanilla-component-text-area": "4.7.0", - "@ecl/vanilla-component-text-input": "4.7.0", - "@ecl/vanilla-component-timeline": "4.7.0", - "@ecl/vanilla-component-unordered-list": "4.7.0", - "@ecl/vanilla-component-video": "4.7.0", - "@ecl/vanilla-utility-background": "4.7.0", - "@ecl/vanilla-utility-border": "4.7.0", - "@ecl/vanilla-utility-clearfix": "4.7.0", - "@ecl/vanilla-utility-dimension": "4.7.0", - "@ecl/vanilla-utility-disablescroll": "4.7.0", - "@ecl/vanilla-utility-display": "4.7.0", - "@ecl/vanilla-utility-flex": "4.7.0", - "@ecl/vanilla-utility-float": "4.7.0", - "@ecl/vanilla-utility-media": "4.7.0", - "@ecl/vanilla-utility-print": "4.7.0", - "@ecl/vanilla-utility-screen-reader": "4.7.0", - "@ecl/vanilla-utility-shadow": "4.7.0", - "@ecl/vanilla-utility-spacing": "4.7.0", - "@ecl/vanilla-utility-typography": "4.7.0", - "@ecl/vanilla-utility-z-index": "4.7.0" + "@ecl/dom-utils": "4.8.0", + "@ecl/vanilla-component-accordion": "4.8.0", + "@ecl/vanilla-component-banner": "4.8.0", + "@ecl/vanilla-component-blockquote": "4.8.0", + "@ecl/vanilla-component-breadcrumb": "4.8.0", + "@ecl/vanilla-component-button": "4.8.0", + "@ecl/vanilla-component-card": "4.8.0", + "@ecl/vanilla-component-carousel": "4.8.0", + "@ecl/vanilla-component-category-filter": "4.8.0", + "@ecl/vanilla-component-checkbox": "4.8.0", + "@ecl/vanilla-component-content-block": "4.8.0", + "@ecl/vanilla-component-content-item": "4.8.0", + "@ecl/vanilla-component-date-block": "4.8.0", + "@ecl/vanilla-component-datepicker": "4.8.0", + "@ecl/vanilla-component-description-list": "4.8.0", + "@ecl/vanilla-component-expandable": "4.8.0", + "@ecl/vanilla-component-fact-figures": "4.8.0", + "@ecl/vanilla-component-featured-item": "4.8.0", + "@ecl/vanilla-component-file": "4.8.0", + "@ecl/vanilla-component-file-upload": "4.8.0", + "@ecl/vanilla-component-form-group": "4.8.0", + "@ecl/vanilla-component-gallery": "4.8.0", + "@ecl/vanilla-component-icon": "4.8.0", + "@ecl/vanilla-component-inpage-navigation": "4.8.0", + "@ecl/vanilla-component-label": "4.8.0", + "@ecl/vanilla-component-link": "4.8.0", + "@ecl/vanilla-component-list-illustration": "4.8.0", + "@ecl/vanilla-component-media-container": "4.8.0", + "@ecl/vanilla-component-menu": "4.8.0", + "@ecl/vanilla-component-modal": "4.8.0", + "@ecl/vanilla-component-navigation-list": "4.8.0", + "@ecl/vanilla-component-news-ticker": "4.8.0", + "@ecl/vanilla-component-notification": "4.8.0", + "@ecl/vanilla-component-ordered-list": "4.8.0", + "@ecl/vanilla-component-page-header": "4.8.0", + "@ecl/vanilla-component-pagination": "4.8.0", + "@ecl/vanilla-component-popover": "4.8.0", + "@ecl/vanilla-component-radio": "4.8.0", + "@ecl/vanilla-component-range": "4.8.0", + "@ecl/vanilla-component-rating-field": "4.8.0", + "@ecl/vanilla-component-search-form": "4.8.0", + "@ecl/vanilla-component-select": "4.8.0", + "@ecl/vanilla-component-separator": "4.8.0", + "@ecl/vanilla-component-site-footer": "4.8.0", + "@ecl/vanilla-component-site-header": "4.8.0", + "@ecl/vanilla-component-skip-link": "4.8.0", + "@ecl/vanilla-component-social-media-follow": "4.8.0", + "@ecl/vanilla-component-social-media-share": "4.8.0", + "@ecl/vanilla-component-spinner": "4.8.0", + "@ecl/vanilla-component-splash-page": "4.8.0", + "@ecl/vanilla-component-table": "4.8.0", + "@ecl/vanilla-component-tabs": "4.8.0", + "@ecl/vanilla-component-tag": "4.8.0", + "@ecl/vanilla-component-text-area": "4.8.0", + "@ecl/vanilla-component-text-input": "4.8.0", + "@ecl/vanilla-component-timeline": "4.8.0", + "@ecl/vanilla-component-unordered-list": "4.8.0", + "@ecl/vanilla-component-video": "4.8.0", + "@ecl/vanilla-utility-background": "4.8.0", + "@ecl/vanilla-utility-border": "4.8.0", + "@ecl/vanilla-utility-clearfix": "4.8.0", + "@ecl/vanilla-utility-dimension": "4.8.0", + "@ecl/vanilla-utility-disablescroll": "4.8.0", + "@ecl/vanilla-utility-display": "4.8.0", + "@ecl/vanilla-utility-flex": "4.8.0", + "@ecl/vanilla-utility-float": "4.8.0", + "@ecl/vanilla-utility-media": "4.8.0", + "@ecl/vanilla-utility-print": "4.8.0", + "@ecl/vanilla-utility-screen-reader": "4.8.0", + "@ecl/vanilla-utility-shadow": "4.8.0", + "@ecl/vanilla-utility-spacing": "4.8.0", + "@ecl/vanilla-utility-typography": "4.8.0", + "@ecl/vanilla-utility-z-index": "4.8.0" }, "devDependencies": { - "@ecl/builder": "4.7.0", - "@ecl/preset-reset": "4.7.0", - "@ecl/preset-rtl": "4.7.0", - "@ecl/resources-eu-logo": "4.7.0", - "@ecl/resources-flag-icons": "4.7.0", - "@ecl/resources-icons": "4.7.0", - "@ecl/resources-social-media-icons": "4.7.0", - "@ecl/theme-eu": "4.7.0", + "@ecl/builder": "4.8.0", + "@ecl/preset-reset": "4.8.0", + "@ecl/preset-rtl": "4.8.0", + "@ecl/resources-eu-logo": "4.8.0", + "@ecl/resources-flag-icons": "4.8.0", + "@ecl/resources-icons": "4.8.0", + "@ecl/resources-social-media-icons": "4.8.0", + "@ecl/theme-eu": "4.8.0", "cross-env": "7.0.3", "npm-run-all": "4.1.5", "rimraf": "6.0.1" diff --git a/src/presets/reset/package.json b/src/presets/reset/package.json index 687c1b882de..fe705e5f124 100644 --- a/src/presets/reset/package.json +++ b/src/presets/reset/package.json @@ -2,7 +2,7 @@ "name": "@ecl/preset-reset", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Reset preset", "style": "dist/styles/ecl-reset.css", "publishConfig": { @@ -18,7 +18,7 @@ "prepublish": "npm run clean && npm run build && npm run dist" }, "devDependencies": { - "@ecl/builder": "4.7.0", + "@ecl/builder": "4.8.0", "cross-env": "7.0.3", "normalize.css": "8.0.1", "npm-run-all": "4.1.5", diff --git a/src/presets/rtl/package.json b/src/presets/rtl/package.json index d54f8475723..1ca40cd9361 100644 --- a/src/presets/rtl/package.json +++ b/src/presets/rtl/package.json @@ -2,7 +2,7 @@ "name": "@ecl/preset-rtl", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL RTL preset", "style": "dist/styles/ecl-rtl.css", "publishConfig": { @@ -16,8 +16,8 @@ "prepublish": "npm run clean && npm run build && npm run dist" }, "devDependencies": { - "@ecl/builder": "4.7.0", - "@ecl/theme-ec": "4.7.0", + "@ecl/builder": "4.8.0", + "@ecl/theme-ec": "4.8.0", "cross-env": "7.0.3", "npm-run-all": "4.1.5", "rimraf": "6.0.1" diff --git a/src/resources/favicons-ec/package.json b/src/resources/favicons-ec/package.json index 9f51935de6e..2bc81c67da7 100644 --- a/src/resources/favicons-ec/package.json +++ b/src/resources/favicons-ec/package.json @@ -2,7 +2,7 @@ "name": "@ecl/resources-ec-favicons", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "(Deprecated) Favicons for EC system of ECL", "publishConfig": { "access": "public" diff --git a/src/resources/favicons/package.json b/src/resources/favicons/package.json index 37acb88586e..e67a426acbf 100644 --- a/src/resources/favicons/package.json +++ b/src/resources/favicons/package.json @@ -2,7 +2,7 @@ "name": "@ecl/resources-favicons", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "Favicons for ECL", "publishConfig": { "access": "public" diff --git a/src/resources/icons-flag/package.json b/src/resources/icons-flag/package.json index 33f4e133a81..4486548530c 100644 --- a/src/resources/icons-flag/package.json +++ b/src/resources/icons-flag/package.json @@ -2,7 +2,7 @@ "name": "@ecl/resources-flag-icons", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "Flag icons of European countries", "scripts": { "clean": "rimraf build dist", diff --git a/src/resources/icons-social-media/package.json b/src/resources/icons-social-media/package.json index e18af2c318f..f05aa7ece59 100644 --- a/src/resources/icons-social-media/package.json +++ b/src/resources/icons-social-media/package.json @@ -2,7 +2,7 @@ "name": "@ecl/resources-social-media-icons", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "Social media icons of European countries", "scripts": { "clean": "rimraf build dist", diff --git a/src/resources/icons/package.json b/src/resources/icons/package.json index 563f6597a2b..b608b786c51 100644 --- a/src/resources/icons/package.json +++ b/src/resources/icons/package.json @@ -2,7 +2,7 @@ "name": "@ecl/resources-icons", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL icons", "scripts": { "clean": "rimraf build dist", diff --git a/src/resources/logo-ec/package.json b/src/resources/logo-ec/package.json index ea6dc712c33..db1cdd2930c 100644 --- a/src/resources/logo-ec/package.json +++ b/src/resources/logo-ec/package.json @@ -2,7 +2,7 @@ "name": "@ecl/resources-ec-logo", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "Logo for EC system of ECL", "publishConfig": { "access": "public" diff --git a/src/resources/logo-eu/package.json b/src/resources/logo-eu/package.json index 98ee7d0aa81..22bd80d1eac 100644 --- a/src/resources/logo-eu/package.json +++ b/src/resources/logo-eu/package.json @@ -2,7 +2,7 @@ "name": "@ecl/resources-eu-logo", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "Logo for EU system of ECL", "publishConfig": { "access": "public" diff --git a/src/resources/social-icons/package.json b/src/resources/social-icons/package.json index 3e8ea1caa44..68269d56254 100644 --- a/src/resources/social-icons/package.json +++ b/src/resources/social-icons/package.json @@ -2,7 +2,7 @@ "name": "@ecl/resources-ec-social-icons", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "Icons for EC system of ECL", "scripts": { "clean": "rimraf build dist", diff --git a/src/specs/components/accordion/package.json b/src/specs/components/accordion/package.json index 6917b5f9f2c..a9362aad93d 100644 --- a/src/specs/components/accordion/package.json +++ b/src/specs/components/accordion/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-accordion", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Accordion Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/banner/package.json b/src/specs/components/banner/package.json index 1317d112cf4..a64ac462791 100644 --- a/src/specs/components/banner/package.json +++ b/src/specs/components/banner/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-banner", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Banner Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/blockquote/package.json b/src/specs/components/blockquote/package.json index fcdb727e5ff..0d10072bd72 100644 --- a/src/specs/components/blockquote/package.json +++ b/src/specs/components/blockquote/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-blockquote", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Blockquote Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/breadcrumb/package.json b/src/specs/components/breadcrumb/package.json index b3f5cee378b..55820461a4b 100644 --- a/src/specs/components/breadcrumb/package.json +++ b/src/specs/components/breadcrumb/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-breadcrumb", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Breadcrumb", "publishConfig": { "access": "public" diff --git a/src/specs/components/button/package.json b/src/specs/components/button/package.json index b0f4640f150..1711ad48a67 100644 --- a/src/specs/components/button/package.json +++ b/src/specs/components/button/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-button", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Button Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/card/package.json b/src/specs/components/card/package.json index ec86b65cd11..f09f9b04b91 100644 --- a/src/specs/components/card/package.json +++ b/src/specs/components/card/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-card", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Card Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/carousel/package.json b/src/specs/components/carousel/package.json index b31effe5a04..f37cde54c5a 100644 --- a/src/specs/components/carousel/package.json +++ b/src/specs/components/carousel/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-carousel", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Carousel Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/category-fiter/package.json b/src/specs/components/category-fiter/package.json index c4d534831c7..b1d6ff52760 100644 --- a/src/specs/components/category-fiter/package.json +++ b/src/specs/components/category-fiter/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-category-filter", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Category filter Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/checkbox/package.json b/src/specs/components/checkbox/package.json index bbb9c6266a7..55b1fdc49ff 100644 --- a/src/specs/components/checkbox/package.json +++ b/src/specs/components/checkbox/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-checkbox", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Checkbox Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/content-block/package.json b/src/specs/components/content-block/package.json index 50bbedc5ec0..937eaaea579 100644 --- a/src/specs/components/content-block/package.json +++ b/src/specs/components/content-block/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-content-block", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Content block Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/content-item/package.json b/src/specs/components/content-item/package.json index 492448c7422..f88e4c4e530 100644 --- a/src/specs/components/content-item/package.json +++ b/src/specs/components/content-item/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-content-item", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Content item Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/date-block/package.json b/src/specs/components/date-block/package.json index 12866570c61..138063493e8 100644 --- a/src/specs/components/date-block/package.json +++ b/src/specs/components/date-block/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-date-block", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Date Block Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/datepicker/package.json b/src/specs/components/datepicker/package.json index 3f370acb00d..bf718368b69 100644 --- a/src/specs/components/datepicker/package.json +++ b/src/specs/components/datepicker/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-datepicker", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Datepicker", "publishConfig": { "access": "public" diff --git a/src/specs/components/description-list/package.json b/src/specs/components/description-list/package.json index d771a919eb0..cb703f87c9d 100644 --- a/src/specs/components/description-list/package.json +++ b/src/specs/components/description-list/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-description-list", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Description List Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/expandable/package.json b/src/specs/components/expandable/package.json index 84586480678..99cfb8d44c0 100644 --- a/src/specs/components/expandable/package.json +++ b/src/specs/components/expandable/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-expandable", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Expandable Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/fact-figures/package.json b/src/specs/components/fact-figures/package.json index 67b0cdf47d3..ece6b78a162 100644 --- a/src/specs/components/fact-figures/package.json +++ b/src/specs/components/fact-figures/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-fact-figures", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Fact and Figures Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/featured-item/package.json b/src/specs/components/featured-item/package.json index 8f681dceec9..fb047b96860 100644 --- a/src/specs/components/featured-item/package.json +++ b/src/specs/components/featured-item/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-featured-item", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Featured item Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/file-upload/package.json b/src/specs/components/file-upload/package.json index 38c817b0fe0..72380b381b1 100644 --- a/src/specs/components/file-upload/package.json +++ b/src/specs/components/file-upload/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-file-upload", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL File upload Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/file/package.json b/src/specs/components/file/package.json index 6b178983f8c..56cd70aa3be 100644 --- a/src/specs/components/file/package.json +++ b/src/specs/components/file/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-file", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL File Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/gallery/package.json b/src/specs/components/gallery/package.json index ba32069fad7..d72d7f4f1cd 100644 --- a/src/specs/components/gallery/package.json +++ b/src/specs/components/gallery/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-gallery", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Gallery Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/icon/package.json b/src/specs/components/icon/package.json index 273a494809e..bb20111b16e 100644 --- a/src/specs/components/icon/package.json +++ b/src/specs/components/icon/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-icon", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Icon Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/inpage-navigation/package.json b/src/specs/components/inpage-navigation/package.json index db1b68d305a..d7bf658a22e 100644 --- a/src/specs/components/inpage-navigation/package.json +++ b/src/specs/components/inpage-navigation/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-inpage-navigation", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Inpage Navigation Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/label/package.json b/src/specs/components/label/package.json index e315ccbebc5..36ce38a41e4 100644 --- a/src/specs/components/label/package.json +++ b/src/specs/components/label/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-label", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Label Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/link/package.json b/src/specs/components/link/package.json index 373b65bca42..10aa8f791f1 100644 --- a/src/specs/components/link/package.json +++ b/src/specs/components/link/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-link", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Link Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/list-illustration/package.json b/src/specs/components/list-illustration/package.json index af21194ab77..2efc64e6f0c 100644 --- a/src/specs/components/list-illustration/package.json +++ b/src/specs/components/list-illustration/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-list-illustration", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL List with illustration Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/media-container/package.json b/src/specs/components/media-container/package.json index 75d4641ea87..cceee65920e 100644 --- a/src/specs/components/media-container/package.json +++ b/src/specs/components/media-container/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-media-container", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Media Container Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/mega-menu/demo/data.js b/src/specs/components/mega-menu/demo/data.js index 6e5c9772d01..9d55a3dc6f0 100644 --- a/src/specs/components/mega-menu/demo/data.js +++ b/src/specs/components/mega-menu/demo/data.js @@ -167,7 +167,10 @@ module.exports = { { label: 'Engage', path: exampleLink, - container: `
`, + container: `
+

Minimal demo content for the container option

+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer placerat magna quis ultricies hendrerit. Suspendisse fermentum elit id hendrerit suscipit.

+
`, }, { label: 'Contact', diff --git a/src/specs/components/mega-menu/package.json b/src/specs/components/mega-menu/package.json index 2219624ae83..dba0ad29ac5 100644 --- a/src/specs/components/mega-menu/package.json +++ b/src/specs/components/mega-menu/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-mega-menu", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Mega Menu Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/menu/package.json b/src/specs/components/menu/package.json index ef20c5b354c..902542dc13d 100644 --- a/src/specs/components/menu/package.json +++ b/src/specs/components/menu/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-menu", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Menu Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/modal/package.json b/src/specs/components/modal/package.json index b3cc344126c..576a37a9a3f 100644 --- a/src/specs/components/modal/package.json +++ b/src/specs/components/modal/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-modal", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Modal Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/navigation-list/package.json b/src/specs/components/navigation-list/package.json index e29977164f8..06a5d7efdd8 100644 --- a/src/specs/components/navigation-list/package.json +++ b/src/specs/components/navigation-list/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-navigation-list", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Navigation List Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/news-ticker/package.json b/src/specs/components/news-ticker/package.json index bbb84faf799..6964ac118ce 100644 --- a/src/specs/components/news-ticker/package.json +++ b/src/specs/components/news-ticker/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-news-ticker", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL News ticker Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/notification/demo/data--error-eu.js b/src/specs/components/notification/demo/data--error-eu.js index 258d4301f83..57adcd8fcd8 100644 --- a/src/specs/components/notification/demo/data--error-eu.js +++ b/src/specs/components/notification/demo/data--error-eu.js @@ -4,7 +4,7 @@ module.exports = { icon: { path: '/icons.svg', name: 'error', - size: 'm', + size: 'l', }, sr_icon: 'Error', title: 'Error notification', diff --git a/src/specs/components/notification/demo/data--info-ec.js b/src/specs/components/notification/demo/data--info-ec.js index 237e8c82822..59f4972012e 100644 --- a/src/specs/components/notification/demo/data--info-ec.js +++ b/src/specs/components/notification/demo/data--info-ec.js @@ -6,6 +6,20 @@ module.exports = { name: 'information', size: 'l', }, + links: [ + { + link: { + label: 'Lorem ipsum', + path: '/example', + }, + }, + { + link: { + label: 'Nullam accumsan semper lorem', + path: '/example', + }, + }, + ], sr_icon: 'Information', title: 'Information notification', description: diff --git a/src/specs/components/notification/demo/data--info-eu.js b/src/specs/components/notification/demo/data--info-eu.js index c974371172b..59f4972012e 100644 --- a/src/specs/components/notification/demo/data--info-eu.js +++ b/src/specs/components/notification/demo/data--info-eu.js @@ -4,8 +4,22 @@ module.exports = { icon: { path: '/icons.svg', name: 'information', - size: 'm', + size: 'l', }, + links: [ + { + link: { + label: 'Lorem ipsum', + path: '/example', + }, + }, + { + link: { + label: 'Nullam accumsan semper lorem', + path: '/example', + }, + }, + ], sr_icon: 'Information', title: 'Information notification', description: diff --git a/src/specs/components/notification/demo/data--success-eu.js b/src/specs/components/notification/demo/data--success-eu.js index 66c9bd9ff84..c05cb4fed81 100644 --- a/src/specs/components/notification/demo/data--success-eu.js +++ b/src/specs/components/notification/demo/data--success-eu.js @@ -4,7 +4,7 @@ module.exports = { icon: { path: '/icons.svg', name: 'check-filled', - size: 'm', + size: 'l', }, sr_icon: 'Success', title: 'Success notification', diff --git a/src/specs/components/notification/demo/data--warning-eu.js b/src/specs/components/notification/demo/data--warning-eu.js index 4e134ae270b..2e9781947e9 100644 --- a/src/specs/components/notification/demo/data--warning-eu.js +++ b/src/specs/components/notification/demo/data--warning-eu.js @@ -4,7 +4,7 @@ module.exports = { icon: { path: '/icons.svg', name: 'warning', - size: 'm', + size: 'l', }, sr_icon: 'Warning', title: 'Warning notification', diff --git a/src/specs/components/notification/package.json b/src/specs/components/notification/package.json index dfac21bee70..485ee11423c 100644 --- a/src/specs/components/notification/package.json +++ b/src/specs/components/notification/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-notification", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Notification Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/ordered-list/package.json b/src/specs/components/ordered-list/package.json index 4cbeb60e057..15259158306 100644 --- a/src/specs/components/ordered-list/package.json +++ b/src/specs/components/ordered-list/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-ordered-list", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Ordered List Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/page-header/package.json b/src/specs/components/page-header/package.json index 4abe3b3fe54..c21f96ae17c 100644 --- a/src/specs/components/page-header/package.json +++ b/src/specs/components/page-header/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-page-header", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Page Header Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/pagination/package.json b/src/specs/components/pagination/package.json index 2bbe32714c5..2fd6a3db3c8 100644 --- a/src/specs/components/pagination/package.json +++ b/src/specs/components/pagination/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-pagination", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Pagination Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/picture/package.json b/src/specs/components/picture/package.json index 9039ae6d78e..fcdf539e5f2 100644 --- a/src/specs/components/picture/package.json +++ b/src/specs/components/picture/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-picture", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Picture Specs", "private": true, "repository": { diff --git a/src/specs/components/popover/package.json b/src/specs/components/popover/package.json index 1f77791cccd..5a9fdf8974c 100644 --- a/src/specs/components/popover/package.json +++ b/src/specs/components/popover/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-popover", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Popover Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/radio/package.json b/src/specs/components/radio/package.json index ebe1434df50..914fd4c12f5 100644 --- a/src/specs/components/radio/package.json +++ b/src/specs/components/radio/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-radio", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Radio Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/range/package.json b/src/specs/components/range/package.json index 0d811561fea..522ca2ca5ab 100644 --- a/src/specs/components/range/package.json +++ b/src/specs/components/range/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-range", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Range Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/rating-field/package.json b/src/specs/components/rating-field/package.json index 83c29c09f6b..d998b9d329c 100644 --- a/src/specs/components/rating-field/package.json +++ b/src/specs/components/rating-field/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-rating-field", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Rating field Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/search-form/package.json b/src/specs/components/search-form/package.json index 2be80f76132..bbde19a35f4 100644 --- a/src/specs/components/search-form/package.json +++ b/src/specs/components/search-form/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-search-form", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Search Form Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/select/package.json b/src/specs/components/select/package.json index d40e9e180db..60d6310ac46 100644 --- a/src/specs/components/select/package.json +++ b/src/specs/components/select/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-select", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Select Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/site-footer/package.json b/src/specs/components/site-footer/package.json index a632c16359f..c38725d416b 100644 --- a/src/specs/components/site-footer/package.json +++ b/src/specs/components/site-footer/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-site-footer", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Site Footer Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/site-header/demo/data--ec.js b/src/specs/components/site-header/demo/data--ec.js index 88509f569fc..5f2a8735067 100644 --- a/src/specs/components/site-header/demo/data--ec.js +++ b/src/specs/components/site-header/demo/data--ec.js @@ -264,8 +264,30 @@ module.exports = { name: 'information', size: 'l', }, - title: 'Information notification', + close: { + label: 'Close', + icon: { + path: '/icons.svg', + name: 'close', + size: 'm', + }, + hide_label: true, + }, + links: [ + { + link: { + label: 'Lorem ipsum', + path: '/example', + }, + }, + { + link: { + label: 'Nullam accumsan semper lorem', + path: '/example', + }, + }, + ], description: - 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam accumsan semper lorem, ac mollis lacus tincidunt eu. Duis scelerisque diam eu tempus fringilla.', + 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam accumsan semper lorem.', }, }; diff --git a/src/specs/components/site-header/demo/data--eu.js b/src/specs/components/site-header/demo/data--eu.js index 6ce3e8b9eee..d6ad522b6e9 100644 --- a/src/specs/components/site-header/demo/data--eu.js +++ b/src/specs/components/site-header/demo/data--eu.js @@ -263,9 +263,31 @@ module.exports = { name: 'information', size: 'l', }, - title: 'Information notification', + close: { + label: 'Close', + icon: { + path: '/icons.svg', + name: 'close', + size: 'm', + }, + hide_label: true, + }, + links: [ + { + link: { + label: 'Lorem ipsum', + path: '/example', + }, + }, + { + link: { + label: 'Nullam accumsan semper lorem', + path: '/example', + }, + }, + ], description: - 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam accumsan semper lorem, ac mollis lacus tincidunt eu. Duis scelerisque diam eu tempus fringilla.', + 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam accumsan semper lorem.', }, icon_path: '/icons.svg', }; diff --git a/src/specs/components/site-header/package.json b/src/specs/components/site-header/package.json index b9e4f9b99d2..a6815a3f996 100644 --- a/src/specs/components/site-header/package.json +++ b/src/specs/components/site-header/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-site-header", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Site Header Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/skip-link/package.json b/src/specs/components/skip-link/package.json index cbd1c9a5735..58438dbe92c 100644 --- a/src/specs/components/skip-link/package.json +++ b/src/specs/components/skip-link/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-skip-link", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Skip link Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/social-media-follow/package.json b/src/specs/components/social-media-follow/package.json index 03415f5669d..f4f58a567e0 100644 --- a/src/specs/components/social-media-follow/package.json +++ b/src/specs/components/social-media-follow/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-social-media-follow", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Social Media Follow Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/social-media-share/package.json b/src/specs/components/social-media-share/package.json index a73de94afab..b12c8bdc58f 100644 --- a/src/specs/components/social-media-share/package.json +++ b/src/specs/components/social-media-share/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-social-media-share", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Social Media Share Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/spinner/package.json b/src/specs/components/spinner/package.json index 0cf96416c41..43842795ed0 100644 --- a/src/specs/components/spinner/package.json +++ b/src/specs/components/spinner/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-spinner", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Spinner Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/splash-page/package.json b/src/specs/components/splash-page/package.json index ab2180c95ae..6c8af3dead6 100644 --- a/src/specs/components/splash-page/package.json +++ b/src/specs/components/splash-page/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-splash-page", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Splash Page Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/table/package.json b/src/specs/components/table/package.json index 82542a405b8..297b367e028 100644 --- a/src/specs/components/table/package.json +++ b/src/specs/components/table/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-table", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Table Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/tabs/package.json b/src/specs/components/tabs/package.json index 68d6e3ff15f..0b0191ee813 100644 --- a/src/specs/components/tabs/package.json +++ b/src/specs/components/tabs/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-tabs", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Tabs Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/tag/package.json b/src/specs/components/tag/package.json index 5584ace74d6..8f75e3819b9 100644 --- a/src/specs/components/tag/package.json +++ b/src/specs/components/tag/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-tag", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Tag Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/text-area/package.json b/src/specs/components/text-area/package.json index a992bcfe490..77886e08b0a 100644 --- a/src/specs/components/text-area/package.json +++ b/src/specs/components/text-area/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-text-area", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Text Area Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/text-input/package.json b/src/specs/components/text-input/package.json index 97ac1c5aa05..da8b5b1a69e 100644 --- a/src/specs/components/text-input/package.json +++ b/src/specs/components/text-input/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-text-input", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Text Input Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/timeline/package.json b/src/specs/components/timeline/package.json index 6af8484fde9..2b1f2068330 100644 --- a/src/specs/components/timeline/package.json +++ b/src/specs/components/timeline/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-timeline", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Timeline Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/unordered-list/package.json b/src/specs/components/unordered-list/package.json index ab09e92d3e0..d66f214a51a 100644 --- a/src/specs/components/unordered-list/package.json +++ b/src/specs/components/unordered-list/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-unordered-list", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Unordered List Specs", "publishConfig": { "access": "public" diff --git a/src/specs/components/video/package.json b/src/specs/components/video/package.json index c7cbf7149d7..83ef06aa96d 100644 --- a/src/specs/components/video/package.json +++ b/src/specs/components/video/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-component-video", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Video Specs", "private": true, "repository": { diff --git a/src/specs/compositions/etrans/package.json b/src/specs/compositions/etrans/package.json index aa279abcc39..bdb58b0e02c 100644 --- a/src/specs/compositions/etrans/package.json +++ b/src/specs/compositions/etrans/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-composition-etrans", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL eTranslation Specs", "publishConfig": { "access": "public" diff --git a/src/specs/pages/page-home/demo/data.js b/src/specs/pages/page-home/demo/data.js new file mode 100644 index 00000000000..825f7e9f02e --- /dev/null +++ b/src/specs/pages/page-home/demo/data.js @@ -0,0 +1,61 @@ +import getSystem from '@ecl/builder/utils/getSystem'; + +import dataSiteHeaderEC from '@ecl/specs-component-site-header/demo/data--ec'; +import dataSiteFooterEC from '@ecl/specs-component-site-footer/demo/data-harmonised--ec'; +import dataSiteHeaderEU from '@ecl/specs-component-site-header/demo/data--eu'; +import dataSiteFooterEU from '@ecl/specs-component-site-footer/demo/data-harmonised--eu'; +import dataMegaMenu from '@ecl/specs-component-mega-menu/demo/data'; +import dataBannerVideo from '@ecl/specs-component-banner/demo/data--video'; +import dataCard from '@ecl/specs-component-card/demo/data'; +import dataContentItem from '@ecl/specs-component-content-item/demo/data--event'; +import dataFeaturedItem from '@ecl/specs-component-featured-item/demo/data--highlight'; +import dataNavigationList from '@ecl/specs-component-navigation-list/demo/data-illustration'; + +dataSiteHeaderEC.mega_menu = dataMegaMenu; +delete dataSiteHeaderEC.cta_link; +delete dataSiteHeaderEC.banner_top; +delete dataSiteHeaderEC.notification; +delete dataSiteHeaderEC.site_name; + +dataSiteHeaderEU.mega_menu = dataMegaMenu; +delete dataSiteHeaderEU.cta_link; +delete dataSiteHeaderEU.banner_top; +delete dataSiteHeaderEU.notification; +delete dataSiteHeaderEU.site_name; + +dataBannerVideo.description = dataBannerVideo.description.link.label; +dataBannerVideo.full_width = true; +delete dataBannerVideo.link; + +delete dataCard.description; +delete dataCard.primary_meta; +delete dataCard.labels; +delete dataCard.labels_aria; +delete dataCard.secondary_meta; +delete dataCard.lists; + +delete dataContentItem.labels; +delete dataContentItem.labels_aria; +delete dataContentItem.lists; + +delete dataFeaturedItem.footer_description; +delete dataFeaturedItem.footer_link; +delete dataFeaturedItem.footer_picture; + +dataNavigationList.column = 3; +dataNavigationList.items.push(...dataNavigationList.items); + +const system = getSystem(); + +const data = { + icon_path: '/icons.svg', + site_header: system === 'eu' ? dataSiteHeaderEU : dataSiteHeaderEC, + site_footer: system === 'eu' ? dataSiteFooterEU : dataSiteFooterEC, + banner: dataBannerVideo, + card: dataCard, + content_item: dataContentItem, + featured_item: dataFeaturedItem, + navigation_list: dataNavigationList, +}; + +export default data; diff --git a/src/specs/pages/page-home/package.json b/src/specs/pages/page-home/package.json new file mode 100644 index 00000000000..5fa6ba543ac --- /dev/null +++ b/src/specs/pages/page-home/package.json @@ -0,0 +1,33 @@ +{ + "name": "@ecl/specs-page-home", + "author": "European Commission", + "license": "EUPL-1.2", + "version": "4.8.0", + "description": "ECL Example page - Home Specs", + "publishConfig": { + "access": "restricted" + }, + "dependencies": { + "@ecl/specs-component-banner": "4.8.0", + "@ecl/specs-component-card": "4.8.0", + "@ecl/specs-component-content-item": "4.8.0", + "@ecl/specs-component-featured-item": "4.8.0", + "@ecl/specs-component-mega-menu": "4.8.0", + "@ecl/specs-component-navigation-list": "4.8.0", + "@ecl/specs-component-site-footer": "4.8.0", + "@ecl/specs-component-site-header": "4.8.0" + }, + "repository": { + "type": "git", + "url": "git+https://github.com/ec-europa/europa-component-library.git" + }, + "bugs": { + "url": "https://github.com/ec-europa/europa-component-library/issues" + }, + "homepage": "https://github.com/ec-europa/europa-component-library", + "keywords": [ + "ecl", + "europa-component-library", + "design-system" + ] +} diff --git a/src/specs/pages/page-inner/demo/data.js b/src/specs/pages/page-inner/demo/data.js new file mode 100644 index 00000000000..626e8cf8839 --- /dev/null +++ b/src/specs/pages/page-inner/demo/data.js @@ -0,0 +1,53 @@ +import getSystem from '@ecl/builder/utils/getSystem'; + +import dataSiteHeaderEC from '@ecl/specs-component-site-header/demo/data--ec'; +import dataSiteFooterEC from '@ecl/specs-component-site-footer/demo/data-harmonised--ec'; +import dataSiteHeaderEU from '@ecl/specs-component-site-header/demo/data--eu'; +import dataSiteFooterEU from '@ecl/specs-component-site-footer/demo/data-harmonised--eu'; +import dataMegaMenu from '@ecl/specs-component-mega-menu/demo/data'; +import dataBreadcrumb from '@ecl/specs-component-breadcrumb/demo/data--long'; +import dataPageHeader from '@ecl/specs-component-page-header/demo/data'; +import dataInpageNavigation from '@ecl/specs-component-inpage-navigation/demo/data'; +import dataAccordion from '@ecl/specs-component-accordion/demo/data'; +import dataUnorderedList from '@ecl/specs-component-unordered-list/demo/data--text'; +import dataFile from '@ecl/specs-component-file/demo/data--with-translation'; +import dataGallery from '@ecl/specs-component-gallery/demo/data'; + +dataSiteHeaderEC.mega_menu = dataMegaMenu; +delete dataSiteHeaderEC.cta_link; +delete dataSiteHeaderEC.banner_top; +delete dataSiteHeaderEC.notification; +delete dataSiteHeaderEC.site_name; + +dataSiteHeaderEU.mega_menu = dataMegaMenu; +delete dataSiteHeaderEU.cta_link; +delete dataSiteHeaderEU.banner_top; +delete dataSiteHeaderEU.notification; +delete dataSiteHeaderEU.site_name; + +dataPageHeader.breadcrumb = dataBreadcrumb; +delete dataPageHeader.picture_background; + +dataInpageNavigation.links[0].label = 'Donec nec ex condimentum'; +dataInpageNavigation.links[1].label = 'Curabitur faucibus ex eu'; +dataInpageNavigation.links[2].label = + 'Maecenas ultrices mi rutrum urna volutpat'; +dataInpageNavigation.links[3].label = 'Nullam'; + +dataFile.id = 'file-id'; + +const system = getSystem(); + +const data = { + icon_path: '/icons.svg', + site_header: system === 'eu' ? dataSiteHeaderEU : dataSiteHeaderEC, + site_footer: system === 'eu' ? dataSiteFooterEU : dataSiteFooterEC, + page_header: dataPageHeader, + inpage_navigation: dataInpageNavigation, + accordion: dataAccordion, + unordered_list: dataUnorderedList, + file: dataFile, + gallery: dataGallery, +}; + +export default data; diff --git a/src/specs/pages/page-inner/package.json b/src/specs/pages/page-inner/package.json new file mode 100644 index 00000000000..64521a5e9df --- /dev/null +++ b/src/specs/pages/page-inner/package.json @@ -0,0 +1,35 @@ +{ + "name": "@ecl/specs-page-inner", + "author": "European Commission", + "license": "EUPL-1.2", + "version": "4.8.0", + "description": "ECL Example page - Inner Specs", + "publishConfig": { + "access": "restricted" + }, + "dependencies": { + "@ecl/specs-component-accordion": "4.8.0", + "@ecl/specs-component-breadcrumb": "4.8.0", + "@ecl/specs-component-file": "4.8.0", + "@ecl/specs-component-gallery": "4.8.0", + "@ecl/specs-component-inpage-navigation": "4.8.0", + "@ecl/specs-component-mega-menu": "4.8.0", + "@ecl/specs-component-page-header": "4.8.0", + "@ecl/specs-component-site-footer": "4.8.0", + "@ecl/specs-component-site-header": "4.8.0", + "@ecl/specs-component-unordered-list": "4.8.0" + }, + "repository": { + "type": "git", + "url": "git+https://github.com/ec-europa/europa-component-library.git" + }, + "bugs": { + "url": "https://github.com/ec-europa/europa-component-library/issues" + }, + "homepage": "https://github.com/ec-europa/europa-component-library", + "keywords": [ + "ecl", + "europa-component-library", + "design-system" + ] +} diff --git a/src/specs/pages/page-search/demo/data.js b/src/specs/pages/page-search/demo/data.js new file mode 100644 index 00000000000..aeddeed2b71 --- /dev/null +++ b/src/specs/pages/page-search/demo/data.js @@ -0,0 +1,70 @@ +import getSystem from '@ecl/builder/utils/getSystem'; + +import dataSiteHeaderEC from '@ecl/specs-component-site-header/demo/data--ec'; +import dataSiteFooterEC from '@ecl/specs-component-site-footer/demo/data-harmonised--ec'; +import dataSiteHeaderEU from '@ecl/specs-component-site-header/demo/data--eu'; +import dataSiteFooterEU from '@ecl/specs-component-site-footer/demo/data-harmonised--eu'; +import dataMegaMenu from '@ecl/specs-component-mega-menu/demo/data'; +import dataBreadcrumb from '@ecl/specs-component-breadcrumb/demo/data--long'; +import dataPageHeader from '@ecl/specs-component-page-header/demo/data'; +import dataContentItem from '@ecl/specs-component-content-item/demo/data--image'; +import dataPagination from '@ecl/specs-component-pagination/demo/data'; +import dataSelectMultiple from '@ecl/specs-component-select/demo/data-multiple'; +import dataTextInput from '@ecl/specs-component-text-input/demo/data'; +import dataCheckbox from '@ecl/specs-component-checkbox/demo/data'; +import dataButtonPrimary from '@ecl/specs-component-button/demo/data--primary'; +import dataButtonSecondary from '@ecl/specs-component-button/demo/data--secondary'; + +dataSiteHeaderEC.mega_menu = dataMegaMenu; +delete dataSiteHeaderEC.cta_link; +delete dataSiteHeaderEC.banner_top; +delete dataSiteHeaderEC.notification; +delete dataSiteHeaderEC.site_name; + +dataSiteHeaderEU.mega_menu = dataMegaMenu; +delete dataSiteHeaderEU.cta_link; +delete dataSiteHeaderEU.banner_top; +delete dataSiteHeaderEU.notification; +delete dataSiteHeaderEU.site_name; + +dataPageHeader.breadcrumb = dataBreadcrumb; +dataPageHeader.hide_title = true; +delete dataPageHeader.picture_background; +delete dataPageHeader.picture_thumbnail; +delete dataPageHeader.meta; +delete dataPageHeader.description; + +dataContentItem.picture.size = 'small'; +delete dataContentItem.labels; +delete dataContentItem.lists; +delete dataContentItem.secondary_meta; + +dataCheckbox.required = false; +delete dataCheckbox.optional_text; +delete dataCheckbox.helper_text; + +dataSelectMultiple.required = false; +delete dataSelectMultiple.optional_text; +delete dataSelectMultiple.helper_text; + +dataTextInput.required = false; +delete dataTextInput.optional_text; +delete dataTextInput.helper_text; + +const system = getSystem(); + +const data = { + icon_path: '/icons.svg', + site_header: system === 'eu' ? dataSiteHeaderEU : dataSiteHeaderEC, + site_footer: system === 'eu' ? dataSiteFooterEU : dataSiteFooterEC, + page_header: dataPageHeader, + content_item: dataContentItem, + pagination: dataPagination, + select_multiple: dataSelectMultiple, + text_input: dataTextInput, + checkbox: dataCheckbox, + button_primary: dataButtonPrimary, + button_secondary: dataButtonSecondary, +}; + +export default data; diff --git a/src/specs/pages/page-search/package.json b/src/specs/pages/page-search/package.json new file mode 100644 index 00000000000..e5331427367 --- /dev/null +++ b/src/specs/pages/page-search/package.json @@ -0,0 +1,36 @@ +{ + "name": "@ecl/specs-page-search", + "author": "European Commission", + "license": "EUPL-1.2", + "version": "4.8.0", + "description": "ECL Example page - Search Specs", + "publishConfig": { + "access": "restricted" + }, + "dependencies": { + "@ecl/specs-component-breadcrumb": "4.8.0", + "@ecl/specs-component-button": "4.8.0", + "@ecl/specs-component-checkbox": "4.8.0", + "@ecl/specs-component-content-item": "4.8.0", + "@ecl/specs-component-mega-menu": "4.8.0", + "@ecl/specs-component-page-header": "4.8.0", + "@ecl/specs-component-pagination": "4.8.0", + "@ecl/specs-component-select": "4.8.0", + "@ecl/specs-component-site-footer": "4.8.0", + "@ecl/specs-component-site-header": "4.8.0", + "@ecl/specs-component-text-input": "4.8.0" + }, + "repository": { + "type": "git", + "url": "git+https://github.com/ec-europa/europa-component-library.git" + }, + "bugs": { + "url": "https://github.com/ec-europa/europa-component-library/issues" + }, + "homepage": "https://github.com/ec-europa/europa-component-library", + "keywords": [ + "ecl", + "europa-component-library", + "design-system" + ] +} diff --git a/src/specs/utilities/typography/package.json b/src/specs/utilities/typography/package.json index ed5a0abe1b2..bfcccf030a5 100644 --- a/src/specs/utilities/typography/package.json +++ b/src/specs/utilities/typography/package.json @@ -2,7 +2,7 @@ "name": "@ecl/specs-utils-typography", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Typography Utility Specs", "publishConfig": { "access": "public" diff --git a/src/themes/ec/package.json b/src/themes/ec/package.json index 244bbf3e48a..d2a4382d675 100644 --- a/src/themes/ec/package.json +++ b/src/themes/ec/package.json @@ -2,7 +2,7 @@ "name": "@ecl/theme-ec", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL — EC Theme", "style": "theme.scss", "publishConfig": { diff --git a/src/themes/ec/variables/_language-list.scss b/src/themes/ec/variables/_language-list.scss index a57f4d114e0..5617d2732bf 100644 --- a/src/themes/ec/variables/_language-list.scss +++ b/src/themes/ec/variables/_language-list.scss @@ -3,18 +3,18 @@ $language-list: ( color: var(--c-d), - container-padding: var(--s-3xl), + container-padding: var(--s-3xl) var(--s-3xl) var(--s-3xl) 28px, header-font-mobile: var(--f-l), header-font-desktop: var(--f-xl), content-margin-mobile: var(--s-s), content-margin-desktop: var(--s-s), category-title-font: var(--f-m), category-title-font-weight: map.get($font-weight, 'regular'), - category-title-padding: var(--s-l) 0 var(--s-xs), + category-title-padding: var(--s-l) 0 var(--s-xs) var(--s-s), category-separator: 1px solid var(--c-n), category-stack-margin: var(--s-s), - list-margin: 0 0 0 calc(-1 * var(--s-s)), - list-margin-rtl: calc(-1 * var(--s-s)) 0 0 0, + list-margin: 0, + list-margin-rtl: 0, item-padding: var(--s-xs) var(--s-s), code-color: var(--c-d), code-font-weight: map.get($font-weight, 'regular'), @@ -25,7 +25,7 @@ $language-list: ( item-active-shadow: none, item-width: 184px, column-spacing-before: var(--s-m), - column-spacing-after: calc(var(--s-m) + var(--s-s)), + column-spacing-after: var(--s-2xs), ); $language-list-print: ( container-padding: map.get($spacing-print, '3xl'), diff --git a/src/themes/ec/variables/_modal.scss b/src/themes/ec/variables/_modal.scss index dc94336ed6e..0d43c01ef66 100644 --- a/src/themes/ec/variables/_modal.scss +++ b/src/themes/ec/variables/_modal.scss @@ -11,7 +11,10 @@ $modal: ( padding-mobile: var(--s-3xl) var(--s-3xl) var(--s-xl) var(--s-3xl), padding-desktop: var(--s-3xl) var(--s-3xl) var(--s-xl) var(--s-3xl), ), - close-margin: calc(-1 * var(--s-xl)) calc(-1 * var(--s-xl)) 0 0, + close: ( + margin-top: calc(-1 * var(--s-xl)), + margin-end: calc(-1 * var(--s-xl)), + ), body: ( padding-mobile: 0 var(--s-3xl) var(--s-xl) var(--s-3xl), padding-desktop: 0 var(--s-3xl) var(--s-xl) var(--s-3xl), diff --git a/src/themes/ec/variables/_notification.scss b/src/themes/ec/variables/_notification.scss index d4a7dc04e73..13c0dafe5a7 100644 --- a/src/themes/ec/variables/_notification.scss +++ b/src/themes/ec/variables/_notification.scss @@ -3,16 +3,21 @@ $notification: ( radius: 0, - padding: var(--s-xl), + padding: var(--s-l), + padding-mobile: var(--s-m), padding-end: var(--s-xl), - padding-start: var(--s-3xl), + padding-end-mobile: var(--s-m), + padding-start: var(--s-l), + padding-start-mobile: var(--s-s), border-width: 1px, font: var(--f-m), color: var(--c-d), title-font: var(--f-l), title-font-weight: map.get($font-weight, 'regular'), - title-spacing: var(--s-s), + title-spacing: 0, close-color: var(--c-d), + close-offset-top-mobile: calc(var(--s-m) - var(--s-xl)), + close-offset-end-mobile: calc(var(--s-m) - var(--s-xl)), close-offset-top: calc(var(--s-m) - var(--s-xl)), close-offset-end: calc(var(--s-m) - var(--s-xl)), info: ( @@ -32,9 +37,12 @@ $notification: ( icon-background-color: var(--c-d), icon-background-height: var(--s-m), icon-background-width: var(--s-xs), - icon-background-top: calc(var(--s-xl) + var(--s-s)), + icon-background-top-mobile: calc(var(--s-m) + var(--s-s)), + icon-background-top: calc(var(--s-l) + var(--s-s)), + icon-background-left-mobile: + calc(var(--s-s) + (map.get($icon, 'l') / 2) - var(--s-2xs)), icon-background-left: - calc(var(--s-3xl) + (map.get($icon, 'l') / 2) - var(--s-2xs)), + calc(var(--s-l) + (map.get($icon, 'l') / 2) - var(--s-2xs)), ), error: ( background: var(--c-n-20), diff --git a/src/themes/eu/package.json b/src/themes/eu/package.json index d31b57135fb..6df36d6cd60 100644 --- a/src/themes/eu/package.json +++ b/src/themes/eu/package.json @@ -2,7 +2,7 @@ "name": "@ecl/theme-eu", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL — EU Theme", "style": "theme.scss", "publishConfig": { diff --git a/src/themes/eu/variables/_language-list.scss b/src/themes/eu/variables/_language-list.scss index b5b2da8307d..a20cabe7c1e 100644 --- a/src/themes/eu/variables/_language-list.scss +++ b/src/themes/eu/variables/_language-list.scss @@ -3,18 +3,18 @@ $language-list: ( color: var(--c-d-140), - container-padding: var(--s-2xl) var(--s-l) var(--s-l), + container-padding: var(--s-2xl) var(--s-l) var(--s-l) var(--s-s), header-font-mobile: var(--f-p-l), header-font-desktop: var(--f-p-xl), content-margin-mobile: var(--s-m), content-margin-desktop: var(--s-m), category-title-font: var(--f-p-m), category-title-font-weight: map.get($font-weight, 'bold'), - category-title-padding: var(--s-l) 0 var(--s-xs), + category-title-padding: var(--s-l) 0 var(--s-xs) var(--s-s), category-separator: 1px solid var(--c-p-20), category-stack-margin: var(--s-s), - list-margin: 0 0 0 calc(-1 * var(--s-s)), - list-margin-rtl: calc(-1 * var(--s-s)) 0 0 0, + list-margin: 0, + list-margin-rtl: 0, item-padding: var(--s-s), code-color: var(--c-d-140), code-font-weight: map.get($font-weight, 'bold'), @@ -22,10 +22,10 @@ $language-list: ( code-width: 30px, item-active-background: var(--c-p-10), item-active-color: var(--c-d-140), - item-active-shadow: inset 4px 0 0 0 var(--c-p), + item-active-shadow: none, item-width: 188px, column-spacing-before: var(--s-m), - column-spacing-after: var(--s-xl), + column-spacing-after: var(--s-m), ); $language-list-print: ( container-padding: map.get($spacing-print, '3xl') map.get($spacing-print, 'l') diff --git a/src/themes/eu/variables/_modal.scss b/src/themes/eu/variables/_modal.scss index 36934ff7ac6..54314b5d50d 100644 --- a/src/themes/eu/variables/_modal.scss +++ b/src/themes/eu/variables/_modal.scss @@ -11,7 +11,10 @@ $modal: ( padding-mobile: var(--s-l) var(--s-l) var(--s-m), padding-desktop: var(--s-l) var(--s-l) var(--s-m), ), - close-margin: calc(-1 * var(--s-s)) calc(-1 * var(--s-s)) 0 0, + close: ( + margin-top: calc(-1 * var(--s-s)), + margin-end: calc(-1 * var(--s-s)), + ), body: ( padding-mobile: 0 var(--s-l) var(--s-m) var(--s-l), padding-desktop: 0 var(--s-l) var(--s-m) var(--s-l), diff --git a/src/themes/eu/variables/_notification.scss b/src/themes/eu/variables/_notification.scss index 57121928296..0730e51e514 100644 --- a/src/themes/eu/variables/_notification.scss +++ b/src/themes/eu/variables/_notification.scss @@ -4,17 +4,20 @@ $notification: ( radius: 4px, padding: var(--s-l), - padding-end: var(--s-xs), + padding-mobile: var(--s-m), + padding-end: var(--s-2xl), padding-start: var(--s-l), + padding-end-mobile: var(--s-xl), + padding-start-mobile: var(--s-s), border-width: 1px, font: var(--f-p-m), - color: var(--c-d-80), - title-font: var(--f-p-m), - title-font-weight: map.get($font-weight, 'bold'), - title-spacing: var(--s-xs), + color: var(--c-d), + title-font: var(--f-p-l), + title-font-weight: map.get($font-weight, 'normal'), + title-spacing: 0, close-color: var(--c-d), - close-offset-top: calc(var(--s-s) - var(--s-l)), - close-offset-end: calc(var(--s-s) - var(--s-xs)), + close-offset-top: calc(var(--s-m) - var(--s-l)), + close-offset-end: calc(-1 * var(--s-l)), info: ( background: var(--c-in-5), color: var(--c-in), @@ -30,11 +33,14 @@ $notification: ( color: var(--c-wa), border-color: var(--c-wa), icon-background-color: var(--c-d), - icon-background-height: var(--s-s), + icon-background-height: var(--s-m), icon-background-width: var(--s-2xs), - icon-background-top: calc(var(--s-l) + var(--s-xs) + 1px), + icon-background-top: calc(var(--s-l) + var(--s-xs) + 2px), + icon-background-top-mobile: calc(var(--s-m) + var(--s-s)), + icon-background-left-mobile: + calc(var(--s-s) + (map.get($icon, 'l') / 2) - 2px), icon-background-left: - calc(var(--s-l) + (map.get($icon, 'm') / 2) - var(--s-2xs) + 1px), + calc(var(--s-l) + (map.get($icon, 'l') / 2) - var(--s-2xs) + 1px), ), error: ( background: var(--c-er-5), diff --git a/src/tools/builder/package.json b/src/tools/builder/package.json index 54923e643fb..b8d6c5d4528 100644 --- a/src/tools/builder/package.json +++ b/src/tools/builder/package.json @@ -2,7 +2,7 @@ "name": "@ecl/builder", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "Europa Component Library builder", "publishConfig": { "access": "public" @@ -11,10 +11,10 @@ "ecl-builder": "./bin/build.js" }, "dependencies": { - "@babel/core": "7.25.2", - "@babel/eslint-parser": "7.25.1", - "@babel/preset-env": "7.25.4", - "@babel/runtime": "7.25.6", + "@babel/core": "7.25.8", + "@babel/eslint-parser": "7.25.8", + "@babel/preset-env": "7.25.8", + "@babel/runtime": "7.25.7", "@rollup/plugin-replace": "5.0.7", "autoprefixer": "10.4.20", "browser-sync": "3.0.3", @@ -25,13 +25,13 @@ "postcss": "8.4.45", "postcss-banner": "4.0.1", "postcss-input-range": "5.0.0", - "rollup": "4.22.4", + "rollup": "4.24.0", "rollup-plugin-babel": "4.4.0", "rollup-plugin-commonjs": "10.1.0", "rollup-plugin-node-resolve": "5.2.0", "rollup-plugin-svg": "2.0.0", "rollup-plugin-uglify": "6.0.4", - "sass": "1.79.3" + "sass": "1.79.5" }, "engines": { "node": ">=18.12.0" diff --git a/src/tools/builder/scripts/scripts.js b/src/tools/builder/scripts/scripts.js index 208df729695..1df1cde7bb3 100644 --- a/src/tools/builder/scripts/scripts.js +++ b/src/tools/builder/scripts/scripts.js @@ -7,6 +7,7 @@ const commonjs = require('rollup-plugin-commonjs'); const { uglify } = require('rollup-plugin-uglify'); const svg = require('rollup-plugin-svg'); const getSystem = require('../utils/getSystem'); +const pkg = require('../package.json'); module.exports = (input, dest, options) => { const uglifyCode = @@ -32,6 +33,7 @@ module.exports = (input, dest, options) => { 'getSystem()': JSON.stringify(getSystem()), delimiters: ['', ''], preventAssignment: true, + __VERSION__: JSON.stringify(pkg.version), }), resolve(), commonjs(), @@ -58,6 +60,7 @@ module.exports = (input, dest, options) => { sourcemap: options.sourcemap || options.sourceMap, exports: 'named', globals: options.globals || {}, + footer: `ECL.version = "${pkg.version}";`, }; rollup.rollup(inputOptions).then((bundle) => bundle.write(outputOptions)); diff --git a/src/tools/dom-utils/package.json b/src/tools/dom-utils/package.json index 2503ac25ac0..ad1f123d0b0 100644 --- a/src/tools/dom-utils/package.json +++ b/src/tools/dom-utils/package.json @@ -2,7 +2,7 @@ "name": "@ecl/dom-utils", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL DOM utilities", "main": "index.js", "module": "index.js", diff --git a/src/tools/event-manager/package.json b/src/tools/event-manager/package.json index 0351259999b..4272cad37ec 100644 --- a/src/tools/event-manager/package.json +++ b/src/tools/event-manager/package.json @@ -2,7 +2,7 @@ "name": "@ecl/event-manager", "author": "European Commission", "license": "EUPL-1.2", - "version": "4.7.0", + "version": "4.8.0", "description": "ECL Events manager", "main": "index.js", "module": "index.js", diff --git a/src/tools/test-utils/package.json b/src/tools/test-utils/package.json index bd25137a3bc..cd5f3940f21 100644 --- a/src/tools/test-utils/package.json +++ b/src/tools/test-utils/package.json @@ -1,6 +1,6 @@ { "name": "@ecl/test-utils", - "version": "4.7.0", + "version": "4.8.0", "description": "A local test helper", "main": "index.js", "private": true, diff --git a/src/website/package.json b/src/website/package.json index 0f61a54d52a..ce30ba37072 100644 --- a/src/website/package.json +++ b/src/website/package.json @@ -1,7 +1,7 @@ { "private": true, "name": "@ecl/website", - "version": "4.7.0", + "version": "4.8.0", "scripts": { "clean": "rimraf build public/apis/*", "start": "npm run prebuild && webpack-dev-server --config webpack.config.dev.js", @@ -13,12 +13,12 @@ "serve": "serve build" }, "dependencies": { - "@ecl/resources-ec-logo": "4.7.0", - "@ecl/resources-eu-logo": "4.7.0", - "@ecl/resources-flag-icons": "4.7.0", - "@ecl/resources-icons": "4.7.0", - "@ecl/resources-social-media-icons": "4.7.0", - "@ecl/vanilla-layout-grid": "4.7.0", + "@ecl/resources-ec-logo": "4.8.0", + "@ecl/resources-eu-logo": "4.8.0", + "@ecl/resources-flag-icons": "4.8.0", + "@ecl/resources-icons": "4.8.0", + "@ecl/resources-social-media-icons": "4.8.0", + "@ecl/vanilla-layout-grid": "4.8.0", "@hot-loader/react-dom": "17.0.2", "@iframe-resizer/child": "5.3.1", "@iframe-resizer/parent": "5.3.1", @@ -45,13 +45,13 @@ "slugify": "1.6.6" }, "devDependencies": { - "@babel/core": "7.25.2", - "@babel/plugin-proposal-export-default-from": "7.24.7", + "@babel/core": "7.25.8", + "@babel/plugin-proposal-export-default-from": "7.25.8", "@babel/plugin-proposal-export-namespace-from": "7.18.9", - "@babel/preset-env": "7.25.4", - "@babel/preset-react": "7.24.7", - "@babel/runtime": "7.25.6", - "@ecl/twig-ec-storybook": "4.7.0", + "@babel/preset-env": "7.25.8", + "@babel/preset-react": "7.25.7", + "@babel/runtime": "7.25.7", + "@ecl/twig-ec-storybook": "4.8.0", "@mdx-js/loader": "2.3.0", "autoprefixer": "10.4.20", "babel-eslint": "10.1.0", @@ -81,7 +81,7 @@ "postcss-flexbugs-fixes": "5.0.2", "postcss-loader": "8.1.1", "postcss-prefix-selector": "1.16.1", - "postcss-safe-parser": "7.0.0", + "postcss-safe-parser": "7.0.1", "raw-loader": "4.0.2", "react-dev-utils": "12.0.1", "react-snap": "1.23.0", @@ -89,7 +89,7 @@ "remark-gfm": "1.0.0", "remark-unwrap-images": "2.1.0", "rimraf": "6.0.1", - "sass": "1.79.3", + "sass": "1.79.5", "sass-loader": "16.0.2", "serve": "14.2.3", "style-loader": "4.0.0", @@ -104,6 +104,7 @@ }, "reactSnap": { "exclude": [ + "/apis/*", "/component-library/**/cms-images/**", "/component-library/cms-images/**", "/playground/**", diff --git a/src/website/src/pages/ec/components/media/featured-item/demo/index.js b/src/website/src/pages/ec/components/media/featured-item/demo/index.js index fefd2b346ec..daa6f1ffeee 100644 --- a/src/website/src/pages/ec/components/media/featured-item/demo/index.js +++ b/src/website/src/pages/ec/components/media/featured-item/demo/index.js @@ -4,6 +4,19 @@ import demoContentHighlight from '@ecl/specs-component-featured-item/demo/data-- import template from '@ecl/twig-component-featured-item/featured-item.html.twig'; import { correctSvgPath } from '@ecl/website-utils'; +// Footer is deprecated FRONT-4650 +delete demoContent.footer_description; +delete demoContent.footer_link; +delete demoContent.footer_picture; + +delete demoContentSimple.footer_description; +delete demoContentSimple.footer_link; +delete demoContentSimple.footer_picture; + +delete demoContentHighlight.footer_description; +delete demoContentHighlight.footer_link; +delete demoContentHighlight.footer_picture; + export const featuredItem = template(correctSvgPath(demoContent)); export const featuredItemRightAlignement = template( correctSvgPath({ diff --git a/src/website/src/pages/ec/components/media/media-container/docs/api.mdx b/src/website/src/pages/ec/components/media/media-container/docs/api.mdx new file mode 100644 index 00000000000..9a8e8c60514 --- /dev/null +++ b/src/website/src/pages/ec/components/media/media-container/docs/api.mdx @@ -0,0 +1,52 @@ +--- +title: API +order: 3 +--- + +import React from 'react'; +import Iframe from '../../../../../../website-components/Showcase/Iframe'; + +## Setup + +There are 2 ways to initialise the component. + +### Automatic + +Add `data-ecl-auto-init="MediaContainer"` attribute to component's markup: + +```html +
+ ... +
+``` + +Use the `ECL` library's `autoInit()` (`ECL.autoInit()`) when your page is ready or other custom event you want to hook onto. + +### Manual + +Get target element, create an instance and invoke `init()`. + +Given you have 1 element with an attribute `data-ecl-media-container` on the page: + +```js +var elt = document.querySelector('[data-ecl-media-container]'); +var mediaContainer = new ECL.MediaContainer(elt); +mediaContainer.init(); +``` + +### Retrieve an existing instance + +If an existing instance needs to be updated, it can be retrieved this way: + +```js +var elt = document.querySelector('[data-ecl-media-container]'); +var instance = ECL.components.get(elt); +``` + +## API + +