@eui/ecl 22.0.0-alpha.2 → 22.0.0-alpha.21

package/docs/components/EclMegaMenuSubitemComponent.html

@@ -174,6 +174,10 @@
 
 
 
+            <tr>
+                <td class="col-md-3">host</td>
+                <td class="col-md-9"><code>{<br>}</code></td>
+            </tr>
 
 
 
@@ -453,25 +457,6 @@
             </tbody>
         </table>
 
-        <table class="table table-sm table-bordered index-table">
-            <tbody>
-                <tr>
-                    <td class="col-md-3">
-                        <h6><b>HostBindings</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>
-                            </li>
-                            <li>
-                                <span class="reference-badge reference-badge--property" aria-hidden="true">HB</span><a href="#style.display" >style.display</a>
-                            </li>
-                        </ul>
-                    </td>
-                </tr>
-            </tbody>
-        </table>
 
 
         <table class="table table-sm table-bordered index-table">
@@ -864,55 +849,6 @@
         </table>
 </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>
-    <table class="table table-sm table-bordered">
-        <tbody>
-            <tr>
-                <td class="col-md-4">
-                    <a name="style.display"></a>
-                    <span class="name">
-                        <span ><b>style.display</b></span>
-                        <a href="#style.display"><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>
-                <tr>
-                    <td class="col-md-4">
-                        <i>Default value : </i><code>&#x27;&#x27;</code>
-                    </td>
-                </tr>
-
-
-        </tbody>
-    </table>
-</section>
 
 
     <section data-compodoc="block-methods">

package/docs/components/EclMenuItemComponent.html

@@ -516,6 +516,10 @@
                                 <span class="reference-badge reference-badge--accessor" aria-hidden="true">A</span>
                                 <a href="#ariaCurrent" >ariaCurrent</a>
                             </li>
+                            <li>
+                                <span class="reference-badge reference-badge--accessor" aria-hidden="true">A</span>
+                                <a href="#hasCurrentChild" >hasCurrentChild</a>
+                            </li>
                             <li>
                                 <span class="reference-badge reference-badge--accessor" aria-hidden="true">A</span>
                                 <a href="#hasChildren" >hasChildren</a>
@@ -1986,6 +1990,48 @@ Depends on the &#39;maxLines&#39; property of the parent menu component.</p>
                         <span class="accessor"><b>get</b><code>ariaCurrent()</code></span>
                     </td>
                 </tr>
