@lukso/web-components 1.72.0 → 1.74.0

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

@@ -1,4 +1,4 @@
-import { T as TailwindStyledElement, x, A } from '../../index-bf6e0a1d.js';
+import { T as TailwindStyledElement, x, A } from '../../index-09db75ee.js';
 import { n, e } from '../../query-assigned-elements-1c8c9e90.js';
 import { t } from '../../state-b9ca4e74.js';
 import { c as ce } from '../../index-ca8e900d.js';
@@ -6,11 +6,73 @@ import '../lukso-icon/index.js';
 import '../lukso-profile/index.js';
 import '../lukso-username/index.js';
 import '../../bundle-mjs-fbc6e2a8.js';
-import '../../style-map-c66282ea.js';
+import '../../style-map-3669b30c.js';
 import '../../directive-2bb7789e.js';
 import '../lukso-image/index.js';
 import '../../index-5e194caf.js';
-import '../../index-8c727f4c.js';
+import '../../index-dfdfb6fe.js';
+
+/**
+ * Convert array of 16 byte values to UUID string format of the form:
+ * XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX
+ */
+var byteToHex = [];
+for (var i = 0; i < 256; ++i) {
+  byteToHex.push((i + 0x100).toString(16).slice(1));
+}
+function unsafeStringify(arr, offset = 0) {
+  // Note: Be careful editing this code!  It's been tuned for performance
+  // and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434
+  //
+  // Note to future-self: No, you can't remove the `toLowerCase()` call.
+  // REF: https://github.com/uuidjs/uuid/pull/677#issuecomment-1757351351
+  return (byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]).toLowerCase();
+}
+
+// Unique ID creation requires a high quality random # generator. In the browser we therefore
+// require the crypto API and do not support built-in fallback to lower quality random number
+// generators (like Math.random()).
+
+var getRandomValues;
+var rnds8 = new Uint8Array(16);
+function rng() {
+  // lazy load so that environments that need to polyfill have a chance to do so
+  if (!getRandomValues) {
+    // getRandomValues needs to be invoked in a context where "this" is a Crypto implementation.
+    getRandomValues = typeof crypto !== 'undefined' && crypto.getRandomValues && crypto.getRandomValues.bind(crypto);
+    if (!getRandomValues) {
+      throw new Error('crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported');
+    }
+  }
+  return getRandomValues(rnds8);
+}
+
+var randomUUID = typeof crypto !== 'undefined' && crypto.randomUUID && crypto.randomUUID.bind(crypto);
+const native = {
+  randomUUID
+};
+
+function v4(options, buf, offset) {
+  if (native.randomUUID && !buf && !options) {
+    return native.randomUUID();
+  }
+  options = options || {};
+  var rnds = options.random || (options.rng || rng)();
+
+  // Per 4.4, set bits for version and `clock_seq_hi_and_reserved`
+  rnds[6] = rnds[6] & 0x0f | 0x40;
+  rnds[8] = rnds[8] & 0x3f | 0x80;
+
+  // Copy bytes to buffer, if provided
+  if (buf) {
+    offset = offset || 0;
+    for (var i = 0; i < 16; ++i) {
+      buf[offset + i] = rnds[i];
+    }
+    return buf;
+  }
+  return unsafeStringify(rnds);
+}
 
 const style = ":host {\n\n    display: inline-flex\n}\n\n:host([is-full-width]) {\n\n    display: flex;\n\n    width: 100%\n}";
 
