@lukso/web-components 1.172.13 → 1.172.14

package/dist/chunks/{index-D_5wz2k1.js → index-UVrFZqIM.js}

@@ -1,20 +1,23 @@
 'use strict';
 
-const components_luksoProfile_index = require('./index-BAf8Hzhe.js');
-const shared_tailwindElement_index = require('./index-BxQ_0s_1.js');
-const property = require('./property-D6IL6zax.js');
-const state = require('./state-CFjY89m3.js');
-const index = require('./index-CaJky2qL.js');
+const makeBlockie = require('ethereum-blockies-base64');
+const lit = require('lit');
+const decorators_js = require('lit/decorators.js');
+const tailwindVariants = require('tailwind-variants');
 const safeCustomElement = require('./safe-custom-element-tQ-epw6h.js');
 require('../components/lukso-dropdown/index.cjs');
 require('../components/lukso-dropdown-option/index.cjs');
 require('../components/lukso-icon/index.cjs');
 require('../components/lukso-input/index.cjs');
+require('../components/lukso-profile/index.cjs');
 require('../components/lukso-tag/index.cjs');
-const components_luksoUsername_index = require('./index-glHBylgQ.js');
+const components_luksoUsername_index = require('./index-Cy2_2lFt.js');
 require('../components/lukso-tooltip/index.cjs');
+const shared_tailwindElement_index = require('../shared/tailwind-element/index.cjs');
 require('../tailwind-config.cjs');
-require('./axe-MHuN9KU0.js');
+require('./cn-zamUNFMe.js');
+require('viem');
+require('axe-core');
 const uniqId = require('./uniq-id-Cszs24DQ.js');
 
 const style = ":host {\n\n    display: inline-flex\n}\n\n:host([is-full-width]) {\n\n    display: flex;\n\n    width: 100%\n}";
@@ -89,7 +92,7 @@ exports.LuksoSearch = class LuksoSearch extends shared_tailwindElement_index.Tai
     this.withGroupLabels = false;
     this.isDebouncing = false;
     this.resultsParsed = [];
