@openeuropa/bcl-gallery 0.4298.202511051800 → 0.4360.202601141610

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 (3) hide show
  1. package/gallery-item.html.twig +20 -23
  2. package/gallery.html.twig +62 -66
  3. package/package.json +6 -6
package/gallery-item.html.twig CHANGED
@@ -1,5 +1,3 @@
1
- {% apply spaceless %}
2
-
3
1
  {#
4
2
  Parameters:
5
3
  - item (object) (default: {})
@@ -17,49 +15,48 @@ Parameters:
17
15
  - attributes (drupal attrs)
18
16
  #}
19
17
 
20
- {% set _item = item|default({}) %}
18
+ {%- set _item = item|default({}) %}
21
19
  {% set _carousel_id = carousel_id|default('') %}
22
20
  {% set _modal_id = modal_id|default('') %}
23
21
  {% set _icon_path = icon_path|default('') %}
24
22
  {% set _carousel_anchor = carousel_anchor|default('') %}
25
23
 
26
- {% if attributes is empty %}
27
- {% set attributes = create_attribute() %}
24
+ {%- if attributes is empty %}
25
+ {%- set attributes = create_attribute() %}
28
26
  {% endif %}
29
27
 
30
- {% set attributes = attributes.addClass(['bcl-gallery__item', 'd-block', 'w-100', 'img-fluid'])
28
+ {%- set attributes = attributes.addClass(['bcl-gallery__item', 'd-block', 'w-100', 'img-fluid'])
31
29
  .setAttribute('data-bs-target', '#' ~ _carousel_id)
32
30
  .setAttribute('data-bs-slide-to', _carousel_anchor)
33
31
  .setAttribute('tabindex', '0')
34
- %}
32
+ -%}
35
33
 
36
- <a
34
+ <a
37
35
  {{ attributes }}
38
- >
36
+ >{# -#}
39
37
  <div class="bcl-gallery__item-overlay" data-bs-target="#{{ _modal_id }}" data-bs-toggle="modal">
40
- {% if _item.is_playable %}
38
+ {%- if _item.is_playable -%}
41
39
  <span class="bcl-gallery__item-play-icon">
42
- {% include '@oe-bcl/bcl-icon/icon.html.twig' with {
40
+ {%- include '@oe-bcl/bcl-icon/icon.html.twig' with {
43
41
  name: 'play-fill',
44
42
  size: 's',
45
43
  path: _icon_path,
46
- } only %}
44
+ } only -%}
47
45
  </span>
48
- {% endif %}
49
- {% if _item.caption is not empty or item.caption_title is not empty %}
46
+ {%- endif %}
47
+ {%- if _item.caption is not empty or item.caption_title is not empty -%}
50
48
  <div class="bcl-gallery__item-caption">
51
- {% if _item.caption_title is not empty %}
49
+ {%- if _item.caption_title is not empty -%}
52
50
  <div class="fs-5">{{ _item.caption_title }}</div>
53
- {% endif %}
54
- {% if _item.caption is not empty %}
51
+ {%- endif %}
52
+ {%- if _item.caption is not empty -%}
55
53
  <div class="bcl-gallery__item-description">
56
- {{ _item.caption }}
54
+ {{- _item.caption -}}
57
55
  </div>
58
- {% endif %}
56
+ {%- endif -%}
59
57
  </div>
60
- {% endif %}
58
+ {%- endif -%}
61
59
  </div>
62
- {{ _item.thumbnail }}
60
+ {{- _item.thumbnail -}}
63
61
  </a>
64
-
65
- {% endapply %}
62
+ {#--#}
package/gallery.html.twig CHANGED
@@ -1,5 +1,3 @@
1
- {% apply spaceless %}
2
-
3
1
  {#
4
2
  Parameters:
5
3
  - id (string) (default: gallery-random(10000))
@@ -28,7 +26,7 @@ Parameters:
28
26
  carousel
29
27
  #}
30
28
 
31
- {% set _id = id|default('gallery-' ~ random(10000)) %}
29
+ {%- set _id = id|default('gallery-' ~ random(10000)) %}
32
30
  {% set _title = title|default('') %}
33
31
  {% set _title_tag = title_tag|default('h2') %}
34
32
  {% set _title_link = title_link|default({}) %}
@@ -46,59 +44,59 @@ Parameters:
46
44
  {% set _collapse_id = "collapse" ~ _id|capitalize %}
47
45
  {% set _carousel_items = [] %}
48
46
 
49
- {% if attributes is empty %}
50
- {% set attributes = create_attribute() %}
47
+ {%- if attributes is empty %}
48
+ {%- set attributes = create_attribute() %}
51
49
  {% endif %}
52
50
 
53
- {% set attributes = attributes.addClass('bcl-gallery') %}
51
+ {%- set attributes = attributes.addClass('bcl-gallery') %}
54
52
 
55
- {% if _items is not empty and _items is iterable %}
53
+ {%- if _items is not empty and _items is iterable -%}
56
54
  <div
57
55
  {{ attributes }}
58
56
  >
59
- {% if _title is not empty or _counter is not empty %}
57
+ {%- if _title is not empty or _counter is not empty -%}
60
58
  <div class="d-sm-flex flex-sm-row align-items-sm-center">
61
- {% if _title is not empty %}
59
+ {%- if _title is not empty -%}
62
60
  <div class="flex-sm-grow-1">
63
- {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
61
+ {%- include '@oe-bcl/bcl-heading/heading.html.twig' with {
64
62
  title: _title,
65
63
  title_tag: _title_tag,
66
64
  title_link: _title_link,
67
65
  attributes: _title_attributes,
68
- } only %}
66
+ } only -%}
69
67
  </div>
70
- {% endif %}
68
+ {%- endif %}
71
69
  {%- if _counter is not empty -%}
72
70
  <div class="mb-3 mb-sm-0 fw-bold">
73
71
  {{- _counter|replace({'%d': _items|length}) -}}
74
72
  </div>
75
73
  {%- endif -%}
76
74
  </div>
77
- {% endif %}
75
+ {%- endif -%}
78
76
  <div class="bcl-gallery__thumbnails">
79
- {% for _batch in _items|batch(_max_visible_thumbnails) %}
80
- {% if loop.index0 == 1 %}
77
+ {%- for _batch in _items|batch(_max_visible_thumbnails) %}
78
+ {%- if loop.index0 == 1 -%}
81
79
  <div class="bcl-gallery__thumbnails-collaspe collapse" id="{{ _collapse_id }}">
82
- {% endif %}
80
+ {%- endif -%}
83
81
  <ul class="bcl-gallery__grid">
84
- {% for _item in _batch %}
82
+ {%- for _item in _batch -%}
85
83
  <li>
86
- {% include '@oe-bcl/bcl-gallery/gallery-item.html.twig' with {
84
+ {%- include '@oe-bcl/bcl-gallery/gallery-item.html.twig' with {
87
85
  item: _item,
88
86
  carousel_id: _carousel_id,
89
87
  modal_id: _modal_id,
90
88
  icon_path: _icon_path,
91
89
  carousel_anchor: loop.index0 + (_max_visible_thumbnails * loop.parent.loop.index0),
92
- } only %}
90
+ } only -%}
93
91
  </li>
94
- {% endfor %}
92
+ {%- endfor -%}
95
93
  </ul>
96
- {% if loop.last and loop.index0 >= 1 %}
94
+ {%- if loop.last and loop.index0 >= 1 -%}
97
95
  </div>
98
- {% endif %}
99
- {% endfor %}
100
- {% if _items|length > _max_visible_thumbnails %}
101
- <div class="bg-lighter py-3 px-4 mt-2 rounded text-center">
96
+ {%- endif %}
97
+ {%- endfor %}
98
+ {%- if _items|length > _max_visible_thumbnails -%}
99
+ <div class="bg-lighter py-3 px-4 mt-2 rounded text-center">{# -#}
102
100
  <a
103
101
  class="bcl-gallery__collapse standalone d-none d-sm-inline-block"
104
102
  aria-controls="{{ _collapse_id }}"
@@ -106,76 +104,76 @@ Parameters:
106
104
  aria-expanded="false"
107
105
  role="button"
108
106
  href="#{{ _collapse_id }}"
109
- >
110
- <span class="label-collapsed">{{ _toggle_collapsed|replace({'%d': _items|length}) }}</span>
107
+ >{# -#}
108
+ <span class="label-collapsed">{{ _toggle_collapsed|replace({'%d': _items|length}) }}</span>{# -#}
111
109
  <span class="label-expanded">{{ _toggle_expanded }}</span>
112
- {% include '@oe-bcl/bcl-icon/icon.html.twig' with {
110
+ {%- include '@oe-bcl/bcl-icon/icon.html.twig' with {
113
111
  name: 'caret-down-fill',
114
112
  size: '2xs',
115
113
  path: _icon_path,
116
114
  attributes: create_attribute().addClass('ms-2-5'),
117
- } only %}
118
- </a>
115
+ } only -%}
116
+ </a>{# -#}
119
117
  <a
120
118
  class="bcl-gallery__mobile-view-more standalone d-inline-block d-sm-none"
121
119
  data-bs-target="#{{ _carousel_id }}"
122
120
  data-bs-slide-to="{{ _max_visible_thumbnails - 1 }}"
123
121
  role="button"
124
122
  href="#"
125
- >
126
- <span data-bs-target="#{{ _modal_id }}" data-bs-toggle="modal">
123
+ >{# -#}
124
+ <span data-bs-target="#{{ _modal_id }}" data-bs-toggle="modal">{# -#}
127
125
  <span class="label-collapsed">{{ _toggle_collapsed|replace({'%d': _items|length}) }}</span>
128
- {% include '@oe-bcl/bcl-icon/icon.html.twig' with {
126
+ {%- include '@oe-bcl/bcl-icon/icon.html.twig' with {
129
127
  name: 'caret-down-fill',
130
128
  size: '2xs',
131
129
  path: _icon_path,
132
130
  attributes: create_attribute().addClass('ms-2-5'),
133
- } only %}
134
- <span>
135
- </a>
131
+ } only -%}
132
+ <span>{# -#}
133
+ </a>{# -#}
136
134
  </div>
137
- {% endif %}
138
- </div>
139
- <div class="modal" id="{{ _modal_id }}" tabindex="-1" aria-labelledby="{{ _modal_id }}" aria-hidden="true" data-bs-backdrop="false">
140
- <div class="modal-dialog modal-dialog-centered modal-fullscreen">
141
- <div class="modal-content">
135
+ {%- endif -%}
136
+ </div>{# -#}
137
+ <div class="modal" id="{{ _modal_id }}" tabindex="-1" aria-labelledby="{{ _modal_id }}" aria-hidden="true" data-bs-backdrop="false">{# -#}
138
+ <div class="modal-dialog modal-dialog-centered modal-fullscreen">{# -#}
139
+ <div class="modal-content">{# -#}
142
140
  <div class="modal-header border-0 justify-content-between">
143
- {% if _title is not empty %}
141
+ {%- if _title is not empty -%}
144
142
  <div class="modal-title">
145
- {% if _title is not empty %}
146
- {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
143
+ {%- if _title is not empty %}
144
+ {%- include '@oe-bcl/bcl-heading/heading.html.twig' with {
147
145
  title: _title,
148
146
  title_tag: 'h3',
149
147
  attributes: create_attribute().addClass(['d-sm-block', 'd-none']),
150
148
  } only %}
151
- {% endif %}
149
+ {%- endif -%}
152
150
  </div>
153
- {% endif %}
154
- <div class="carousel-pager">
151
+ {%- endif -%}
152
+ <div class="carousel-pager">{# -#}
155
153
  <span>1</span> / {{ _items|length -}}
156
- </div>
154
+ </div>{# -#}
157
155
  <div class="modal-close">
158
- {% set button_attributes = create_attribute()
156
+ {%- set button_attributes = create_attribute()
159
157
  .addClass('btn-close')
160
158
  .setAttribute('aria-label', 'Close')
161
159
  .setAttribute('data-bs-dismiss', 'modal')
162
160
  %}
163
- {% include '@oe-bcl/bcl-button/button.html.twig' with {
161
+ {%- include '@oe-bcl/bcl-button/button.html.twig' with {
164
162
  clean_class: true,
165
163
  attributes: button_attributes
166
- } only %}
167
- </div>
168
- </div>
164
+ } only -%}
165
+ </div>{# -#}
166
+ </div>{# -#}
169
167
  <div class="modal-body d-flex align-items-center justify-content-center">
170
- {% block carousel %}
171
- {% for _item in _items %}
172
- {% set _carousel_items = _carousel_items|merge([_item|merge({
168
+ {%- block carousel %}
169
+ {%- for _item in _items %}
170
+ {%- set _carousel_items = _carousel_items|merge([_item|merge({
173
171
  caption_title: ('<iframe' in _item.media or '<video' in _item.media) ? '' : _item.caption_title,
174
172
  caption: ('<iframe' in _item.media or '<video' in _item.media) ? '' : _item.caption,
175
173
  image: ('<iframe' in _item.media or '<img' in _item.media) ? _item.media|replace({'src=': 'data-src='}) : _item.media,
176
174
  })]) %}
177
- {% endfor %}
178
- {% include '@oe-bcl/bcl-carousel/carousel.html.twig' with {
175
+ {%- endfor %}
176
+ {%- include '@oe-bcl/bcl-carousel/carousel.html.twig' with {
179
177
  id: _carousel_id,
180
178
  with_controls: true,
181
179
  with_indicators: false,
@@ -184,12 +182,10 @@ Parameters:
184
182
  autoplay: false,
185
183
  items: _carousel_items,
186
184
  } only %}
187
- {% endblock %}
188
- </div>
189
- </div>
190
- </div>
191
- </div>
185
+ {%- endblock -%}
186
+ </div>{# -#}
187
+ </div>{# -#}
188
+ </div>{# -#}
189
+ </div>{# -#}
192
190
  </div>
193
- {% endif %}
194
-
195
- {% endapply %}
191
+ {%- endif -%}
package/package.json CHANGED
@@ -2,16 +2,16 @@
2
2
  "name": "@openeuropa/bcl-gallery",
3
3
  "author": "European Commission",
4
4
  "license": "EUPL-1.2",
5
- "version": "0.4298.202511051800",
5
+ "version": "0.4360.202601141610",
6
6
  "description": "OE - BCL gallery",
7
7
  "publishConfig": {
8
8
  "access": "public"
9
9
  },
10
10
  "dependencies": {
11
- "@openeuropa/bcl-button": "^0.4298.202511051800",
12
- "@openeuropa/bcl-carousel": "^0.4298.202511051800",
13
- "@openeuropa/bcl-heading": "^0.4298.202511051800",
14
- "@openeuropa/bcl-icon": "^0.4298.202511051800"
11
+ "@openeuropa/bcl-button": "^0.4360.202601141610",
12
+ "@openeuropa/bcl-carousel": "^0.4360.202601141610",
13
+ "@openeuropa/bcl-heading": "^0.4360.202601141610",
14
+ "@openeuropa/bcl-icon": "^0.4360.202601141610"
15
15
  },
16
16
  "repository": {
17
17
  "type": "git",
@@ -27,5 +27,5 @@
27
27
  "design-system",
28
28
  "twig"
29
29
  ],
30
- "gitHead": "cf21a1c538fac191785bb5f86c4d78d5b3b25d4c"
30
+ "gitHead": "2caf9255f88587416f6e83e572a1f20e4cf206f5"
31
31
  }