@@ -27,7 +89,7 @@ var __decorateClass = (decorators, target, key, kind) => {
 };
 let LuksoSelect = class extends TailwindStyledElement(style) {
   constructor() {
-    super(...arguments);
+    super();
     this.value = "";
     this.placeholder = "";
     this.label = "";
@@ -43,61 +105,119 @@ let LuksoSelect = class extends TailwindStyledElement(style) {
     this.isOpen = false;
     this.openTop = false;
     this.isLargeIcon = false;
+    this.isRight = false;
+    this.size = "medium";
+    this.showSelectionCounter = false;
     this.optionsParsed = [];
     this.valueParsed = void 0;
     this.inputStyles = ce({
-      base: `bg-neutral-100 paragraph-inter-14-regular px-4 py-3 pr-11
-      border border-solid h-[48px] placeholder:text-neutral-70 select-none whitespace-nowrap
-      outline-none transition transition-all duration-150 appearance-none rounded-12
+      base: `bg-neutral-100
+      border border-solid placeholder:text-neutral-70 select-none whitespace-nowrap
+      outline-none transition transition-all duration-150 appearance-none
       text-neutral-20 cursor-pointer border-neutral-90 group-hover:border-neutral-35
       flex items-center`,
       variants: {
         isFullWidth: {
-          true: `w-full`
+          true: "w-full"
         },
         isDisabled: {
-          true: `cursor-not-allowed text-neutral-60 group-hover:border-neutral-90`
+          true: "cursor-not-allowed text-neutral-60 group-hover:border-neutral-90"
         },
         hasError: {
-          true: `border-red-85 group-hover:border-red-65`
+          true: "border-red-85 group-hover:border-red-65"
         },
         borderless: {
-          true: `border-0`
+          true: "border-0"
+        },
+        size: {
+          small: "h-[28px] px-3 py-2 pr-8 paragraph-inter-12-regular rounded-8",
+          medium: "h-[48px] px-4 py-3 pr-11 paragraph-inter-14-regular rounded-12"
+        }
+      }
+    });
+    this.counterStyles = ce({
+      base: "border border-neutral-20",
+      variants: {
+        isDisabled: {
+          true: "opacity-60 cursor-not-allowed"
+        },
+        size: {
+          small: "paragraph-inter-10-semi-bold rounded-4 py-[1px] px-[5px] ml-1.5",
+          medium: "paragraph-inter-14-semi-bold rounded-8 py-[2px] px-[10px] ml-3"
         }
       }
     });
     this.dropdownWrapperStyles = ce({
-      base: `bg-neutral-100 border w-full border-neutral-90 shadow-1xl rounded-12 p-3 z-50
-      flex absolute flex-col gap-1 overflow-y-auto max-h-64 mt-2`,
+      base: `bg-neutral-100 border w-auto border-neutral-90 shadow-1xl z-50
+      flex absolute flex-col gap-1 overflow-y-auto max-h-64 `,
       variants: {
         openTop: {
-          true: `bottom-[48px] mb-2 mt-0`
+          true: "bottom-[48px] mb-2 mt-0"
+        },
+        size: {
+          small: "rounded-8 p-2 mt-1 max-w-[200px] min-w-[120px]",
+          medium: "rounded-12 p-3 mt-2 max-w-[300px] min-w-[200px]"
+        },
+        isRight: {
+          true: "right-0"
         }
       }
     });
     this.optionsStyles = ce({
-      base: `paragraph-inter-14-regular text-neutral-20 cursor-pointer rounded-8 p-2
-      whitespace-nowrap hover:bg-neutral-98 flex items-center`,
+      base: `text-neutral-20 cursor-pointer
+      whitespace-nowrap hover:bg-neutral-98 flex items-center truncate`,
       variants: {
         isSelected: {
-          true: `bg-neutral-95 hover:bg-neutral-95`
+          true: "bg-neutral-95 hover:bg-neutral-95"
         },
         isActive: {
-          true: `bg-neutral-98`
+          true: "bg-neutral-98"
+        },
+        isGroup: {
+          true: ""
+        },
+        size: {
+          small: "paragraph-inter-12-regular rounded-4 py-1 px-2 min-h-[28px]",
+          medium: "paragraph-inter-14-regular rounded-8 p-2 min-h-[38px]"
+        },
+        isDisabled: {
+          true: "opacity-60 cursor-not-allowed"
+        },
+        isReadonly: {
+          true: "cursor-not-allowed"
         }
-      }
+      },
+      compoundVariants: [
+        {
+          isGroup: true,
+          size: "small",
+          class: "pl-3"
+        },
+        {
+          isGroup: true,
+          size: "medium",
+          class: "pl-4"
+        }
+      ]
     });
     this.iconStyles = ce({
-      base: `absolute right-0 mr-3 transition cursor-pointer`,
+      base: "absolute right-0 transition cursor-pointer",
       variants: {
         isDisabled: {
-          true: `opacity-60 cursor-not-allowed`
+          true: "opacity-60 cursor-not-allowed"
         },
         isOpen: {
-          true: `rotate-180`
+          true: "rotate-180"
+        },
+        size: {
+          small: "mr-2",
+          medium: "mr-3"
         }
       }
     });
+    if (!this.id) {
+      this.id = v4();
+    }
   }
   connectedCallback() {
     super.connectedCallback();
@@ -134,7 +254,8 @@ let LuksoSelect = class extends TailwindStyledElement(style) {
     }
     if (changedProperties.has("value") && !!this.value) {
       try {
-        this.valueParsed = JSON.parse(this.value);
+        const value = JSON.parse(this.value);
+        this.valueParsed = Array.isArray(value) ? value : [value];
       } catch (error) {
         console.warn("Could not parse value", error);
       }
@@ -145,7 +266,8 @@ let LuksoSelect = class extends TailwindStyledElement(style) {
       isFullWidth: this.isFullWidth,
       isDisabled: this.isDisabled,
       hasError: !!this.error,
-      borderless: this.borderless
+      borderless: this.borderless,
+      size: this.size
     });
     return x`
       <div
@@ -155,10 +277,19 @@ let LuksoSelect = class extends TailwindStyledElement(style) {
         @blur=${this.handleBlur}
         @click=${this.handleClick}
       >
-        ${this.value ? this.selectedValue() : this.placeholder}
+        ${this.placeholder ? this.placeholder : A}
+        ${!this.placeholder && this.valueParsed?.length ? this.selectedValueTemplate() : A}
+        ${this.showSelectionCounter && this.valueParsed?.length ? this.selectedOptionsCounterTemplate() : A}
       </div>
     `;
   }
+  selectedOptionsCounterTemplate() {
+    const counterStyles = this.counterStyles({
+      isDisabled: this.isDisabled,
+      size: this.size
+    });
+    return x`<div class=${counterStyles}>${this.valueParsed?.length}</div>`;
+  }
   labelTemplate() {
     return x`
       <div class="heading-inter-14-bold text-neutral-20 pb-2 block">
@@ -182,7 +313,9 @@ let LuksoSelect = class extends TailwindStyledElement(style) {
     const optionTemplates = [];
     for (const option of Object.entries(this.optionsParsed)) {
       const index = Number(option[0]);
-      if ("value" in option[1]) {
+      if ("values" in option[1]) {
+        optionTemplates.push(this.optionGroupedStringTemplate(option[1], index));
+      } else if ("value" in option[1]) {
         optionTemplates.push(this.optionStringTemplate(option[1], index));
       } else if ("address" in option[1]) {
         optionTemplates.push(this.optionProfileTemplate(option[1], index));
@@ -194,14 +327,33 @@ let LuksoSelect = class extends TailwindStyledElement(style) {
   }
   dropdownWrapperTemplate(innerTemplate) {
     const dropdownWrapperStyles = this.dropdownWrapperStyles({
-      openTop: this.openTop
+      openTop: this.openTop,
+      size: this.size,
+      isRight: this.isRight
     });
     return x`<div class="${dropdownWrapperStyles}">${innerTemplate}</div>`;
   }
+  optionGroupedStringTemplate(option, index) {
+    return x`<div
+        class="paragraph-inter-10-bold-uppercase text-neutral-20 p-1"
+      >
+        ${option.group}
+      </div>
+      ${option.values.map((value, valueIndex) => {
+      return this.optionStringTemplate(
+        { id: `${option.id}-${valueIndex}`, group: option.group, value },
+        index
+      );
+    })}`;
+  }
   optionStringTemplate(option, index) {
     const optionsStyles = this.optionsStyles({
-      isSelected: this.valueParsed?.id === option.id,
-      isActive: this.selected === index + 1 && this.valueParsed?.id !== option.id
+      isSelected: !!this.valueParsed?.find((value) => value.id === option.id),
+      isActive: this.selected === index + 1 && !this.valueParsed?.find((value) => value.id === option.id),
+      size: this.size,
+      isGroup: !!option.group,
+      isDisabled: this.isDisabled,
+      isReadonly: this.isReadonly
     });
     return x`<div
       data-id="${option.id}"
@@ -214,8 +366,11 @@ let LuksoSelect = class extends TailwindStyledElement(style) {
   }
   optionProfileTemplate(option, index) {
     const optionsStyles = this.optionsStyles({
-      isSelected: this.valueParsed?.id === option.id,
-      isActive: this.selected === index + 1 && this.valueParsed?.id !== option.id
+      isSelected: !!this.valueParsed?.find((value) => value.id === option.id),
+      isActive: this.selected === index + 1 && !this.valueParsed?.find((value) => value.id === option.id),
+      size: this.size,
+      isDisabled: this.isDisabled,
+      isReadonly: this.isReadonly
     });
     return x`<div
       data-id="${option.id}"
@@ -243,27 +398,51 @@ let LuksoSelect = class extends TailwindStyledElement(style) {
         name-color="neutral-20"
         max-width="150"
         slice-by="4"
-        size="medium"
+        size=${this.size}
       ></lukso-username>`;
   }
-  selectedValue() {
-    const foundValue = this.optionsParsed.find(
-      (option) => option.id === this.valueParsed?.id
-    );
-    if (foundValue) {
-      if ("value" in foundValue) {
-        return this.optionStringValue(foundValue);
-      } else if ("address" in foundValue) {
-        return this.optionProfileValue(foundValue);
-      } else {
-        console.error("Unknown value type", foundValue);
+  selectedValueTemplate() {
+    const firstOption = this.optionsParsed[0];
+    if ("value" in firstOption) {
+      const foundValues = this.optionsParsed.filter(
+        (option) => !!this.valueParsed?.find((value) => value.id === option.id)
+      );
+      return foundValues.map((value) => this.optionStringValue(value)).join(", ");
+    }
+    if ("values" in firstOption) {
+      const foundValues = [];
+      for (const option of this.optionsParsed) {
+        for (const [index, value] of option.values.entries()) {
+          for (const parsedValue of this.valueParsed) {
+            if (parsedValue.id === `${option.id}-${index}`) {
+              foundValues.push({
+                id: `${option.id}-${index}`,
+                value
+              });
+            }
+          }
+        }
       }
+      return foundValues.map((value) => this.optionStringValue(value)).join(", ");
     }
+    if ("address" in firstOption) {
+      const foundValues = this.optionsParsed.filter(
+        (option) => !!this.valueParsed?.find((value) => value.id === option.id)
+      );
+      const optionProfileValues = [];
+      for (const value of foundValues) {
+        optionProfileValues.push(
+          this.optionProfileValue(value)
+        );
+      }
+      return optionProfileValues;
+    }
+    console.error("Unknown value type", this.valueParsed);
     return "";
   }
   handleOutsideDropdownClick(event) {
     const element = event.target;
-    if (element.tagName === "LUKSO-SELECT") {
+    if (element.tagName === "LUKSO-SELECT" && this.id === element.id) {
       return;
     }
     this.isOpen = false;
@@ -328,7 +507,8 @@ let LuksoSelect = class extends TailwindStyledElement(style) {
   render() {
     const iconStyles = this.iconStyles({
       isDisabled: this.isDisabled,
-      isOpen: this.isOpen
+      isOpen: this.isOpen,
+      size: this.size
     });
     return x`
       <div class="relative w-[inherit]">
@@ -396,6 +576,15 @@ __decorateClass([
 __decorateClass([
   n({ type: Boolean, attribute: "is-large-icon" })
 ], LuksoSelect.prototype, "isLargeIcon", 2);
+__decorateClass([
+  n({ type: Boolean, attribute: "is-right" })
+], LuksoSelect.prototype, "isRight", 2);
+__decorateClass([
+  n({ type: String })
+], LuksoSelect.prototype, "size", 2);
+__decorateClass([
+  n({ type: Boolean, attribute: "show-selection-counter" })
+], LuksoSelect.prototype, "showSelectionCounter", 2);
 __decorateClass([
   t()
 ], LuksoSelect.prototype, "optionsParsed", 2);

package/dist/components/lukso-select/lukso-select.stories.d.ts

@@ -4,8 +4,20 @@ declare const meta: Meta;
 export default meta;
 /** Example of select with `string` values.  */
 export declare const DefaultSelect: any;
+/** With `placeholder` value you can set fixed text in selection trigger.  */
+export declare const Placeholder: any;
 /** Example of select that open top.  */
 export declare const OpenTop: any;
 /** Example of select with `profile` values.  */
 export declare const ProfileSelect: any;
+/** Example of `small` select.  */
+export declare const SmallSelect: any;
+/** Example of multi select.  */
+export declare const MultiSelect: any;
+/** Example of right side dropdown.  */
+export declare const RightSideDropdown: any;
+/** Example of grouped select.  */
+export declare const GroupedSelect: any;
+/** Example of selection counter.  */
+export declare const CountSelections: any;
 //# sourceMappingURL=lukso-select.stories.d.ts.map

package/dist/components/lukso-select/lukso-select.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"lukso-select.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-select/lukso-select.stories.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,2BAA2B,CAAA;AAErD,OAAO,SAAS,CAAA;AAEhB,+DAA+D;AAC/D,QAAA,MAAM,IAAI,EAAE,IAiMX,CAAA;AAED,eAAe,IAAI,CAAA;AAkDnB,+CAA+C;AAC/C,eAAO,MAAM,aAAa,KAAoB,CAAA;AAK9C,wCAAwC;AACxC,eAAO,MAAM,OAAO,KAAoB,CAAA;AAMxC,gDAAgD;AAChD,eAAO,MAAM,aAAa,KAAoB,CAAA"}
+{"version":3,"file":"lukso-select.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-select/lukso-select.stories.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,2BAA2B,CAAA;AAErD,OAAO,SAAS,CAAA;AAEhB,+DAA+D;AAC/D,QAAA,MAAM,IAAI,EAAE,IAuOX,CAAA;AAED,eAAe,IAAI,CAAA;AAyDnB,+CAA+C;AAC/C,eAAO,MAAM,aAAa,KAAoB,CAAA;AAK9C,6EAA6E;AAC7E,eAAO,MAAM,WAAW,KAAoB,CAAA;AAM5C,wCAAwC;AACxC,eAAO,MAAM,OAAO,KAAoB,CAAA;AAMxC,gDAAgD;AAChD,eAAO,MAAM,aAAa,KAAoB,CAAA;AA8B9C,kCAAkC;AAClC,eAAO,MAAM,WAAW,KAAoB,CAAA;AAM5C,gCAAgC;AAChC,eAAO,MAAM,WAAW,KAAoB,CAAA;AAe5C,uCAAuC;AACvC,eAAO,MAAM,iBAAiB,KAAoB,CAAA;AAOlD,kCAAkC;AAClC,eAAO,MAAM,aAAa,KAAoB,CAAA;AA2B9C,qCAAqC;AACrC,eAAO,MAAM,eAAe,KAAoB,CAAA"}

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const shared_tailwindElement_index = require('../../index-25503efb.cjs');
+const shared_tailwindElement_index = require('../../index-9b930f6a.cjs');
 const queryAssignedElements = require('../../query-assigned-elements-d5e45650.cjs');
 
 const style = ":host {\n    display: inline-flex\n}";

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

@@ -1,4 +1,4 @@
-import { T as TailwindStyledElement, x } from '../../index-bf6e0a1d.js';
+import { T as TailwindStyledElement, x } from '../../index-09db75ee.js';
 import { n, e } from '../../query-assigned-elements-1c8c9e90.js';
 
 const style = ":host {\n    display: inline-flex\n}";

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

@@ -2,9 +2,9 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const shared_tailwindElement_index = require('../../index-25503efb.cjs');
+const shared_tailwindElement_index = require('../../index-9b930f6a.cjs');
 const queryAssignedElements = require('../../query-assigned-elements-d5e45650.cjs');
-const styleMap = require('../../style-map-6337084a.cjs');
+const styleMap = require('../../style-map-ebf3a8d2.cjs');
 const index = require('../../index-e9668573.cjs');
 require('../../directive-8278ab14.cjs');
 

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

@@ -1,6 +1,6 @@
-import { a as TailwindElement, x } from '../../index-bf6e0a1d.js';
+import { a as TailwindElement, x } from '../../index-09db75ee.js';
 import { n, e } from '../../query-assigned-elements-1c8c9e90.js';
-import { o } from '../../style-map-c66282ea.js';
+import { o } from '../../style-map-3669b30c.js';
 import { c as customClassMap } from '../../index-5e194caf.js';
 import '../../directive-2bb7789e.js';
 

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

@@ -2,10 +2,10 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const shared_tailwindElement_index = require('../../index-25503efb.cjs');
+const shared_tailwindElement_index = require('../../index-9b930f6a.cjs');
 const queryAssignedElements = require('../../query-assigned-elements-d5e45650.cjs');
 const index = require('../../index-1d3f4a5a.cjs');
-const index$1 = require('../../index-59f199b0.cjs');
+const index$1 = require('../../index-a1e4b7d4.cjs');
 require('../../bundle-mjs-d58a83c6.cjs');
 require('../../directive-8278ab14.cjs');
 

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

@@ -1,7 +1,7 @@
-import { T as TailwindStyledElement, x } from '../../index-bf6e0a1d.js';
+import { T as TailwindStyledElement, x } from '../../index-09db75ee.js';
 import { n, e } from '../../query-assigned-elements-1c8c9e90.js';
 import { c as ce } from '../../index-ca8e900d.js';
-import { c as customStyleMap } from '../../index-8c727f4c.js';
+import { c as customStyleMap } from '../../index-dfdfb6fe.js';
 import '../../bundle-mjs-fbc6e2a8.js';
 import '../../directive-2bb7789e.js';
 

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

@@ -2,14 +2,14 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const shared_tailwindElement_index = require('../../index-25503efb.cjs');
+const shared_tailwindElement_index = require('../../index-9b930f6a.cjs');
 const queryAssignedElements = require('../../query-assigned-elements-d5e45650.cjs');
 const state = require('../../state-d9fb972b.cjs');
 const index = require('../../index-e9668573.cjs');
 require('../lukso-icon/index.cjs');
 require('../lukso-sanitize/index.cjs');
 require('../../directive-8278ab14.cjs');
-require('../../style-map-6337084a.cjs');
+require('../../style-map-ebf3a8d2.cjs');
 
 const style = ":host {\n    display: flex;\n    height: 100%\n}";
 

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

@@ -1,11 +1,11 @@
-import { T as TailwindStyledElement, x } from '../../index-bf6e0a1d.js';
+import { T as TailwindStyledElement, x } from '../../index-09db75ee.js';
 import { n, e } from '../../query-assigned-elements-1c8c9e90.js';
 import { t } from '../../state-b9ca4e74.js';
 import { c as customClassMap } from '../../index-5e194caf.js';
 import '../lukso-icon/index.js';
 import '../lukso-sanitize/index.js';
 import '../../directive-2bb7789e.js';
-import '../../style-map-c66282ea.js';
+import '../../style-map-3669b30c.js';
 
 const style = ":host {\n    display: flex;\n    height: 100%\n}";
 

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const shared_tailwindElement_index = require('../../index-25503efb.cjs');
+const shared_tailwindElement_index = require('../../index-9b930f6a.cjs');
 const queryAssignedElements = require('../../query-assigned-elements-d5e45650.cjs');
 const directive = require('../../directive-8278ab14.cjs');
 

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

@@ -1,4 +1,4 @@
-import { b as T$1, T as TailwindStyledElement, x as x$1 } from '../../index-bf6e0a1d.js';
+import { b as T$1, T as TailwindStyledElement, x as x$1 } from '../../index-09db75ee.js';
 import { n as n$3, e as e$3 } from '../../query-assigned-elements-1c8c9e90.js';
 import { e as e$2, i as i$3, t as t$3 } from '../../directive-2bb7789e.js';
 

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

@@ -2,11 +2,11 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const shared_tailwindElement_index = require('../../index-25503efb.cjs');
+const shared_tailwindElement_index = require('../../index-9b930f6a.cjs');
 const queryAssignedElements = require('../../query-assigned-elements-d5e45650.cjs');
 const state = require('../../state-d9fb972b.cjs');
 const index = require('../../index-1d3f4a5a.cjs');
-const styleMap = require('../../style-map-6337084a.cjs');
+const styleMap = require('../../style-map-ebf3a8d2.cjs');
 require('../../bundle-mjs-d58a83c6.cjs');
 require('../../directive-8278ab14.cjs');
 

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

@@ -1,8 +1,8 @@
-import { T as TailwindStyledElement, x } from '../../index-bf6e0a1d.js';
+import { T as TailwindStyledElement, x } from '../../index-09db75ee.js';
 import { n, e } from '../../query-assigned-elements-1c8c9e90.js';
 import { t } from '../../state-b9ca4e74.js';
 import { c as ce } from '../../index-ca8e900d.js';
-import { o } from '../../style-map-c66282ea.js';
+import { o } from '../../style-map-3669b30c.js';
 import '../../bundle-mjs-fbc6e2a8.js';
 import '../../directive-2bb7789e.js';
 

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

@@ -2,10 +2,10 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const shared_tailwindElement_index = require('../../index-25503efb.cjs');
+const shared_tailwindElement_index = require('../../index-9b930f6a.cjs');
 const queryAssignedElements = require('../../query-assigned-elements-d5e45650.cjs');
 const index = require('../../index-e9668573.cjs');
-const index$1 = require('../../index-59f199b0.cjs');
+const index$1 = require('../../index-a1e4b7d4.cjs');
 require('../../directive-8278ab14.cjs');
 
 const sliceAddress = (address, startSliceBy = 6, endSliceBy) => {

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

@@ -1,7 +1,7 @@
-import { T as TailwindStyledElement, x, A } from '../../index-bf6e0a1d.js';
+import { T as TailwindStyledElement, x, A } from '../../index-09db75ee.js';
 import { n, e } from '../../query-assigned-elements-1c8c9e90.js';
 import { c as customClassMap } from '../../index-5e194caf.js';
-import { c as customStyleMap } from '../../index-8c727f4c.js';
+import { c as customStyleMap } from '../../index-dfdfb6fe.js';
 import '../../directive-2bb7789e.js';
 
 const sliceAddress = (address, startSliceBy = 6, endSliceBy) => {

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const shared_tailwindElement_index = require('../../index-25503efb.cjs');
+const shared_tailwindElement_index = require('../../index-9b930f6a.cjs');
 const queryAssignedElements = require('../../query-assigned-elements-d5e45650.cjs');
 const directive = require('../../directive-8278ab14.cjs');
 const index = require('../../index-1d3f4a5a.cjs');

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

@@ -1,4 +1,4 @@
-import { j, b as T, T as TailwindStyledElement, x } from '../../index-bf6e0a1d.js';
+import { j, b as T, T as TailwindStyledElement, x } from '../../index-09db75ee.js';
 import { n, e as e$1 } from '../../query-assigned-elements-1c8c9e90.js';
 import { e, i, t } from '../../directive-2bb7789e.js';
 import { c as ce } from '../../index-ca8e900d.js';