@descope/web-components-ui 1.26.0 → 1.27.0

package/dist/index.esm.js

@@ -2345,6 +2345,15 @@ class RawIcon extends createBaseClass$1({ componentName: componentName$1b, baseS
 	`;
   }
 
+  init() {
+    super.init?.();
+    this.toggleVisibility(this.src);
+  }
+
+  toggleVisibility(isVisible) {
+    this.style.display = isVisible ? '' : 'none';
+  }
+
   get src() {
     return this.getAttribute('src');
   }
@@ -2370,6 +2379,8 @@ class RawIcon extends createBaseClass$1({ componentName: componentName$1b, baseS
     if (oldValue === newValue) return;
 
     if (attrName === 'src') {
+      this.toggleVisibility(newValue);
+
       createIcon(this.src).then((res) => {
         this.innerHTML = '';
         if (res) {
@@ -5330,8 +5341,6 @@ const ComboBoxClass = compose(
 
 customElements.define(componentName$13, ComboBoxClass);
 
-customElements.define(componentName$1b, IconClass);
-
 const SUPPORTED_FORMATS = ['MM/DD/YYYY', 'DD/MM/YYYY', 'YYYY/MM/DD'];
 
 const DEFAULT_FORMAT = SUPPORTED_FORMATS[0];
@@ -5735,11 +5744,9 @@ class RawCalendar extends BaseInputClass$b {
     <div>
       <nav class="nav top-nav">
         <div class="nav-prev">
-          <descope-icon></descope-icon>
         </div>
         <div class="selectors"></div>
         <div class="nav-next">
-          <descope-icon></descope-icon>
         </div>
       </nav>
       <div class="calendar"></div>
@@ -5867,8 +5874,8 @@ class RawCalendar extends BaseInputClass$b {
       })
     );
 
-    this.shadowRoot.querySelector('.nav-next descope-icon').innerHTML = arrowRightIcon;
-    this.shadowRoot.querySelector('.nav-prev descope-icon').innerHTML = arrowLeftIcon;
+    this.shadowRoot.querySelector('.nav-next').innerHTML = arrowRightIcon;
+    this.shadowRoot.querySelector('.nav-prev').innerHTML = arrowLeftIcon;
   }
 
   onSubmit() {
@@ -6751,7 +6758,7 @@ class RawDateFieldClass extends BaseInputClass$a {
     <div>
       <descope-text-field>
         <span slot="suffix" class="toggle-calendar">
-          <descope-icon>${calendarIcon}</descope-icon>
+          ${calendarIcon}
         </span>
       </descope-text-field>
       <vaadin-popover></vaadin-popover>
@@ -14877,6 +14884,8 @@ const NotificationClass = compose$1(
 
 customElements.define(componentName$p, NotificationClass);
 
+customElements.define(componentName$1b, IconClass);
+
 const componentName$o = getComponentName$1('mappings-field-internal');
 
 const BaseInputClass$4 = createBaseInputClass$1({ componentName: componentName$o, baseSelector: 'div' });