@eui/ecl 22.0.0-alpha.37 → 22.0.0-alpha.39

package/docs/changelog.html

@@ -106,6 +106,34 @@
 
 
 
+<h2>22.0.0-alpha.38 (2026-10-01)</h2>
+<h5>Chores</h5>
+<ul>
+<li><strong>core:</strong><ul>
+<li>adapted eui-app-shell for injection failure - EUI-12528 <a href="https://citnet.tech.ec.europa.eu/CITnet/jira/browse/EUI-12528">EUI-12528</a>  (<a href="https://sdlc.aws.cloud.tech.ec.europa.eu/csdr/eui/eui/-/commit/f593a41a7433b1a622e086e87353234ef0e7ff38">f593a41a</a>)</li>
+</ul>
+</li>
+<li><strong>eds-progress-bar:</strong><ul>
+<li>aligned with EDS design for sizes and colors - EDS-306 <a href="https://citnet.tech.ec.europa.eu/CITnet/jira/browse/EDS-306">EDS-306</a>  (<a href="https://sdlc.aws.cloud.tech.ec.europa.eu/csdr/eui/eui/-/commit/0af1cd94e10eee96378ef513691b9606de56df80">0af1cd94</a>)</li>
+</ul>
+</li>
+<li><strong>eds-switch:</strong><ul>
+<li>aligned with EDS design for dark background color and icon size - EDS-315 <a href="https://citnet.tech.ec.europa.eu/CITnet/jira/browse/EDS-315">EDS-315</a>  (<a href="https://sdlc.aws.cloud.tech.ec.europa.eu/csdr/eui/eui/-/commit/726892f3b16f05841ea4e6248af7a213e34530f1">726892f3</a>)</li>
+</ul>
+</li>
+</ul>
+<hr>
+<hr>
+<h2>22.0.0-alpha.37 (2026-10-01)</h2>
+<h5>Chores</h5>
+<ul>
+<li><strong>other:</strong><ul>
+<li>fixed some errors in tests EUI-12951 <a href="https://citnet.tech.ec.europa.eu/CITnet/jira/browse/EUI-12951">EUI-12951</a>  (<a href="https://sdlc.aws.cloud.tech.ec.europa.eu/csdr/eui/eui/-/commit/34b287156fd94cb2a243ca53bd4244d998a9ea42">34b28715</a>)</li>
+</ul>
+</li>
+</ul>
+<hr>
+<hr>
 <h2>22.0.0-alpha.36 (2026-10-01)</h2>
 <h5>Chores</h5>
 <ul>

package/docs/components/EclSloganTickerComponent.html

@@ -145,8 +145,44 @@ ticker of slogan items. Supports play/pause controls, RTL layouts, and pauses
 when off-screen via IntersectionObserver.</p>
 <p>Uses Embla Carousel (via embla-carousel-angular) with the auto-scroll plugin
 to match the ECL vanilla implementation.</p>
-<p>The component clones projected slides internally to ensure the track is wide
-enough for seamless infinite scrolling (matching the vanilla ECL approach).</p>
+<h2>Why two lists (hidden source + generated track)</h2>
+<p>The consumer provides a plain, semantic list:</p>
+<b>Example :</b><div><pre class="line-numbers"><code class="language-html">&lt;ecl-slogan-ticker&gt;
+  &lt;ul eclSloganTickerList&gt;
+    &lt;li eclSloganTickerSlide&gt;SLOGAN ONE&lt;/li&gt;
+    &lt;li eclSloganTickerSlide&gt;SLOGAN TWO&lt;/li&gt;
+  &lt;/ul&gt;
+&lt;/ecl-slogan-ticker&gt;</code></pre></div><p>This authored <code>&lt;ul eclSloganTickerList&gt;</code> is NOT the list you see scrolling.
+<code>EclSloganTickerListDirective</code> hides it with <code>display: none</code>, and it stays in
+the light DOM as the single accessible source of truth. The component reads
+the slide texts out of it via a <code>contentChildren</code> query (see <code>slides</code>) and
+builds a SEPARATE, component-owned <code>&lt;ul class=&quot;ecl-slogan-ticker__track&quot;&gt;</code>
+from the <code>trackSlides</code> signal. That generated track is what Embla animates.</p>
+<p>Reasons for the split (rather than just scrolling the authored <code>&lt;ul&gt;</code>):</p>
+<ul>
+<li>Seamless infinite loop needs more content than the author gives. The track
+must be several times wider than the viewport or the loop visibly jumps, so
+<code>ensureEnoughContent()</code> measures the originals and appends CLONE sets until
+the total width reaches <code>CLONE_MULTIPLIER</code> × the container width.</li>
+<li>Clones must not pollute accessibility. The authored list stays the one
+accessible list; every generated clone is rendered with <code>aria-hidden</code> so a
+screen reader announces each slogan once, not once per clone.</li>
+<li>You cannot meaningfully grow the authored <code>&lt;ul&gt;</code>. Its <code>&lt;li&gt;</code> children are
+Angular-projected content that Angular owns; imperatively appending clone
+<code>&lt;li&gt;</code> nodes into it fights change detection. Building our own track signal
+and letting <code>@for</code> render it is clean and safe. <code>&lt;li&gt;</code> is also only valid
+inside a list element, so the <code>&lt;ul eclSloganTickerList&gt;</code> wrapper keeps the
+consumer&#39;s authored markup valid and self-contained.</li>
+</ul>
+<p>This mirrors the vanilla ECL slogan ticker (hidden source list + measured,
+cloned, auto-scrolling track).</p>
+<h2>Testing note</h2>
+<p>The visible track is only built after a real width measurement
+(<code>offsetWidth</code>). Under jsdom every element reports a width of 0, so
+<code>ensureEnoughContent()</code> bails early and the generated track stays empty. Unit
+tests should therefore assert slide-driven behavior through its observable
+effects (e.g. the play/pause controls appearing) rather than through the
+generated track DOM.</p>
 
     </p>
 

