@openeuropa/bcl-mega-menu 0.1057.202502180200 → 0.3694.202507310900

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/mega-menu.html.twig +55 -22
  2. package/package.json +5 -5
package/mega-menu.html.twig CHANGED
@@ -5,12 +5,14 @@
5
5
  - link (boolean) (default: false) - sets trigger to link, default is button
6
6
  - trigger (link or button)
7
7
  - content_block (block) (default: '')
8
+ - content_link (link)
9
+ - icon_path (string) (default: '')
10
+ - min_height (string) (default: '300px')
11
+ ! set min-height of mega-menu
8
12
  - items (object[])
9
13
  format: [
10
14
  {
11
15
  - link or dropdown
12
- ! dropdown extra property:
13
- collapse (render) - to showcase on the last column
14
16
  }
15
17
  ]
16
18
  - back_button_label (string) (default: 'Back')
@@ -21,6 +23,9 @@
21
23
  {% set _link = link ?? false %}
22
24
  {% set _trigger = trigger|default({}) %}
23
25
  {% set _content_block = content_block|default('') %}
26
+ {% set _content_link = content_link|default({}) %}
27
+ {% set _icon_path = icon_path|default('') %}
28
+ {% set _min_height = min_height|default('300px') %}
24
29
  {% set _items = items|default([]) %}
25
30
  {% set _back_button_label = back_button_label|default('Back') %}
26
31
  {% set _icon_path = icon_path|default('') %}
@@ -55,50 +60,78 @@
55
60
  }) %}
56
61
  {% endif %}
57
62
 
58
- <div {{ attributes }}>
63
+ <div {{ attributes }} style="--bcl-mm-min-height: {{ _min_height }};">
59
64
  {% if _link %}
60
65
  {% include '@oe-bcl/bcl-link/link.html.twig' with _trigger only %}
61
66
  {% else %}
62
67
  {% include '@oe-bcl/bcl-button/button.html.twig' with _trigger only %}
63
68
  {% endif %}
64
69
  <div class="mega-menu-container dropdown-menu" aria-labelledby="{{ _id }}">
65
- {% include '@oe-bcl/bcl-button/button.html.twig' with {
66
- label: _back_button_label,
67
- icon_position: "before",
68
- variant: 'link',
69
- icon: {
70
- path: _icon_path,
71
- name: "arrow-left",
72
- },
73
- attributes: create_attribute().addClass(['back-button'])
74
- } only %}
75
- <div class="row position-relative">
70
+ <div class="d-lg-none back-button-block">
71
+ {% include '@oe-bcl/bcl-button/button.html.twig' with {
72
+ label: _back_button_label,
73
+ icon_position: "before",
74
+ variant: 'link',
75
+ icon: {
76
+ path: _icon_path,
77
+ name: "arrow-left",
78
+ },
79
+ attributes: create_attribute().addClass(['back-button'])
80
+ } only %}
81
+ </div>
82
+ <div class="row pb-md-3">
76
83
  {% if content_block is defined %}
77
- <div class="col-12 col-lg-4">
78
- <div class="content-block py-3">
84
+ <div class="col-md-12 col-xl-3">
85
+ <div class="content-block">
79
86
  {%- block content_block -%}
80
87
  {{ _content_block }}
81
88
  {%- endblock -%}
89
+ {% if _content_link is defined %}
90
+ {% set _content_link = _content_link|merge({
91
+ icon: _content_link.icon|default({})|merge({
92
+ path: _icon_path
93
+ }),
94
+ attributes: (_content_link.attributes is defined
95
+ ? _content_link.attributes
96
+ : create_attribute()
97
+ ).addClass('content-link')
98
+ }) %}
99
+
100
+ {% include '@oe-bcl/bcl-link/link.html.twig' with _content_link only %}
101
+ {% endif %}
82
102
  </div>
83
103
  </div>
84
104
  {% endif %}
85
- <div class="col-12 col-lg-8">
105
+ <div class="col-md-12 col-xl-9 mb-lg-3">
86
106
  <div class="navigation-items">
87
107
  {% for _item in _items %}
88
108
  {% if _item.items is defined %}
109
+ {% set _items_list = _item.items %}
110
+ {% if _item.see_all is defined %}
111
+ {% set _items_list = _items_list|merge([
112
+ _item.see_all|merge({
113
+ icon: {
114
+ name: "arrow-right",
115
+ path: _icon_path,
116
+ },
117
+ attributes: create_attribute().addClass('see-all-button')
118
+ })
119
+ ]) %}
120
+ {% endif %}
121
+ {% set _item = _item|merge({ items: _items_list }) %}
89
122
  {% set _trigger_attributes = _item.trigger.attributes is defined ? _item.trigger.attributes : create_attribute() %}
90
123
  {% include '@oe-bcl/bcl-dropdown/dropdown.html.twig' with _item|merge({
91
124
  direction: 'dropend',
92
125
  link: true,
93
126
  trigger: _item.trigger|merge({
127
+ icon: {
128
+ name: "chevron-right",
129
+ path: _icon_path,
130
+ size: "fluid",
131
+ },
94
132
  attributes: _trigger_attributes.setAttribute('data-bs-auto-close', 'outside')
95
133
  })
96
134
  }) only %}
97
- {% if _item.collapse is defined %}
98
- <div class="collapse">
99
- {{ _item.collapse|raw }}
100
- </div>
101
- {% endif %}
102
135
  {% else %}
103
136
  {% include '@oe-bcl/bcl-link/link.html.twig' with _item only %}
104
137
  {% endif %}
package/package.json CHANGED
@@ -2,15 +2,15 @@
2
2
  "name": "@openeuropa/bcl-mega-menu",
3
3
  "author": "European Commission",
4
4
  "license": "EUPL-1.2",
5
- "version": "0.1057.202502180200",
5
+ "version": "0.3694.202507310900",
6
6
  "publishConfig": {
7
7
  "access": "public"
8
8
  },
9
9
  "description": "OE - BCL mega menu",
10
10
  "dependencies": {
11
- "@openeuropa/bcl-button": "^0.1057.202502180200",
12
- "@openeuropa/bcl-dropdown": "^0.1057.202502180200",
13
- "@openeuropa/bcl-link": "^0.1057.202502180200"
11
+ "@openeuropa/bcl-button": "^0.3694.202507310900",
12
+ "@openeuropa/bcl-dropdown": "^0.3694.202507310900",
13
+ "@openeuropa/bcl-link": "^0.3694.202507310900"
14
14
  },
15
15
  "repository": {
16
16
  "type": "git",
@@ -26,5 +26,5 @@
26
26
  "design-system",
27
27
  "twig"
28
28
  ],
29
- "gitHead": "e973271efab5ff00b20aec35d178760cf3bc966f"
29
+ "gitHead": "4b1b47204c5c1e7673f8093214eb976df91aa31b"
30
30
  }