+                    <tr>
+                        <td class="col-md-4">
+                                <div class="io-description"><p>&#39;aria-current&#39; is set to &#39;page&#39; only when this item itself is the current page, and not when it is
+marked current merely because one of its children is the active item (in that case the child link
+carries &#39;aria-current=&quot;page&quot;&#39;). Derived from live state so it stays correct whether &#39;isCurrent&#39; is set
+at render time or updated on selection.</p>
+</div>
+
+                                <div class="io-description">
+                                    <b>Returns : </b>    <code>string | null</code>
+
+                                </div>
+                        </td>
+                    </tr>
+
+            </tbody>
+        </table>
+        <table class="table table-sm table-bordered">
+            <tbody>
+                <tr>
+                    <td class="col-md-4">
+                        <a name="hasCurrentChild"></a>
+                        <span class="name"><b>hasCurrentChild</b><a href="#hasCurrentChild"><span class="icon ion-ios-link"></span></a></span>
+                    </td>
+                </tr>
+
+                <tr>
+                    <td class="col-md-4">
+                        <span class="accessor"><b>get</b><code>hasCurrentChild()</code></span>
+                    </td>
+                </tr>
+                    <tr>
+                        <td class="col-md-4">
+                                <div class="io-description"><p>Whether any child (sub-item) is the current item.</p>
+</div>
+
+                                <div class="io-description">
+                                    <b>Returns : </b>        <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/boolean" target="_blank" >boolean</a></code>
+
+                                </div>
+                        </td>
+                    </tr>
 
             </tbody>
         </table>

package/docs/components/EclModalBodyComponent.html

@@ -169,6 +169,10 @@
 
 
 
+            <tr>
+                <td class="col-md-3">host</td>
+                <td class="col-md-9"><code>{<br>}</code></td>
+            </tr>
 
 
 
@@ -285,22 +289,6 @@
         </table>
 
 
-        <table class="table table-sm table-bordered index-table">
-            <tbody>
-                <tr>
-                    <td class="col-md-3">
-                        <h6><b>HostBindings</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>
-                            </li>
-                        </ul>
-                    </td>
-                </tr>
-            </tbody>
-        </table>
 
 
         <table class="table table-sm table-bordered index-table">
@@ -376,35 +364,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>
-
-            <tr>
-                <td class="col-md-4">
-                    <div class="io-description"><p>Applies CSS classes for the modal body and scrollable modifier if enabled.</p>
-</div>
-                </td>
-            </tr>
-
-        </tbody>
-    </table>
-</section>
 
 
     <section data-compodoc="block-methods">

package/docs/components/EclModalComponent.html

@@ -162,6 +162,10 @@
 
 
 
+            <tr>
+                <td class="col-md-3">host</td>
+                <td class="col-md-9"><code>{<br>}</code></td>
+            </tr>
 
 
 
@@ -279,7 +283,6 @@
                             </li>
                             <li>
                                 <span class="reference-badge reference-badge--method" aria-hidden="true">M</span>
-                                    <span class="modifier"></span>
                                 <a href="#onEscapeKeydownHandler" >onEscapeKeydownHandler</a>
                             </li>
                             <li>
@@ -345,45 +348,7 @@
             </tbody>
         </table>
 
-        <table class="table table-sm table-bordered index-table">
-            <tbody>
-                <tr>
-                    <td class="col-md-3">
-                        <h6><b>HostBindings</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="#attr.aria-describedby" >attr.aria-describedby</a>
-                            </li>
-                            <li>
-                                <span class="reference-badge reference-badge--property" aria-hidden="true">HB</span><a href="#attr.open" >attr.open</a>
-                            </li>
-                            <li>
-                                <span class="reference-badge reference-badge--property" aria-hidden="true">HB</span><a href="#class" >class</a>
-                            </li>
-                        </ul>
-                    </td>
-                </tr>
-            </tbody>
-        </table>
 
-        <table class="table table-sm table-bordered index-table">
-            <tbody>
-                <tr>
-                    <td class="col-md-3">
-                        <h6><b>HostListeners</b></h6>
-                    </td>
-                    <td class="col-md-9">
-                        <ul class="index-list">
-                            <li>
-                                <span class="reference-badge reference-badge--method" aria-hidden="true">HL</span><a href="#document:keydown.escape" >document:keydown.escape</a>
-                            </li>
-                        </ul>
-                    </td>
-                </tr>
-            </tbody>
-        </table>
 
         <table class="table table-sm table-bordered index-table">
             <tbody>
@@ -412,19 +377,6 @@
         </table>
 </section>
 
-    <section data-compodoc="block-constructor">
-    <h3 id="constructor">Constructor</h3>
-        <table class="table table-sm table-bordered">
-            <tbody>
-                <tr>
-                    <td class="col-md-4">
-<code>constructor()</code>
-                    </td>
-                </tr>
-
-            </tbody>
-        </table>
-</section>
 
     <section data-compodoc="block-inputs">
     <h3 id="inputs">Inputs</h3>
@@ -579,123 +531,7 @@ Carries an instance of <code>EclModalOpenEvent</code>.</p>
         </table>
 </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="attr.aria-describedby"></a>
-                    <span class="name">
-                        <span ><b>attr.aria-describedby</b></span>
-                        <a href="#attr.aria-describedby"><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>
 
-            <tr>
-                <td class="col-md-4">
-                    <div class="io-description"><p>Binds the <code>aria-describedby</code> attribute to the modal element.
-Connects the dialog with the modal body via its unique ID for accessibility.</p>
-</div>
-                </td>
-            </tr>
-
-        </tbody>
-    </table>
-    <table class="table table-sm table-bordered">
-        <tbody>
-            <tr>
-                <td class="col-md-4">
-                    <a name="attr.open"></a>
-                    <span class="name">
-                        <span ><b>attr.open</b></span>
-                        <a href="#attr.open"><span class="icon ion-ios-link"></span></a>
-                    </span>
-                </td>
-            </tr>
-                <tr>
-                    <td class="col-md-4">
-                        <i>Type : </i>    <code>boolean | null</code>
-
-                    </td>
-                </tr>
-
-            <tr>
-                <td class="col-md-4">
-                    <div class="io-description"><p>Binds the <code>open</code> attribute to the modal element.
-Used by the native <code>&lt;dialog&gt;</code> element.</p>
-</div>
-                </td>
-            </tr>
-
-        </tbody>
-    </table>
-    <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>
-
-            <tr>
-                <td class="col-md-4">
-                    <div class="io-description"><p>Applies base and variant CSS classes to the modal element.</p>
-</div>
-                </td>
-            </tr>
-
-        </tbody>
-    </table>
-</section>
-
-    <section data-compodoc="block-methods">
-    <h3>HostListeners</h3>    <table class="table table-sm table-bordered">
-        <tbody>
-            <tr>
-                <td class="col-md-4">
-                    <a name="document:keydown.escape"></a>
-                    <span class="name">
-                        <span ><b>document:keydown.escape</b></span>
-                        <a href="#document:keydown.escape"><span class="icon ion-ios-link"></span></a>
-                    </span>
-                </td>
-            </tr>
-            <tr>
-                <td class="col-md-4">
-<code>document:keydown.escape()</code>
-                </td>
-            </tr>
-
-
-
-
-            <tr>
-                <td class="col-md-4">
-                        <div class="io-description"><p>Handles ESC key press to close the modal with <code>cancel</code> role.</p>
-</div>
-
-                </td>
-            </tr>
-        </tbody>
-    </table>
-</section>
 
     <section data-compodoc="block-methods">
     
@@ -772,7 +608,6 @@ If the event is not prevented, the modal will be hidden.</p>
                 <td class="col-md-4">
                     <a name="onEscapeKeydownHandler"></a>
                     <span class="name">
-                            <span class="modifier"></span>
                         <span ><b>onEscapeKeydownHandler</b></span>
                         <a href="#onEscapeKeydownHandler"><span class="icon ion-ios-link"></span></a>
                     </span>
@@ -780,18 +615,10 @@ If the event is not prevented, the modal will be hidden.</p>
             </tr>
             <tr>
                 <td class="col-md-4">
-                        <span class="modifier-icon icon ion-ios-reset"></span>
-                    <code>onEscapeKeydownHandler()</code>
+<code>onEscapeKeydownHandler()</code>
                 </td>
             </tr>
 
-            <tr>
-                <td class="col-md-4">
-                    <b>Decorators : </b>
-                    <br />
-                    <code>@HostListener(&#x27;document:keydown.escape&#x27;)<br /></code>
-                </td>
-            </tr>
 
 
 

package/docs/components/EclModalFooterComponent.html

@@ -175,6 +175,10 @@
 
 
 
+            <tr>
+                <td class="col-md-3">host</td>
+                <td class="col-md-9"><code>{<br>}</code></td>
+            </tr>
 
 
 
@@ -294,22 +298,6 @@
         </table>
 
 
-        <table class="table table-sm table-bordered index-table">
-            <tbody>
-                <tr>
-                    <td class="col-md-3">
-                        <h6><b>HostBindings</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>
-                            </li>
-                        </ul>
-                    </td>
-                </tr>
-            </tbody>
-        </table>
 
 
         <table class="table table-sm table-bordered index-table">
@@ -385,35 +373,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>
-
-            <tr>
-                <td class="col-md-4">
-                    <div class="io-description"><p>Applies the ECL CSS class for modal footer container.</p>
-</div>
-                </td>
-            </tr>
-
-        </tbody>
-    </table>
-</section>
 
 
     <section data-compodoc="block-methods">

package/docs/components/EclModalHeaderComponent.html

@@ -170,6 +170,10 @@ and a close button that emits a close event.</p>
 
 
 
+            <tr>
+                <td class="col-md-3">host</td>
+                <td class="col-md-9"><code>{<br>}</code></td>
+            </tr>
 
 
 
@@ -258,10 +262,6 @@ and a close button that emits a close event.</p>
                                 <span class="reference-badge reference-badge--property" aria-hidden="true">P</span>
                                 <a href="#closeButton" >closeButton</a>
                             </li>
-                            <li>
-                                <span class="reference-badge reference-badge--property" aria-hidden="true">P</span>
-                                <a href="#eclThemeService" >eclThemeService</a>
-                            </li>
                             <li>
                                 <span class="reference-badge reference-badge--property" aria-hidden="true">P</span>
                                 <a href="#variant" >variant</a>
@@ -338,22 +338,6 @@ and a close button that emits a close event.</p>
             </tbody>
         </table>
 
-        <table class="table table-sm table-bordered index-table">
-            <tbody>
-                <tr>
-                    <td class="col-md-3">
-                        <h6><b>HostBindings</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>
-                            </li>
-                        </ul>
-                    </td>
-                </tr>
-            </tbody>
-        </table>
 
 
         <table class="table table-sm table-bordered index-table">
@@ -455,35 +439,6 @@ Emits an <code>EclModalCloseEvent</code> object.</p>
         </table>
 </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>
-
-            <tr>
-                <td class="col-md-4">
-                    <div class="io-description"><p>Applies the ECL CSS class for modal header container.</p>
-</div>
-                </td>
-            </tr>
-
-        </tbody>
-    </table>
-</section>
 
 
     <section data-compodoc="block-methods">
@@ -662,32 +617,6 @@ Emits a <code>modalClose</code> event with no payload.</p>
 
         </tbody>
     </table>
-    <table class="table table-sm table-bordered">
-        <tbody>
-            <tr>
-                <td class="col-md-4">
-                    <a name="eclThemeService"></a>
-                    <span class="name">
-                        <span ><b>eclThemeService</b></span>
-                        <a href="#eclThemeService"><span class="icon ion-ios-link"></span></a>
-                    </span>
-                </td>
-            </tr>
-                <tr>
-                    <td class="col-md-4">
-                        <i>Type : </i>    <code>unknown</code>
-
-                    </td>
-                </tr>
-                <tr>
-                    <td class="col-md-4">
-                        <i>Default value : </i><code>inject(EclThemeService)</code>
-                    </td>
-                </tr>
-
-
-        </tbody>
-    </table>
     <table class="table table-sm table-bordered">
         <tbody>
             <tr>
@@ -707,7 +636,9 @@ Emits a <code>modalClose</code> event with no payload.</p>
                 </tr>
                 <tr>
                     <td class="col-md-4">
-                        <i>Default value : </i><code>signal&lt;&#x27;information&#x27; | &#x27;success&#x27; | &#x27;warning&#x27; | &#x27;error&#x27; | string&gt;(undefined)</code>
+                        <i>Default value : </i><code>computed&lt;&#x27;information&#x27; | &#x27;success&#x27; | &#x27;warning&#x27; | &#x27;error&#x27; | string | undefined&gt;(
+        () &#x3D;&gt; this.modal.variant(),
+    )</code>
                     </td>
                 </tr>
 
@@ -715,6 +646,8 @@ Emits a <code>modalClose</code> event with no payload.</p>
                 <td class="col-md-4">
                     <div class="io-description"><p>Defines the visual variant of the modal.
 Determines which icon is shown in the header.
+Derived reactively from the parent modal&#39;s <code>variant</code> input, so the header
+icon updates automatically when the parent variant changes at runtime.
 Possible values: &#39;information&#39;, &#39;success&#39;, &#39;warning&#39;, &#39;error&#39;, or any custom string.</p>
 </div>
                 </td>