package/docs/components/EclSocialMediaFollowItemComponent.html

@@ -450,13 +450,13 @@
                 </tr>
                 <tr>
                     <td class="col-md-4">
-                        <i>Type : </i>    <code>false</code>
+                        <i>Type : </i>        <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/boolean" target="_blank" >boolean</a></code>
 
                     </td>
                 </tr>
                 <tr>
                     <td class="col-md-4">
-                        <i>Default value : </i><code>undefined</code>
+                        <i>Default value : </i><code>false</code>
                     </td>
                 </tr>
             </tbody>

package/docs/directives/EclSocialMediaFollowLinkDirective.html

@@ -150,12 +150,6 @@
                             <code><a href="../directives/ECLBaseDirective.html" target="_self" >ECLBaseDirective</a></code>
             </p>
 
-            <p class="comment">
-                <h3>Implements</h3>
-            </p>
-            <p class="comment">
-                            <code><a href="https://angular.dev/api/core/AfterContentInit" target="_blank" >AfterContentInit</a></code>
-            </p>
 
 
         <section data-compodoc="block-metadata">
@@ -190,9 +184,6 @@
                                 <li>
                                             <code><a href="../directives/ECLBaseDirective.html" target="_self" >ECLBaseDirective</a></code>
                                 </li>
-                                <li>
-                                            <code><a href="https://angular.dev/api/core/AfterContentInit" target="_blank" >AfterContentInit</a></code>
-                                </li>
                         </ul>
                 </div>
             </div>
@@ -264,44 +255,41 @@
         </table>
 
 
+
+
         <table class="table table-sm table-bordered index-table">
             <tbody>
                 <tr>
                     <td class="col-md-3">
-                        <h6><b>HostBindings</b></h6>
+                        <h6><b>Accessors</b></h6>
                     </td>
                     <td class="col-md-9">
                         <ul class="index-list">
                             <li>
-                                <span class="reference-badge reference-badge--property" aria-hidden="true">HB</span><a href="#class" >class</a>
+                                <span class="reference-badge reference-badge--accessor" aria-hidden="true">A</span>
+                                <a href="#cssClasses" >cssClasses</a>
                             </li>
                         </ul>
                     </td>
                 </tr>
             </tbody>
         </table>
+</section>
 
-
-        <table class="table table-sm table-bordered index-table">
+            <section data-compodoc="block-constructor">
+    <h3 id="constructor">Constructor</h3>
+        <table class="table table-sm table-bordered">
             <tbody>
                 <tr>
-                    <td class="col-md-3">
-                        <h6><b>Accessors</b></h6>
-                    </td>
-                    <td class="col-md-9">
-                        <ul class="index-list">
-                            <li>
-                                <span class="reference-badge reference-badge--accessor" aria-hidden="true">A</span>
-                                <a href="#cssClasses" >cssClasses</a>
-                            </li>
-                        </ul>
+                    <td class="col-md-4">
+<code>constructor()</code>
                     </td>
                 </tr>
+
             </tbody>
         </table>
 </section>
 
-
             <section data-compodoc="block-inputs">
     <h3 id="inputs">Inputs</h3>
         <table class="table table-sm table-bordered">
@@ -355,29 +343,6 @@
 </section>
 
 
-            <section data-compodoc="block-properties">
-    <h3>HostBindings</h3>    <table class="table table-sm table-bordered">
-        <tbody>
-            <tr>
-                <td class="col-md-4">
-                    <a name="class"></a>
-                    <span class="name">
-                        <span ><b>class</b></span>
-                        <a href="#class"><span class="icon ion-ios-link"></span></a>
-                    </span>
-                </td>
-            </tr>
-                <tr>
-                    <td class="col-md-4">
-                        <i>Type : </i>        <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
-
-                    </td>
-                </tr>
-
-
-        </tbody>
-    </table>
-</section>
 
 
             <section data-compodoc="block-methods">