-    this.styles = index.ce({
+    this.styles = tailwindVariants.tv({
       slots: {
         loading: "bg-neutral-95 w-full animate-pulse animation-delay-none"
       },
@@ -197,7 +200,7 @@ exports.LuksoSearch = class LuksoSearch extends shared_tailwindElement_index.Tai
               break;
           }
           resultTemplates.push(
-            shared_tailwindElement_index.x`<div
+            lit.html`<div
               class="${index === 0 ? "mb-1 pb-1" : "my-1 py-1"} text-neutral-35 paragraph-inter-12-medium tracking-wider border-b border-b-neutral-95 text-left"
             >
               ${headerText}
@@ -234,22 +237,22 @@ exports.LuksoSearch = class LuksoSearch extends shared_tailwindElement_index.Tai
           break;
       }
     }
-    return shared_tailwindElement_index.x`<lukso-dropdown
+    return lit.html`<lukso-dropdown
       size=${this.dropdownSize[this.size]}
       is-open=${this.resultsParsed.length > 0}
       is-open-on-outside-click
       is-full-width
-      max-height=${this.maxHeight || shared_tailwindElement_index.E}
+      max-height=${this.maxHeight || lit.nothing}
       >${resultTemplates}</lukso-dropdown
     >`;
   }
   noResultsTemplate() {
-    return shared_tailwindElement_index.x`<lukso-dropdown
+    return lit.html`<lukso-dropdown
       size=${this.dropdownSize[this.size]}
       is-open
       is-open-on-outside-click
       is-full-width
-      >${shared_tailwindElement_index.x`<div class="paragraph-inter-14-semi-bold text-neutral-20 pl-1">
+      >${lit.html`<div class="paragraph-inter-14-semi-bold text-neutral-20 pl-1">
         ${this.noResultsText}
       </div>`}</lukso-dropdown
     >`;
@@ -259,12 +262,12 @@ exports.LuksoSearch = class LuksoSearch extends shared_tailwindElement_index.Tai
       size: this.size
     });
     if (this.showNoResults) {
-      return shared_tailwindElement_index.x`<lukso-dropdown
+      return lit.html`<lukso-dropdown
         size=${this.dropdownSize[this.size]}
         is-open
         is-open-on-outside-click
         is-full-width
-        >${shared_tailwindElement_index.x`
+        >${lit.html`
           <div role="status" class="flex flex-col gap-1">
             <div class=${loading()}></div>
           </div>
@@ -272,33 +275,33 @@ exports.LuksoSearch = class LuksoSearch extends shared_tailwindElement_index.Tai
       >`;
     }
     if (this.resultsParsed.length === 0 || this.resultsParsed.length > 5) {
-      return shared_tailwindElement_index.x`<lukso-dropdown
+      return lit.html`<lukso-dropdown
         size=${this.dropdownSize[this.size]}
         is-open
         is-open-on-outside-click
         is-full-width
-        >${shared_tailwindElement_index.x`
+        >${lit.html`
           <div role="status" class="flex flex-col gap-1">
-            ${[...Array(5)].map(() => shared_tailwindElement_index.x`<div class=${loading()}></div>`)}
+            ${[...Array(5)].map(() => lit.html`<div class=${loading()}></div>`)}
           </div>
         `}</lukso-dropdown
       >`;
     }
-    return shared_tailwindElement_index.x`<lukso-dropdown
+    return lit.html`<lukso-dropdown
       size=${this.dropdownSize[this.size]}
       is-open
       is-open-on-outside-click
       is-full-width
-      >${shared_tailwindElement_index.x`
+      >${lit.html`
         <div role="status" class="flex flex-col gap-1">
-          ${this.resultsParsed.map(() => shared_tailwindElement_index.x`<div class=${loading()}></div>`)}
+          ${this.resultsParsed.map(() => lit.html`<div class=${loading()}></div>`)}
         </div>
       `}</lukso-dropdown
     >`;
   }
   resultStringTemplate(result, index) {
     const dropdownSize = this.size === "large" || this.size === "x-large" ? "medium" : this.size;
-    return shared_tailwindElement_index.x`<lukso-dropdown-option
+    return lit.html`<lukso-dropdown-option
       data-id="${result.id}"
       data-index="${index + 1}"
       ?is-selected=${this.selected === index + 1}
@@ -309,13 +312,13 @@ exports.LuksoSearch = class LuksoSearch extends shared_tailwindElement_index.Tai
     </lukso-dropdown-option>`;
   }
   resultUniversalNameTemplate(result, index) {
-    const tag = shared_tailwindElement_index.x`<lukso-tag
+    const tag = lit.html`<lukso-tag
       is-rounded
       background-color="${result.status ? "green-95" : "neutral-95"}"
       text-color="${result.status ? "green-45" : "neutral-60"}"
       >${!!result.status ? this.availableText : this.unavailableText}</lukso-tag
     >`;
-    return shared_tailwindElement_index.x`<lukso-dropdown-option
+    return lit.html`<lukso-dropdown-option
       data-id="${result.id}"
       data-index="${index + 1}"
       ?is-selected=${this.selected === index + 1}
@@ -329,12 +332,12 @@ exports.LuksoSearch = class LuksoSearch extends shared_tailwindElement_index.Tai
     </lukso-dropdown-option>`;
   }
   resultProfileTemplate(result, index) {
-    const eoaProfilePicture = shared_tailwindElement_index.x`<lukso-profile
+    const eoaProfilePicture = lit.html`<lukso-profile
       profile-address="${result.address}"
-      profile-url="${result.address ? components_luksoProfile_index.makeBlockie(result.address) : ""}"
+      profile-url="${result.address ? makeBlockie(result.address) : ""}"
       size=${this.profileSize[this.size]}
     ></lukso-profile>`;
-    const lsp3ProfilePicture = shared_tailwindElement_index.x`<lukso-profile
+    const lsp3ProfilePicture = lit.html`<lukso-profile
       profile-address="${result.address}"
       profile-url="${result.image}"
       size=${this.profileSize[this.size]}
@@ -342,7 +345,7 @@ exports.LuksoSearch = class LuksoSearch extends shared_tailwindElement_index.Tai
     ></lukso-profile>`;
     const standard = result.standard || STANDARDS.LSP3;
     const profilePicture = standard !== STANDARDS.LSP3 ? eoaProfilePicture : lsp3ProfilePicture;
-    const upProfileUsername = shared_tailwindElement_index.x`<lukso-username
+    const upProfileUsername = lit.html`<lukso-username
       name="${result.name?.toLowerCase() || "anonymous-profile"}"
       address="${result.address}"
       name-color="neutral-20"
@@ -351,7 +354,7 @@ exports.LuksoSearch = class LuksoSearch extends shared_tailwindElement_index.Tai
       ?hide-prefix="${!result.name}"
       class="ml-1"
     ></lukso-username>`;
-    const eoaUsername = shared_tailwindElement_index.x`<lukso-username
+    const eoaUsername = lit.html`<lukso-username
       name="${components_luksoUsername_index.sliceAddress(result.address, 8)}"
       address="__EOA"
       name-color="neutral-20"
@@ -360,7 +363,7 @@ exports.LuksoSearch = class LuksoSearch extends shared_tailwindElement_index.Tai
       hide-prefix
       class="ml-1"
     ></lukso-username>`;
-    const scUsername = shared_tailwindElement_index.x`<lukso-username
+    const scUsername = lit.html`<lukso-username
       name="${components_luksoUsername_index.sliceAddress(result.address, 8)}"
       address=""
       name-color="neutral-20"
@@ -375,7 +378,7 @@ exports.LuksoSearch = class LuksoSearch extends shared_tailwindElement_index.Tai
     } else if (standard === STANDARDS.LSP3) {
       profileName = upProfileUsername;
     }
-    return shared_tailwindElement_index.x`<lukso-dropdown-option
+    return lit.html`<lukso-dropdown-option
       data-id="${result.address}"
       data-index="${index + 1}"
       ?is-selected=${this.selected === index + 1}
@@ -386,7 +389,7 @@ exports.LuksoSearch = class LuksoSearch extends shared_tailwindElement_index.Tai
     </lukso-dropdown-option>`;
   }
   resultAssetTemplate(result, index) {
-    return shared_tailwindElement_index.x`<lukso-dropdown-option
+    return lit.html`<lukso-dropdown-option
       data-id="${result.address}"
       data-index="${index + 1}"
       ?is-selected=${this.selected === index + 1}
@@ -409,7 +412,7 @@ exports.LuksoSearch = class LuksoSearch extends shared_tailwindElement_index.Tai
     </lukso-dropdown-option>`;
   }
   resultAppTemplate(result, index) {
-    return shared_tailwindElement_index.x`<lukso-dropdown-option
+    return lit.html`<lukso-dropdown-option
       data-id="${result.address}"
       data-index="${index + 1}"
       ?is-selected=${this.selected === index + 1}
@@ -431,7 +434,7 @@ exports.LuksoSearch = class LuksoSearch extends shared_tailwindElement_index.Tai
     for (const recentSearch of result.value) {
       switch (recentSearch.type) {
         case SEARCH_RESULT_TYPES.PROFILE: {
-          const eoaProfilePicture = shared_tailwindElement_index.x`<lukso-tooltip
+          const eoaProfilePicture = lit.html`<lukso-tooltip
             show-delay="2000"
             class="flex"
           >
@@ -448,13 +451,13 @@ exports.LuksoSearch = class LuksoSearch extends shared_tailwindElement_index.Tai
             </div>
             <lukso-profile
               profile-address="${recentSearch.address}"
-              profile-url="${recentSearch.address ? components_luksoProfile_index.makeBlockie(recentSearch.address) : ""}"
+              profile-url="${recentSearch.address ? makeBlockie(recentSearch.address) : ""}"
               size=${this.profileSize[this.size]}
               class="cursor-pointer transition hover:scale-[1.02]"
               @click=${() => this.handleSelect(recentSearch)}
             ></lukso-profile
           ></lukso-tooltip>`;
-          const lsp3ProfilePicture = shared_tailwindElement_index.x`<lukso-tooltip
+          const lsp3ProfilePicture = lit.html`<lukso-tooltip
             show-delay="2000"
             class="flex"
           >
@@ -484,7 +487,7 @@ exports.LuksoSearch = class LuksoSearch extends shared_tailwindElement_index.Tai
           break;
         }
         case SEARCH_RESULT_TYPES.ASSET: {
-          const asset = shared_tailwindElement_index.x`<lukso-tooltip show-delay="2000" class="flex">
+          const asset = lit.html`<lukso-tooltip show-delay="2000" class="flex">
             <div slot="text">
               <span class="font-600"
                 >${recentSearch.name}
@@ -506,7 +509,7 @@ exports.LuksoSearch = class LuksoSearch extends shared_tailwindElement_index.Tai
           break;
         }
         case SEARCH_RESULT_TYPES.APP: {
-          const app = shared_tailwindElement_index.x`<lukso-tooltip show-delay="2000" class="flex">
+          const app = lit.html`<lukso-tooltip show-delay="2000" class="flex">
             <div slot="text">
               <span class="font-600">${recentSearch.name}</span>
             </div>
@@ -523,7 +526,7 @@ exports.LuksoSearch = class LuksoSearch extends shared_tailwindElement_index.Tai
         }
       }
     }
-    return shared_tailwindElement_index.x`<div class="flex gap-4 mx-3 my-2">
+    return lit.html`<div class="flex gap-4 mx-3 my-2">
       ${recentSearchTemplates}
     </div>`;
   }
@@ -671,7 +674,7 @@ exports.LuksoSearch = class LuksoSearch extends shared_tailwindElement_index.Tai
     this.searchDebounce(target.value);
   }
   render() {
-    return shared_tailwindElement_index.x`
+    return lit.html`
       <div class="relative w-full">
         <lukso-input
           name=${this.name}
@@ -700,113 +703,113 @@ exports.LuksoSearch = class LuksoSearch extends shared_tailwindElement_index.Tai
           @on-key-up=${this.handleKeyUp}
         ></lukso-input>
         <!-- results dropdown -->
-        ${this.results && !(this.isSearching || this.isDebouncing) ? this.resultsTemplate() : shared_tailwindElement_index.E}
+        ${this.results && !(this.isSearching || this.isDebouncing) ? this.resultsTemplate() : lit.nothing}
         <!-- no results dropdown -->
-        ${this.showNoResults && !(this.isSearching || this.isDebouncing) ? this.noResultsTemplate() : shared_tailwindElement_index.E}
+        ${this.showNoResults && !(this.isSearching || this.isDebouncing) ? this.noResultsTemplate() : lit.nothing}
         <!-- loading dropdown -->
-        ${!this.hideLoading && this.value && (this.isSearching || this.isDebouncing) ? this.loadingTemplate() : shared_tailwindElement_index.E}
+        ${!this.hideLoading && this.value && (this.isSearching || this.isDebouncing) ? this.loadingTemplate() : lit.nothing}
       </div>
     `;
   }
 };
 __decorateClass([
-  property.n({ type: String })
+  decorators_js.property({ type: String })
 ], exports.LuksoSearch.prototype, "value", 2);
 __decorateClass([
-  property.n({ type: String })
+  decorators_js.property({ type: String })
 ], exports.LuksoSearch.prototype, "name", 2);
 __decorateClass([
-  property.n({ type: String })
+  decorators_js.property({ type: String })
 ], exports.LuksoSearch.prototype, "placeholder", 2);
 __decorateClass([
-  property.n({ type: String })
+  decorators_js.property({ type: String })
 ], exports.LuksoSearch.prototype, "label", 2);
 __decorateClass([
-  property.n({ type: String, attribute: "group-labels" })
+  decorators_js.property({ type: String, attribute: "group-labels" })
 ], exports.LuksoSearch.prototype, "groupLabels", 2);
 __decorateClass([
-  property.n({ type: String, attribute: "available-text" })
+  decorators_js.property({ type: String, attribute: "available-text" })
 ], exports.LuksoSearch.prototype, "availableText", 2);
 __decorateClass([
-  property.n({ type: String, attribute: "unavailable-text" })
+  decorators_js.property({ type: String, attribute: "unavailable-text" })
 ], exports.LuksoSearch.prototype, "unavailableText", 2);
 __decorateClass([
-  property.n({ type: String })
+  decorators_js.property({ type: String })
 ], exports.LuksoSearch.prototype, "autocomplete", 2);
 __decorateClass([
-  property.n({ type: String })
+  decorators_js.property({ type: String })
 ], exports.LuksoSearch.prototype, "id", 2);
 __decorateClass([
-  property.n({ type: String })
+  decorators_js.property({ type: String })
 ], exports.LuksoSearch.prototype, "description", 2);
 __decorateClass([
-  property.n({ type: String })
+  decorators_js.property({ type: String })
 ], exports.LuksoSearch.prototype, "error", 2);
 __decorateClass([
-  property.n({ type: String, attribute: "custom-class" })
+  decorators_js.property({ type: String, attribute: "custom-class" })
 ], exports.LuksoSearch.prototype, "customClass", 2);
 __decorateClass([
-  property.n({ type: Boolean, attribute: "is-full-width" })
+  decorators_js.property({ type: Boolean, attribute: "is-full-width" })
 ], exports.LuksoSearch.prototype, "isFullWidth", 2);
 __decorateClass([
-  property.n({ type: Boolean, attribute: "is-readonly" })
+  decorators_js.property({ type: Boolean, attribute: "is-readonly" })
 ], exports.LuksoSearch.prototype, "isReadonly", 2);
 __decorateClass([
-  property.n({ type: Boolean, attribute: "is-disabled" })
+  decorators_js.property({ type: Boolean, attribute: "is-disabled" })
 ], exports.LuksoSearch.prototype, "isDisabled", 2);
 __decorateClass([
-  property.n({ type: Boolean })
+  decorators_js.property({ type: Boolean })
 ], exports.LuksoSearch.prototype, "autofocus", 2);
 __decorateClass([
-  property.n({ type: Boolean })
+  decorators_js.property({ type: Boolean })
 ], exports.LuksoSearch.prototype, "borderless", 2);
 __decorateClass([
-  property.n({ type: String })
+  decorators_js.property({ type: String })
 ], exports.LuksoSearch.prototype, "results", 2);
 __decorateClass([
-  property.n({ type: String, attribute: "right-icon" })
+  decorators_js.property({ type: String, attribute: "right-icon" })
 ], exports.LuksoSearch.prototype, "rightIcon", 2);
 __decorateClass([
-  property.n({ type: Number })
+  decorators_js.property({ type: Number })
 ], exports.LuksoSearch.prototype, "debounce", 2);
 __decorateClass([
-  property.n({ type: Boolean, attribute: "is-searching" })
+  decorators_js.property({ type: Boolean, attribute: "is-searching" })
 ], exports.LuksoSearch.prototype, "isSearching", 2);
 __decorateClass([
-  property.n({ type: String, attribute: "no-results-text" })
+  decorators_js.property({ type: String, attribute: "no-results-text" })
 ], exports.LuksoSearch.prototype, "noResultsText", 2);
 __decorateClass([
-  property.n({ type: Boolean, attribute: "show-no-results" })
+  decorators_js.property({ type: Boolean, attribute: "show-no-results" })
 ], exports.LuksoSearch.prototype, "showNoResults", 2);
 __decorateClass([
-  property.n({ type: Boolean, attribute: "hide-loading" })
+  decorators_js.property({ type: Boolean, attribute: "hide-loading" })
 ], exports.LuksoSearch.prototype, "hideLoading", 2);
 __decorateClass([
-  property.n({ type: Boolean, attribute: "has-reset" })
+  decorators_js.property({ type: Boolean, attribute: "has-reset" })
 ], exports.LuksoSearch.prototype, "hasReset", 2);
 __decorateClass([
-  property.n({ type: Boolean, attribute: "keep-value-on-escape-hit" })
+  decorators_js.property({ type: Boolean, attribute: "keep-value-on-escape-hit" })
 ], exports.LuksoSearch.prototype, "keepValueOnEscapeHit", 2);
 __decorateClass([
-  property.n({ type: Number })
+  decorators_js.property({ type: Number })
 ], exports.LuksoSearch.prototype, "selected", 2);
 __decorateClass([
-  property.n({ type: String })
+  decorators_js.property({ type: String })
 ], exports.LuksoSearch.prototype, "size", 2);
 __decorateClass([
-  property.n({ type: Number, attribute: "max-height" })
+  decorators_js.property({ type: Number, attribute: "max-height" })
 ], exports.LuksoSearch.prototype, "maxHeight", 2);
 __decorateClass([
-  property.n({ type: Boolean, attribute: "with-group-labels" })
+  decorators_js.property({ type: Boolean, attribute: "with-group-labels" })
 ], exports.LuksoSearch.prototype, "withGroupLabels", 2);
 __decorateClass([
-  state.r()
+  decorators_js.state()
 ], exports.LuksoSearch.prototype, "isDebouncing", 2);
 __decorateClass([
-  state.r()
+  decorators_js.state()
 ], exports.LuksoSearch.prototype, "debounceTimer", 2);
 __decorateClass([
-  state.r()
+  decorators_js.state()
 ], exports.LuksoSearch.prototype, "resultsParsed", 2);
 exports.LuksoSearch = __decorateClass([
   safeCustomElement.safeCustomElement("lukso-search")

package/dist/chunks/{index-BHAtoIlu.js → index-cakeic-M.js}

@@ -1,9 +1,10 @@
 'use strict';
 
-const shared_tailwindElement_index = require('./index-BxQ_0s_1.js');
-const property = require('./property-D6IL6zax.js');
-const unsafeHtml = require('./unsafe-html-DiwkOQlV.js');
+const lit = require('lit');
+const decorators_js = require('lit/decorators.js');
+const unsafeHtml_js = require('lit/directives/unsafe-html.js');
 const safeCustomElement = require('./safe-custom-element-tQ-epw6h.js');
+const shared_tailwindElement_index = require('../shared/tailwind-element/index.cjs');
 
 /*! @license DOMPurify 3.2.7 | (c) Cure53 and other contributors | Released under the Apache license 2.0 and Mozilla Public License 2.0 | github.com/cure53/DOMPurify/blob/3.2.7/LICENSE */
 
@@ -1388,19 +1389,19 @@ exports.LuksoSanitize = class LuksoSanitize extends shared_tailwindElement_index
   // in order to show HTML we  need to use unsafeHTML directive.
   // This is safe since we already sanitized content
   render() {
-    return this.isPre ? shared_tailwindElement_index.x`<!-- prettier-ignore -->
+    return this.isPre ? lit.html`<!-- prettier-ignore -->
           <div
-      class='whitespace-pre-wrap'>${unsafeHtml.o(this.sanitize())}</div>` : shared_tailwindElement_index.x`${unsafeHtml.o(this.sanitize())}`;
+      class='whitespace-pre-wrap'>${unsafeHtml_js.unsafeHTML(this.sanitize())}</div>` : lit.html`${unsafeHtml_js.unsafeHTML(this.sanitize())}`;
   }
 };
 __decorateClass([
-  property.n({ type: String, attribute: "html-content" })
+  decorators_js.property({ type: String, attribute: "html-content" })
 ], exports.LuksoSanitize.prototype, "htmlContent", 2);
 __decorateClass([
-  property.n({ type: Boolean, attribute: "is-pre" })
+  decorators_js.property({ type: Boolean, attribute: "is-pre" })
 ], exports.LuksoSanitize.prototype, "isPre", 2);
 __decorateClass([
-  property.n({ type: Boolean, attribute: "strip-html-tags" })
+  decorators_js.property({ type: Boolean, attribute: "strip-html-tags" })
 ], exports.LuksoSanitize.prototype, "stripHtmlTags", 2);
 exports.LuksoSanitize = __decorateClass([
   safeCustomElement.safeCustomElement("lukso-sanitize")

package/dist/chunks/{style-map-B7XFhSOK.js → style-map-AEeBQfPb.js}

@@ -1,12 +1,11 @@
 'use strict';
 
-const shared_tailwindElement_index = require('./index-BxQ_0s_1.js');
-const directive = require('./directive-DT5Y-Nw0.js');
+const directive = require('./directive-CY66atYi.js');
 
 /**
  * @license
  * Copyright 2018 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
- */const n="important",i=" !"+n,o=directive.e(class extends directive.i{constructor(t){if(super(t),t.type!==directive.t.ATTRIBUTE||"style"!==t.name||t.strings?.length>2)throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.")}render(t){return Object.keys(t).reduce(((e,r)=>{const s=t[r];return null==s?e:e+`${r=r.includes("-")?r:r.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g,"-$&").toLowerCase()}:${s};`}),"")}update(e,[r]){const{style:s}=e.element;if(void 0===this.ft)return this.ft=new Set(Object.keys(r)),this.render(r);for(const t of this.ft)null==r[t]&&(this.ft.delete(t),t.includes("-")?s.removeProperty(t):s[t]=null);for(const t in r){const e=r[t];if(null!=e){this.ft.add(t);const r="string"==typeof e&&e.endsWith(i);t.includes("-")||r?s.setProperty(t,r?e.slice(0,-11):e,r?n:""):s[t]=e;}}return shared_tailwindElement_index.T}});
+ */const n="important",i=" !"+n,o=directive.e(class extends directive.i{constructor(t){if(super(t),t.type!==directive.t.ATTRIBUTE||"style"!==t.name||t.strings?.length>2)throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.")}render(t){return Object.keys(t).reduce(((e,r)=>{const s=t[r];return null==s?e:e+`${r=r.includes("-")?r:r.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g,"-$&").toLowerCase()}:${s};`}),"")}update(e,[r]){const{style:s}=e.element;if(void 0===this.ft)return this.ft=new Set(Object.keys(r)),this.render(r);for(const t of this.ft)null==r[t]&&(this.ft.delete(t),t.includes("-")?s.removeProperty(t):s[t]=null);for(const t in r){const e=r[t];if(null!=e){this.ft.add(t);const r="string"==typeof e&&e.endsWith(i);t.includes("-")||r?s.setProperty(t,r?e.slice(0,-11):e,r?n:""):s[t]=e;}}return directive.T}});
 
 exports.o = o;

package/dist/chunks/{style-map-BPljJihp.js → style-map-auscxO0L.js}

@@ -1,5 +1,4 @@
-import { a as T } from './index-5X9ujrWL.js';
-import { e, i as i$1, t } from './directive-BKuZRRPO.js';
+import { e, i as i$1, t, T } from './directive-DUHAbymA.js';
 
 /**
  * @license

package/dist/components/index.cjs

@@ -22,13 +22,13 @@ const components_luksoMarkdownEditor_index = require('./lukso-markdown-editor/in
 const components_luksoModal_index = require('./lukso-modal/index.cjs');
 const components_luksoNavbar_index = require('./lukso-navbar/index.cjs');
 const components_luksoPagination_index = require('./lukso-pagination/index.cjs');
-const components_luksoProfile_index = require('../chunks/index-BAf8Hzhe.js');
+const components_luksoProfile_index = require('./lukso-profile/index.cjs');
 const components_luksoProgress_index = require('./lukso-progress/index.cjs');
 const components_luksoQrCode_index = require('./lukso-qr-code/index.cjs');
 const components_luksoRadio_index = require('./lukso-radio/index.cjs');
 const components_luksoRadioGroup_index = require('./lukso-radio-group/index.cjs');
-const components_luksoSanitize_index = require('../chunks/index-BHAtoIlu.js');
-const components_luksoSearch_index = require('../chunks/index-D_5wz2k1.js');
+const components_luksoSanitize_index = require('../chunks/index-cakeic-M.js');
+const components_luksoSearch_index = require('../chunks/index-UVrFZqIM.js');
 const components_luksoSelect_index = require('./lukso-select/index.cjs');
 const components_luksoShare_index = require('./lukso-share/index.cjs');
 const components_luksoSwitch_index = require('./lukso-switch/index.cjs');
@@ -36,9 +36,8 @@ const components_luksoTag_index = require('./lukso-tag/index.cjs');
 const components_luksoTerms_index = require('./lukso-terms/index.cjs');
 const components_luksoTextarea_index = require('./lukso-textarea/index.cjs');
 const components_luksoTooltip_index = require('./lukso-tooltip/index.cjs');
-const components_luksoUsername_index = require('../chunks/index-glHBylgQ.js');
+const components_luksoUsername_index = require('../chunks/index-Cy2_2lFt.js');
 const components_luksoWizard_index = require('./lukso-wizard/index.cjs');
-require('../chunks/axe-MHuN9KU0.js');
 
 
 

package/dist/components/index.js

@@ -18,13 +18,13 @@ export { LuksoMarkdownEditor } from './lukso-markdown-editor/index.js';
 export { LuksoModal } from './lukso-modal/index.js';
 export { LuksoNavbar } from './lukso-navbar/index.js';
 export { LuksoPagination } from './lukso-pagination/index.js';
-export { L as LuksoProfile } from '../chunks/index-BDyLu6M0.js';
+export { LuksoProfile } from './lukso-profile/index.js';
 export { LuksoProgress } from './lukso-progress/index.js';
 export { LuksoQrCode } from './lukso-qr-code/index.js';
 export { LuksoRadio } from './lukso-radio/index.js';
 export { LuksoRadioGroup } from './lukso-radio-group/index.js';
-export { D as DEFAULT_OPTIONS, L as LuksoSanitize, N as NO_HTML_TAGS_OPTIONS } from '../chunks/index-B_H2eYG_.js';
-export { L as LuksoSearch } from '../chunks/index-Dn2DJhID.js';
+export { D as DEFAULT_OPTIONS, L as LuksoSanitize, N as NO_HTML_TAGS_OPTIONS } from '../chunks/index-CA6SrfZ-.js';
+export { L as LuksoSearch } from '../chunks/index-Ds-r8fCt.js';
 export { LuksoSelect } from './lukso-select/index.js';
 export { LuksoShare } from './lukso-share/index.js';
 export { LuksoSwitch } from './lukso-switch/index.js';
@@ -32,6 +32,5 @@ export { LuksoTag } from './lukso-tag/index.js';
 export { LuksoTerms } from './lukso-terms/index.js';
 export { LuksoTextarea } from './lukso-textarea/index.js';
 export { LuksoTooltip } from './lukso-tooltip/index.js';
-export { L as LuksoUsername } from '../chunks/index-BBFSnMaE.js';
+export { L as LuksoUsername } from '../chunks/index-BNt_JinF.js';
 export { LuksoWizard } from './lukso-wizard/index.js';
-import '../chunks/axe-DJKac19y.js';

package/dist/components/lukso-alert/index.cjs

@@ -2,12 +2,13 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const shared_tailwindElement_index = require('../../chunks/index-BxQ_0s_1.js');
-const property = require('../../chunks/property-D6IL6zax.js');
-const index = require('../../chunks/index-CaJky2qL.js');
+const lit = require('lit');
+const decorators_js = require('lit/decorators.js');
+const tailwindVariants = require('tailwind-variants');
 const safeCustomElement = require('../../chunks/safe-custom-element-tQ-epw6h.js');
+const shared_tailwindElement_index = require('../../shared/tailwind-element/index.cjs');
 require('../lukso-icon/index.cjs');
-require('../../chunks/index-BHAtoIlu.js');
+require('../../chunks/index-cakeic-M.js');
 
 const style = ":host {\n    display: flex\n}";
 
@@ -28,7 +29,7 @@ exports.LuksoAlert = class LuksoAlert extends shared_tailwindElement_index.Tailw
     this.hasIcon = false;
     this.title = "";
     this.description = "";
-    this.styles = index.ce({
+    this.styles = tailwindVariants.tv({
       base: "rounded-8 p-4 flex gap-3 items-center",
       variants: {
         variant: {
@@ -56,35 +57,35 @@ exports.LuksoAlert = class LuksoAlert extends shared_tailwindElement_index.Tailw
     const styles = this.styles({
       variant: this.variant
     });
-    return shared_tailwindElement_index.x`
+    return lit.html`
       <div class=${styles}>
-        ${this.hasIcon ? shared_tailwindElement_index.x`<lukso-icon
+        ${this.hasIcon ? lit.html`<lukso-icon
               pack="vuesax"
               name="${this.icon.name}"
               color="${this.icon.color}"
-            ></lukso-icon>` : shared_tailwindElement_index.E}
+            ></lukso-icon>` : lit.nothing}
         <div class="flex flex-col gap-1">
-          ${this.title ? shared_tailwindElement_index.x`<div class="heading-inter-14-bold">${this.title}</div>` : shared_tailwindElement_index.E}
-          ${this.description ? shared_tailwindElement_index.x`<lukso-sanitize
+          ${this.title ? lit.html`<div class="heading-inter-14-bold">${this.title}</div>` : lit.nothing}
+          ${this.description ? lit.html`<lukso-sanitize
                 class="paragraph-inter-12-regular"
                 html-content="${this.description}"
-              ></lukso-sanitize>` : shared_tailwindElement_index.E}
+              ></lukso-sanitize>` : lit.nothing}
         </div>
       </div>
     `;
   }
 };
 __decorateClass([
-  property.n({ type: String })
+  decorators_js.property({ type: String })
 ], exports.LuksoAlert.prototype, "variant", 2);
 __decorateClass([
-  property.n({ type: Boolean, attribute: "has-icon", reflect: true })
+  decorators_js.property({ type: Boolean, attribute: "has-icon", reflect: true })
 ], exports.LuksoAlert.prototype, "hasIcon", 2);
 __decorateClass([
-  property.n({ type: String })
+  decorators_js.property({ type: String })
 ], exports.LuksoAlert.prototype, "title", 2);
 __decorateClass([
-  property.n({ type: String })
+  decorators_js.property({ type: String })
 ], exports.LuksoAlert.prototype, "description", 2);
 exports.LuksoAlert = __decorateClass([
   safeCustomElement.safeCustomElement("lukso-alert")