@lukso/web-components 1.172.13 → 1.172.14

package/dist/components/lukso-color-picker/index.js

@@ -1,13 +1,15 @@
-import { b as TailwindStyledElement, E, x } from '../../chunks/index-5X9ujrWL.js';
-import { n } from '../../chunks/property-DfumgIL6.js';
-import { r } from '../../chunks/state-CaelFSbE.js';
-import { c as ce } from '../../chunks/index-B9iart53.js';
-import { o } from '../../chunks/style-map-BPljJihp.js';
+import { nothing, html } from 'lit';
+import { property, state } from 'lit/decorators.js';
+import { tv } from 'tailwind-variants';
+import { o } from '../../chunks/style-map-auscxO0L.js';
 import { s as safeCustomElement } from '../../chunks/safe-custom-element-qdGIR_v6.js';
+import { TailwindStyledElement } from '../../shared/tailwind-element/index.js';
 import '../../tailwind-config.js';
-import { c as cn } from '../../chunks/axe-DJKac19y.js';
+import { c as cn } from '../../chunks/cn-LM_JlZIN.js';
+import 'viem';
+import 'axe-core';
 import '../lukso-icon/index.js';
-import '../../chunks/index-B_H2eYG_.js';
+import '../../chunks/index-CA6SrfZ-.js';
 import '../lukso-form-label/index.js';
 import '../lukso-form-description/index.js';
 import '../lukso-form-error/index.js';
