@proximus/lavender-mega-dropdown 2.0.0-alpha.17 → 2.0.0-alpha.19

package/dist/index.es.js

@@ -303,9 +303,9 @@ class Xt extends Tt {
     v(this, x);
     v(this, b);
     v(this, $, () => `<svg aria-hidden="true">
-      <use xlink:href="#icon-${this.name}"></use>
+      <use xlink:href=""></use>
     </svg>`);
-    this.shadowRoot.innerHTML = n(this, $).call(this), this.role = "img", A(this, b, (o = this.attachInternals) == null ? void 0 : o.call(this)), n(this, b) && (n(this, b).role = "img");
+    this.shadowRoot.innerHTML = n(this, $).call(this), A(this, b, (o = this.attachInternals) == null ? void 0 : o.call(this)), n(this, b) && (n(this, b).role = "img");
   }
   static get observedAttributes() {
     return [...super.observedAttributes, ...Kt];
@@ -333,6 +333,10 @@ class Xt extends Tt {
       }
   }
   connectedCallback() {
+    this.role = "img", this.name && this.$el.firstElementChild.setAttribute(
+      "xlink:href",
+      `#icon-${this.name}`
+    );
     const e = document.querySelectorAll("px-icon-set");
     e || console.log("<px-icon-set> component not found");
     for (const o of e) {
@@ -1411,8 +1415,8 @@ vt.replaceSync(te);
 class re extends HTMLElement {
   constructor() {
     super(), this.template = () => `
-    <px-container border-radius="none" padding-inline="none" background-color="${this.backgroundColor}">
-      <div class="content-wrapper ${this.$slotOverlap ? "overlapped" : ""}">
+    <px-container border-radius="none" padding-inline="none">
+      <div class="content-wrapper">
         <px-vstack gap="heading-to-content">
           <slot name="heading"></slot>
           <px-vstack gap="none">
@@ -1427,6 +1431,7 @@ class re extends HTMLElement {
   `, this.attachShadow({ mode: "open" }), this.shadowRoot.innerHTML = this.template(), this.shadowRoot.adoptedStyleSheets = [vt];
   }
   connectedCallback() {
+    this.$container.setAttribute("background-color", this.backgroundColor), this.$slotOverlap && this.shadowRoot.firstElementChild.querySelector(".content-wrapper").classList.add("overlapped");
     const t = this.querySelector('[slot="heading"]');
     !this.paddingBlock && !this.paddingTop && !this.paddingBottom && !this.paddingBlockMobile && !this.paddingTopMobile && !this.paddingBottomMobile && !this.paddingBlockTablet && !this.paddingTopTablet && !this.paddingBottomTablet && !this.paddingBlockLaptop && !this.paddingTopLaptop && !this.paddingBottomLaptop && (this.$container.paddingBlock = "none"), t || this.shadowRoot.querySelector("px-vstack").setAttribute("gap", "none");
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@proximus/lavender-mega-dropdown",
-  "version": "2.0.0-alpha.17",
+  "version": "2.0.0-alpha.19",
   "description": "",
   "main": "dist/index.es.js",
   "types": "dist/index.d.ts",