@@ -44,7 +46,7 @@ let LuksoColorPicker = class extends TailwindStyledElement(style) {
     this.size = "medium";
     this.hasFocus = false;
     this.hasHighlight = false;
-    this.styles = ce({
+    this.styles = tv({
       slots: {
         wrapper: "group grid border overflow-hidden",
         input: `bg-neutral-100 border-solid placeholder:text-neutral-70 w-full
@@ -152,15 +154,15 @@ let LuksoColorPicker = class extends TailwindStyledElement(style) {
     }
   }
   inputTemplate(styles) {
-    return x`
+    return html`
       <input
         .value=${this.value}
-        name=${this.name ? this.name : E}
+        name=${this.name ? this.name : nothing}
         type="text"
-        placeholder=${this.placeholder ? this.placeholder : E}
+        placeholder=${this.placeholder ? this.placeholder : nothing}
         ?autofocus=${this.autofocus}
         autocomplete="off"
-        id=${this.id ? this.id : E}
+        id=${this.id ? this.id : nothing}
         data-testid=${this.name ? `input-${this.name}` : "input"}
         ?readonly=${this.isReadonly ? true : void 0}
         ?disabled=${this.isDisabled ? true : void 0}
@@ -175,7 +177,7 @@ let LuksoColorPicker = class extends TailwindStyledElement(style) {
     `;
   }
   colorPickerTemplate(styles, colorInputStyles) {
-    return x`<div
+    return html`<div
       class=${styles}
       style=${o({
       backgroundColor: `${this.value}`
@@ -276,7 +278,7 @@ let LuksoColorPicker = class extends TailwindStyledElement(style) {
       isFullWidth: this.isFullWidth,
       size: this.size
     });
-    return x`
+    return html`
       <div class="w-[inherit]">
         <lukso-form-label
           for-name=${this.name}
@@ -295,52 +297,52 @@ let LuksoColorPicker = class extends TailwindStyledElement(style) {
   }
 };
 __decorateClass([
-  n({ type: String })
+  property({ type: String })
 ], LuksoColorPicker.prototype, "value", 2);
 __decorateClass([
-  n({ type: String })
+  property({ type: String })
 ], LuksoColorPicker.prototype, "name", 2);
 __decorateClass([
-  n({ type: String })
+  property({ type: String })
 ], LuksoColorPicker.prototype, "placeholder", 2);
 __decorateClass([
-  n({ type: String })
+  property({ type: String })
 ], LuksoColorPicker.prototype, "label", 2);
 __decorateClass([
-  n({ type: String })
+  property({ type: String })
 ], LuksoColorPicker.prototype, "id", 2);
 __decorateClass([
-  n({ type: String })
+  property({ type: String })
 ], LuksoColorPicker.prototype, "description", 2);
 __decorateClass([
-  n({ type: String })
+  property({ type: String })
 ], LuksoColorPicker.prototype, "error", 2);
 __decorateClass([
-  n({ type: String, attribute: "custom-class" })
+  property({ type: String, attribute: "custom-class" })
 ], LuksoColorPicker.prototype, "customClass", 2);
 __decorateClass([
-  n({ type: Boolean, attribute: "is-full-width" })
+  property({ type: Boolean, attribute: "is-full-width" })
 ], LuksoColorPicker.prototype, "isFullWidth", 2);
 __decorateClass([
-  n({ type: Boolean, attribute: "is-readonly" })
+  property({ type: Boolean, attribute: "is-readonly" })
 ], LuksoColorPicker.prototype, "isReadonly", 2);
 __decorateClass([
-  n({ type: Boolean, attribute: "is-disabled" })
+  property({ type: Boolean, attribute: "is-disabled" })
 ], LuksoColorPicker.prototype, "isDisabled", 2);
 __decorateClass([
-  n({ type: Boolean })
+  property({ type: Boolean })
 ], LuksoColorPicker.prototype, "autofocus", 2);
 __decorateClass([
-  n({ type: Boolean, attribute: "keep-focus-on-escape" })
+  property({ type: Boolean, attribute: "keep-focus-on-escape" })
 ], LuksoColorPicker.prototype, "keepFocusOnEscape", 2);
 __decorateClass([
-  n({ type: String })
+  property({ type: String })
 ], LuksoColorPicker.prototype, "size", 2);
 __decorateClass([
-  r()
+  state()
 ], LuksoColorPicker.prototype, "hasFocus", 2);
 __decorateClass([
-  r()
+  state()
 ], LuksoColorPicker.prototype, "hasHighlight", 2);
 LuksoColorPicker = __decorateClass([
   safeCustomElement("lukso-color-picker")

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

@@ -2,13 +2,14 @@
 
 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');
 require('../lukso-icon/index.cjs');
-require('../../chunks/index-BAf8Hzhe.js');
-require('../../chunks/index-glHBylgQ.js');
+require('../lukso-profile/index.cjs');
+require('../../chunks/index-Cy2_2lFt.js');
+const shared_tailwindElement_index = require('../../shared/tailwind-element/index.cjs');
 const uniqId = require('../../chunks/uniq-id-Cszs24DQ.js');
 
 const debounceFunction = (func, timeout = 100) => {
@@ -46,7 +47,7 @@ exports.LuksoDropdown = class LuksoDropdown extends shared_tailwindElement_index
     this.size = "large";
     this.trigger = "click";
     this.maxHeight = void 0;
-    this.styles = index.ce({
+    this.styles = tailwindVariants.tv({
       slots: {
         wrapper: "absolute z-50",
         dropdown: `bg-neutral-100 border border-neutral-90 shadow-1xl
@@ -204,12 +205,12 @@ exports.LuksoDropdown = class LuksoDropdown extends shared_tailwindElement_index
       hasMaxHeight: this.maxHeight !== void 0
     });
     if (!this.isOpen) {
-      return shared_tailwindElement_index.E;
+      return lit.nothing;
     }
-    return shared_tailwindElement_index.x`<div id=${this.id} class=${wrapper()}>
+    return lit.html`<div id=${this.id} class=${wrapper()}>
       <div
         class=${dropdown()}
-        style=${this.maxHeight ? `max-height: ${this.maxHeight}px;` : shared_tailwindElement_index.E}
+        style=${this.maxHeight ? `max-height: ${this.maxHeight}px;` : lit.nothing}
       >
         <slot></slot>
       </div>
@@ -217,34 +218,34 @@ exports.LuksoDropdown = class LuksoDropdown extends shared_tailwindElement_index
   }
 };
 __decorateClass([
-  property.n({ type: String })
+  decorators_js.property({ type: String })
 ], exports.LuksoDropdown.prototype, "id", 2);
 __decorateClass([
-  property.n({ type: String, attribute: "trigger-id" })
+  decorators_js.property({ type: String, attribute: "trigger-id" })
 ], exports.LuksoDropdown.prototype, "triggerId", 2);
 __decorateClass([
-  property.n({ type: Boolean, attribute: "is-open", reflect: true })
+  decorators_js.property({ type: Boolean, attribute: "is-open", reflect: true })
 ], exports.LuksoDropdown.prototype, "isOpen", 2);
 __decorateClass([
-  property.n({ type: Boolean, attribute: "is-open-on-outside-click" })
+  decorators_js.property({ type: Boolean, attribute: "is-open-on-outside-click" })
 ], exports.LuksoDropdown.prototype, "isOpenOnOutsideClick", 2);
 __decorateClass([
-  property.n({ type: Boolean, attribute: "open-top" })
+  decorators_js.property({ type: Boolean, attribute: "open-top" })
 ], exports.LuksoDropdown.prototype, "openTop", 2);
 __decorateClass([
-  property.n({ type: Boolean, attribute: "is-right" })
+  decorators_js.property({ type: Boolean, attribute: "is-right" })
 ], exports.LuksoDropdown.prototype, "isRight", 2);
 __decorateClass([
-  property.n({ type: Boolean, attribute: "is-full-width" })
+  decorators_js.property({ type: Boolean, attribute: "is-full-width" })
 ], exports.LuksoDropdown.prototype, "isFullWidth", 2);
 __decorateClass([
-  property.n({ type: String })
+  decorators_js.property({ type: String })
 ], exports.LuksoDropdown.prototype, "size", 2);
 __decorateClass([
-  property.n({ type: String })
+  decorators_js.property({ type: String })
 ], exports.LuksoDropdown.prototype, "trigger", 2);
 __decorateClass([
-  property.n({ type: Number, attribute: "max-height", reflect: true })
+  decorators_js.property({ type: Number, attribute: "max-height", reflect: true })
 ], exports.LuksoDropdown.prototype, "maxHeight", 2);
 exports.LuksoDropdown = __decorateClass([
   safeCustomElement.safeCustomElement("lukso-dropdown")

package/dist/components/lukso-dropdown/index.js

@@ -1,10 +1,11 @@
-import { b as TailwindStyledElement, E, x } from '../../chunks/index-5X9ujrWL.js';
-import { n } from '../../chunks/property-DfumgIL6.js';
-import { c as ce } from '../../chunks/index-B9iart53.js';
+import { nothing, html } from 'lit';
+import { property } from 'lit/decorators.js';
+import { tv } from 'tailwind-variants';
 import { s as safeCustomElement } from '../../chunks/safe-custom-element-qdGIR_v6.js';
 import '../lukso-icon/index.js';
-import '../../chunks/index-BDyLu6M0.js';
-import '../../chunks/index-BBFSnMaE.js';
+import '../lukso-profile/index.js';
+import '../../chunks/index-BNt_JinF.js';
+import { TailwindStyledElement } from '../../shared/tailwind-element/index.js';
 import { u as uniqId } from '../../chunks/uniq-id-CGUN-pJV.js';
 
 const debounceFunction = (func, timeout = 100) => {
@@ -42,7 +43,7 @@ let LuksoDropdown = class extends TailwindStyledElement(style) {
     this.size = "large";
     this.trigger = "click";
     this.maxHeight = void 0;
-    this.styles = ce({
+    this.styles = tv({
       slots: {
         wrapper: "absolute z-50",
         dropdown: `bg-neutral-100 border border-neutral-90 shadow-1xl
@@ -200,12 +201,12 @@ let LuksoDropdown = class extends TailwindStyledElement(style) {
       hasMaxHeight: this.maxHeight !== void 0
     });
     if (!this.isOpen) {
-      return E;
+      return nothing;
     }
-    return x`<div id=${this.id} class=${wrapper()}>
+    return html`<div id=${this.id} class=${wrapper()}>
       <div
         class=${dropdown()}
-        style=${this.maxHeight ? `max-height: ${this.maxHeight}px;` : E}
+        style=${this.maxHeight ? `max-height: ${this.maxHeight}px;` : nothing}
       >
         <slot></slot>
       </div>
@@ -213,34 +214,34 @@ let LuksoDropdown = class extends TailwindStyledElement(style) {
   }
 };
 __decorateClass([
-  n({ type: String })
+  property({ type: String })
 ], LuksoDropdown.prototype, "id", 2);
 __decorateClass([
-  n({ type: String, attribute: "trigger-id" })
+  property({ type: String, attribute: "trigger-id" })
 ], LuksoDropdown.prototype, "triggerId", 2);
 __decorateClass([
-  n({ type: Boolean, attribute: "is-open", reflect: true })
+  property({ type: Boolean, attribute: "is-open", reflect: true })
 ], LuksoDropdown.prototype, "isOpen", 2);
 __decorateClass([
-  n({ type: Boolean, attribute: "is-open-on-outside-click" })
+  property({ type: Boolean, attribute: "is-open-on-outside-click" })
 ], LuksoDropdown.prototype, "isOpenOnOutsideClick", 2);
 __decorateClass([
-  n({ type: Boolean, attribute: "open-top" })
+  property({ type: Boolean, attribute: "open-top" })
 ], LuksoDropdown.prototype, "openTop", 2);
 __decorateClass([
-  n({ type: Boolean, attribute: "is-right" })
+  property({ type: Boolean, attribute: "is-right" })
 ], LuksoDropdown.prototype, "isRight", 2);
 __decorateClass([
-  n({ type: Boolean, attribute: "is-full-width" })
+  property({ type: Boolean, attribute: "is-full-width" })
 ], LuksoDropdown.prototype, "isFullWidth", 2);
 __decorateClass([
-  n({ type: String })
+  property({ type: String })
 ], LuksoDropdown.prototype, "size", 2);
 __decorateClass([
-  n({ type: String })
+  property({ type: String })
 ], LuksoDropdown.prototype, "trigger", 2);
 __decorateClass([
-  n({ type: Number, attribute: "max-height", reflect: true })
+  property({ type: Number, attribute: "max-height", reflect: true })
 ], LuksoDropdown.prototype, "maxHeight", 2);
 LuksoDropdown = __decorateClass([
   safeCustomElement("lukso-dropdown")

package/dist/components/lukso-dropdown-option/index.cjs

@@ -2,10 +2,11 @@
 
 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');
 
 const style = ":host {\n    display: block\n}";
 
@@ -28,7 +29,7 @@ exports.LuksoDropdownOption = class LuksoDropdownOption extends shared_tailwindE
     this.isActive = false;
     this.isGroup = false;
     this.size = "large";
-    this.styles = index.ce({
+    this.styles = tailwindVariants.tv({
       base: `text-neutral-20 cursor-pointer select-none
       whitespace-nowrap flex items-center truncate gap-2`,
       variants: {
@@ -88,28 +89,28 @@ exports.LuksoDropdownOption = class LuksoDropdownOption extends shared_tailwindE
       isDisabled: this.isDisabled,
       isReadonly: this.isReadonly
     });
-    return shared_tailwindElement_index.x`<div class="${styles}">
+    return lit.html`<div class="${styles}">
       <slot></slot>
     </div>`;
   }
 };
 __decorateClass([
-  property.n({ type: Boolean, attribute: "is-readonly" })
+  decorators_js.property({ type: Boolean, attribute: "is-readonly" })
 ], exports.LuksoDropdownOption.prototype, "isReadonly", 2);
 __decorateClass([
-  property.n({ type: Boolean, attribute: "is-disabled" })
+  decorators_js.property({ type: Boolean, attribute: "is-disabled" })
 ], exports.LuksoDropdownOption.prototype, "isDisabled", 2);
 __decorateClass([
-  property.n({ type: Boolean, attribute: "is-selected" })
+  decorators_js.property({ type: Boolean, attribute: "is-selected" })
 ], exports.LuksoDropdownOption.prototype, "isSelected", 2);
 __decorateClass([
-  property.n({ type: Boolean, attribute: "is-active" })
+  decorators_js.property({ type: Boolean, attribute: "is-active" })
 ], exports.LuksoDropdownOption.prototype, "isActive", 2);
 __decorateClass([
-  property.n({ type: Boolean, attribute: "is-group" })
+  decorators_js.property({ type: Boolean, attribute: "is-group" })
 ], exports.LuksoDropdownOption.prototype, "isGroup", 2);
 __decorateClass([
-  property.n({ type: String })
+  decorators_js.property({ type: String })
 ], exports.LuksoDropdownOption.prototype, "size", 2);
 exports.LuksoDropdownOption = __decorateClass([
   safeCustomElement.safeCustomElement("lukso-dropdown-option")

package/dist/components/lukso-dropdown-option/index.js

@@ -1,7 +1,8 @@
-import { b as TailwindStyledElement, x } from '../../chunks/index-5X9ujrWL.js';
-import { n } from '../../chunks/property-DfumgIL6.js';
-import { c as ce } from '../../chunks/index-B9iart53.js';
+import { html } from 'lit';
+import { property } from 'lit/decorators.js';
+import { tv } from 'tailwind-variants';
 import { s as safeCustomElement } from '../../chunks/safe-custom-element-qdGIR_v6.js';
+import { TailwindStyledElement } from '../../shared/tailwind-element/index.js';
 
 const style = ":host {\n    display: block\n}";
 
@@ -24,7 +25,7 @@ let LuksoDropdownOption = class extends TailwindStyledElement(style) {
     this.isActive = false;
     this.isGroup = false;
     this.size = "large";
-    this.styles = ce({
+    this.styles = tv({
       base: `text-neutral-20 cursor-pointer select-none
       whitespace-nowrap flex items-center truncate gap-2`,
       variants: {
@@ -84,28 +85,28 @@ let LuksoDropdownOption = class extends TailwindStyledElement(style) {
       isDisabled: this.isDisabled,
       isReadonly: this.isReadonly
     });
-    return x`<div class="${styles}">
+    return html`<div class="${styles}">
       <slot></slot>
     </div>`;
   }
 };
 __decorateClass([
-  n({ type: Boolean, attribute: "is-readonly" })
+  property({ type: Boolean, attribute: "is-readonly" })
 ], LuksoDropdownOption.prototype, "isReadonly", 2);
 __decorateClass([
-  n({ type: Boolean, attribute: "is-disabled" })
+  property({ type: Boolean, attribute: "is-disabled" })
 ], LuksoDropdownOption.prototype, "isDisabled", 2);
 __decorateClass([
-  n({ type: Boolean, attribute: "is-selected" })
+  property({ type: Boolean, attribute: "is-selected" })
 ], LuksoDropdownOption.prototype, "isSelected", 2);
 __decorateClass([
-  n({ type: Boolean, attribute: "is-active" })
+  property({ type: Boolean, attribute: "is-active" })
 ], LuksoDropdownOption.prototype, "isActive", 2);
 __decorateClass([
-  n({ type: Boolean, attribute: "is-group" })
+  property({ type: Boolean, attribute: "is-group" })
 ], LuksoDropdownOption.prototype, "isGroup", 2);
 __decorateClass([
-  n({ type: String })
+  property({ type: String })
 ], LuksoDropdownOption.prototype, "size", 2);
 LuksoDropdownOption = __decorateClass([
   safeCustomElement("lukso-dropdown-option")

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

@@ -2,9 +2,10 @@
 
 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 lit = require('lit');
+const decorators_js = require('lit/decorators.js');
 const safeCustomElement = require('../../chunks/safe-custom-element-tQ-epw6h.js');
+const shared_tailwindElement_index = require('../../shared/tailwind-element/index.cjs');
 
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -38,7 +39,7 @@ exports.LuksoFooter = class LuksoFooter extends shared_tailwindElement_index.Tai
     } catch (error) {
       console.warn("Invalid providers format, using default providers.", error);
     }
-    return shared_tailwindElement_index.x`
+    return lit.html`
       <footer class="bg-neutral-100">
         <div
           class="p-10 grid gap-8 items-center lg:grid-cols-[auto,max-content]"
@@ -70,7 +71,7 @@ exports.LuksoFooter = class LuksoFooter extends shared_tailwindElement_index.Tai
   }
 };
 __decorateClass([
-  property.n({ type: String })
+  decorators_js.property({ type: String })
 ], exports.LuksoFooter.prototype, "providers", 2);
 exports.LuksoFooter = __decorateClass([
   safeCustomElement.safeCustomElement("lukso-footer")

package/dist/components/lukso-footer/index.js

@@ -1,6 +1,7 @@
-import { T as TailwindElement, x } from '../../chunks/index-5X9ujrWL.js';
-import { n } from '../../chunks/property-DfumgIL6.js';
+import { html } from 'lit';
+import { property } from 'lit/decorators.js';
 import { s as safeCustomElement } from '../../chunks/safe-custom-element-qdGIR_v6.js';
+import { TailwindElement } from '../../shared/tailwind-element/index.js';
 
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -34,7 +35,7 @@ let LuksoFooter = class extends TailwindElement {
     } catch (error) {
       console.warn("Invalid providers format, using default providers.", error);
     }
-    return x`
+    return html`
       <footer class="bg-neutral-100">
         <div
           class="p-10 grid gap-8 items-center lg:grid-cols-[auto,max-content]"
@@ -66,7 +67,7 @@ let LuksoFooter = class extends TailwindElement {
   }
 };
 __decorateClass([
-  n({ type: String })
+  property({ type: String })
 ], LuksoFooter.prototype, "providers", 2);
 LuksoFooter = __decorateClass([
   safeCustomElement("lukso-footer")

package/dist/components/lukso-form-description/index.cjs

@@ -2,9 +2,10 @@
 
 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 lit = require('lit');
+const decorators_js = require('lit/decorators.js');
 const safeCustomElement = require('../../chunks/safe-custom-element-tQ-epw6h.js');
+const shared_tailwindElement_index = require('../../shared/tailwind-element/index.cjs');
 
 const style = ":host {\n    display: flex\n}";
 
@@ -20,16 +21,16 @@ var __decorateClass = (decorators, target, key, kind) => {
 };
 exports.LuksoFormDescription = class LuksoFormDescription extends shared_tailwindElement_index.TailwindStyledElement(style) {
   render() {
-    return this.description ? shared_tailwindElement_index.x`
+    return this.description ? lit.html`
           <lukso-sanitize
-            html-content=${this.description ? this.description : shared_tailwindElement_index.E}
+            html-content=${this.description ? this.description : lit.nothing}
             class="paragraph-inter-12-regular text-neutral-20 pb-2"
           ></lukso-sanitize>
-        ` : shared_tailwindElement_index.E;
+        ` : lit.nothing;
   }
 };
 __decorateClass([
-  property.n({ type: String, reflect: true })
+  decorators_js.property({ type: String, reflect: true })
 ], exports.LuksoFormDescription.prototype, "description", 2);
 exports.LuksoFormDescription = __decorateClass([
   safeCustomElement.safeCustomElement("lukso-form-description")

package/dist/components/lukso-form-description/index.js

@@ -1,6 +1,7 @@
-import { b as TailwindStyledElement, E, x } from '../../chunks/index-5X9ujrWL.js';
-import { n } from '../../chunks/property-DfumgIL6.js';
+import { nothing, html } from 'lit';
+import { property } from 'lit/decorators.js';
 import { s as safeCustomElement } from '../../chunks/safe-custom-element-qdGIR_v6.js';
+import { TailwindStyledElement } from '../../shared/tailwind-element/index.js';
 
 const style = ":host {\n    display: flex\n}";
 
@@ -16,16 +17,16 @@ var __decorateClass = (decorators, target, key, kind) => {
 };
 let LuksoFormDescription = class extends TailwindStyledElement(style) {
   render() {
-    return this.description ? x`
+    return this.description ? html`
           <lukso-sanitize
-            html-content=${this.description ? this.description : E}
+            html-content=${this.description ? this.description : nothing}
             class="paragraph-inter-12-regular text-neutral-20 pb-2"
           ></lukso-sanitize>
-        ` : E;
+        ` : nothing;
   }
 };
 __decorateClass([
-  n({ type: String, reflect: true })
+  property({ type: String, reflect: true })
 ], LuksoFormDescription.prototype, "description", 2);
 LuksoFormDescription = __decorateClass([
   safeCustomElement("lukso-form-description")

package/dist/components/lukso-form-error/index.cjs

@@ -2,9 +2,10 @@
 
 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 lit = require('lit');
+const decorators_js = require('lit/decorators.js');
 const safeCustomElement = require('../../chunks/safe-custom-element-tQ-epw6h.js');
+const shared_tailwindElement_index = require('../../shared/tailwind-element/index.cjs');
 
 const style = ":host {\n    display: flex\n}";
 
@@ -20,16 +21,16 @@ var __decorateClass = (decorators, target, key, kind) => {
 };
 exports.LuksoFormError = class LuksoFormError extends shared_tailwindElement_index.TailwindStyledElement(style) {
   render() {
-    return this.error ? shared_tailwindElement_index.x`
+    return this.error ? lit.html`
           <lukso-sanitize
-            html-content=${this.error ? this.error : shared_tailwindElement_index.E}
+            html-content=${this.error ? this.error : lit.nothing}
             class="paragraph-inter-12-regular text-red-65 pt-2"
           ></lukso-sanitize>
-        ` : shared_tailwindElement_index.E;
+        ` : lit.nothing;
   }
 };
 __decorateClass([
-  property.n({ type: String, reflect: true })
+  decorators_js.property({ type: String, reflect: true })
 ], exports.LuksoFormError.prototype, "error", 2);
 exports.LuksoFormError = __decorateClass([
   safeCustomElement.safeCustomElement("lukso-form-error")

package/dist/components/lukso-form-error/index.js

@@ -1,6 +1,7 @@
-import { b as TailwindStyledElement, E, x } from '../../chunks/index-5X9ujrWL.js';
-import { n } from '../../chunks/property-DfumgIL6.js';
+import { nothing, html } from 'lit';
+import { property } from 'lit/decorators.js';
 import { s as safeCustomElement } from '../../chunks/safe-custom-element-qdGIR_v6.js';
+import { TailwindStyledElement } from '../../shared/tailwind-element/index.js';
 
 const style = ":host {\n    display: flex\n}";
 
@@ -16,16 +17,16 @@ var __decorateClass = (decorators, target, key, kind) => {
 };
 let LuksoFormError = class extends TailwindStyledElement(style) {
   render() {
-    return this.error ? x`
+    return this.error ? html`
           <lukso-sanitize
-            html-content=${this.error ? this.error : E}
+            html-content=${this.error ? this.error : nothing}
             class="paragraph-inter-12-regular text-red-65 pt-2"
           ></lukso-sanitize>
-        ` : E;
+        ` : nothing;
   }
 };
 __decorateClass([
-  n({ type: String, reflect: true })
+  property({ type: String, reflect: true })
 ], LuksoFormError.prototype, "error", 2);
 LuksoFormError = __decorateClass([
   safeCustomElement("lukso-form-error")