@lukso/web-components 1.131.0 → 1.131.1

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

@@ -1,22 +1,22 @@
-import { m as makeBlockie } from '../../index-38990f38.js';
-import { T as TailwindStyledElement, x, E } from '../../index-2d057f81.js';
-import { n, t } from '../../property-5367c26a.js';
-import { r } from '../../state-bdfaec36.js';
+import { m as makeBlockie } from '../../index-2f05f181.js';
+import { T as TailwindStyledElement, x, E } from '../../index-44537fbb.js';
+import { n, t } from '../../property-27a56e78.js';
+import { r } from '../../state-cda0c5ee.js';
 import { c as ce } from '../../index-d14b6a34.js';
 import '../lukso-dropdown/index.js';
 import '../lukso-dropdown-option/index.js';
 import '../lukso-icon/index.js';
 import '../lukso-input/index.js';
 import '../lukso-tag/index.js';
-import { s as sliceAddress } from '../../index-9ba001cb.js';
+import { s as sliceAddress } from '../../index-35fd0f44.js';
 import '../../tailwind-config.js';
 import '../../cn-90c03edf.js';
 import '../lukso-image/index.js';
-import '../../style-map-9e6bb4a6.js';
+import '../../style-map-d0cf7858.js';
 import '../../directive-2bb7789e.js';
 import '../../uniq-id-ce2d165c.js';
 import '../lukso-sanitize/index.js';
-import '../../index-5387057e.js';
+import '../../index-1db9d1ee.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}";
 
@@ -220,7 +220,7 @@ let LuksoSearch = class extends TailwindStyledElement(style) {
   resultUniversalNameTemplate(result, index) {
     const tag = x`<lukso-tag
       is-rounded
-      background-color="${result.status ? "green-90" : "neutral-95"}"
+      background-color="${result.status ? "green-95" : "neutral-95"}"
       text-color="${result.status ? "green-45" : "neutral-60"}"
       >${!!result.status ? this.availableText : this.unavailableText}</lukso-tag
     >`;

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

@@ -2,21 +2,21 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const shared_tailwindElement_index = require('../../index-96bba619.cjs');
-const property = require('../../property-98f7e05b.cjs');
-const state = require('../../state-eba8ded5.cjs');
+const shared_tailwindElement_index = require('../../index-b103f110.cjs');
+const property = require('../../property-e2dd6303.cjs');
+const state = require('../../state-e20739c9.cjs');
 const index = require('../../index-2b104ecb.cjs');
-const components_luksoProfile_index = require('../../index-9c39357d.cjs');
+const components_luksoProfile_index = require('../../index-dfcb5b8a.cjs');
 require('../lukso-icon/index.cjs');
-require('../../index-ba49f23a.cjs');
+require('../../index-96c96a31.cjs');
 require('../lukso-dropdown/index.cjs');
 require('../lukso-dropdown-option/index.cjs');
 require('../lukso-sanitize/index.cjs');
 const uniqId = require('../../uniq-id-f0b18085.cjs');
 require('../lukso-image/index.cjs');
-require('../../style-map-b13b92c1.cjs');
+require('../../style-map-ff389c6a.cjs');
 require('../../directive-8278ab14.cjs');
-require('../../index-5df012eb.cjs');
+require('../../index-6bad7e66.cjs');
 require('../../tailwind-config.cjs');
 require('../../cn-b6daa995.cjs');
 
@@ -34,84 +34,84 @@ var __decorateClass = (decorators, target, key, kind) => {
   return result;
 };
 exports.LuksoSelect = class LuksoSelect extends shared_tailwindElement_index.TailwindStyledElement(style) {
-  value = "";
-  placeholder = "";
-  label = "";
-  id = "";
-  description = "";
-  error = "";
-  isFullWidth = false;
-  isReadonly = false;
-  isDisabled = false;
-  borderless = false;
-  options = "";
-  selected = void 0;
-  isOpen = false;
-  openTop = false;
-  isLargeIcon = false;
-  isRight = false;
-  size = "medium";
-  showSelectionCounter = false;
-  optionsParsed = [];
-  valueParsed = void 0;
   constructor() {
     super();
-    if (!this.id) {
-      this.id = uniqId.uniqId();
-    }
-  }
-  inputStyles = index.ce({
-    base: `bg-neutral-100
+    this.value = "";
+    this.placeholder = "";
+    this.label = "";
+    this.id = "";
+    this.description = "";
+    this.error = "";
+    this.isFullWidth = false;
+    this.isReadonly = false;
+    this.isDisabled = false;
+    this.borderless = false;
+    this.options = "";
+    this.selected = void 0;
+    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 = index.ce({
+      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"
-      },
-      isDisabled: {
-        true: "cursor-not-allowed text-neutral-60 group-hover:border-neutral-90"
-      },
-      hasError: {
-        true: "border-red-85 group-hover:border-red-65"
-      },
-      borderless: {
-        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"
+      variants: {
+        isFullWidth: {
+          true: "w-full"
+        },
+        isDisabled: {
+          true: "cursor-not-allowed text-neutral-60 group-hover:border-neutral-90"
+        },
+        hasError: {
+          true: "border-red-85 group-hover:border-red-65"
+        },
+        borderless: {
+          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"
+        }
       }
-    }
-  });
-  counterStyles = index.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.counterStyles = index.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"
+        }
       }
-    }
-  });
-  iconStyles = index.ce({
-    base: "absolute right-0 transition cursor-pointer",
-    variants: {
-      isDisabled: {
-        true: "opacity-60 cursor-not-allowed"
-      },
-      isOpen: {
-        true: "rotate-180"
-      },
-      size: {
-        small: "mr-2",
-        medium: "mr-3"
+    });
+    this.iconStyles = index.ce({
+      base: "absolute right-0 transition cursor-pointer",
+      variants: {
+        isDisabled: {
+          true: "opacity-60 cursor-not-allowed"
+        },
+        isOpen: {
+          true: "rotate-180"
+        },
+        size: {
+          small: "mr-2",
+          medium: "mr-3"
+        }
       }
+    });
+    if (!this.id) {
+      this.id = uniqId.uniqId();
     }
-  });
+  }
   connectedCallback() {
     super.connectedCallback();
     window.addEventListener("click", this.handleOutsideDropdownClick.bind(this));

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

@@ -1,18 +1,18 @@
-import { T as TailwindStyledElement, x, E } from '../../index-2d057f81.js';
-import { n, t } from '../../property-5367c26a.js';
-import { r } from '../../state-bdfaec36.js';
+import { T as TailwindStyledElement, x, E } from '../../index-44537fbb.js';
+import { n, t } from '../../property-27a56e78.js';
+import { r } from '../../state-cda0c5ee.js';
 import { c as ce } from '../../index-d14b6a34.js';
-import { m as makeBlockie } from '../../index-38990f38.js';
+import { m as makeBlockie } from '../../index-2f05f181.js';
 import '../lukso-icon/index.js';
-import '../../index-9ba001cb.js';
+import '../../index-35fd0f44.js';
 import '../lukso-dropdown/index.js';
 import '../lukso-dropdown-option/index.js';
 import '../lukso-sanitize/index.js';
 import { u as uniqId } from '../../uniq-id-ce2d165c.js';
 import '../lukso-image/index.js';
-import '../../style-map-9e6bb4a6.js';
+import '../../style-map-d0cf7858.js';
 import '../../directive-2bb7789e.js';
-import '../../index-5387057e.js';
+import '../../index-1db9d1ee.js';
 import '../../tailwind-config.js';
 import '../../cn-90c03edf.js';
 
@@ -30,84 +30,84 @@ var __decorateClass = (decorators, target, key, kind) => {
   return result;
 };
 let LuksoSelect = class extends TailwindStyledElement(style) {
-  value = "";
-  placeholder = "";
-  label = "";
-  id = "";
-  description = "";
-  error = "";
-  isFullWidth = false;
-  isReadonly = false;
-  isDisabled = false;
-  borderless = false;
-  options = "";
-  selected = void 0;
-  isOpen = false;
-  openTop = false;
-  isLargeIcon = false;
-  isRight = false;
-  size = "medium";
-  showSelectionCounter = false;
-  optionsParsed = [];
-  valueParsed = void 0;
   constructor() {
     super();
-    if (!this.id) {
-      this.id = uniqId();
-    }
-  }
-  inputStyles = ce({
-    base: `bg-neutral-100
+    this.value = "";
+    this.placeholder = "";
+    this.label = "";
+    this.id = "";
+    this.description = "";
+    this.error = "";
+    this.isFullWidth = false;
+    this.isReadonly = false;
+    this.isDisabled = false;
+    this.borderless = false;
+    this.options = "";
+    this.selected = void 0;
+    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
       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"
-      },
-      isDisabled: {
-        true: "cursor-not-allowed text-neutral-60 group-hover:border-neutral-90"
-      },
-      hasError: {
-        true: "border-red-85 group-hover:border-red-65"
-      },
-      borderless: {
-        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"
+      variants: {
+        isFullWidth: {
+          true: "w-full"
+        },
+        isDisabled: {
+          true: "cursor-not-allowed text-neutral-60 group-hover:border-neutral-90"
+        },
+        hasError: {
+          true: "border-red-85 group-hover:border-red-65"
+        },
+        borderless: {
+          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"
+        }
       }
-    }
-  });
-  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.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"
+        }
       }
-    }
-  });
-  iconStyles = ce({
-    base: "absolute right-0 transition cursor-pointer",
-    variants: {
-      isDisabled: {
-        true: "opacity-60 cursor-not-allowed"
-      },
-      isOpen: {
-        true: "rotate-180"
-      },
-      size: {
-        small: "mr-2",
-        medium: "mr-3"
+    });
+    this.iconStyles = ce({
+      base: "absolute right-0 transition cursor-pointer",
+      variants: {
+        isDisabled: {
+          true: "opacity-60 cursor-not-allowed"
+        },
+        isOpen: {
+          true: "rotate-180"
+        },
+        size: {
+          small: "mr-2",
+          medium: "mr-3"
+        }
       }
+    });
+    if (!this.id) {
+      this.id = uniqId();
     }
-  });
+  }
   connectedCallback() {
     super.connectedCallback();
     window.addEventListener("click", this.handleOutsideDropdownClick.bind(this));

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

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const shared_tailwindElement_index = require('../../index-96bba619.cjs');
-const property = require('../../property-98f7e05b.cjs');
+const shared_tailwindElement_index = require('../../index-b103f110.cjs');
+const property = require('../../property-e2dd6303.cjs');
 
 const style = ":host {\n    display: inline-flex\n}";
 
@@ -19,28 +19,31 @@ var __decorateClass = (decorators, target, key, kind) => {
   return result;
 };
 exports.LuksoShare = class LuksoShare extends shared_tailwindElement_index.TailwindStyledElement(style) {
-  customStyle = "";
-  providers = "";
-  defaultProviders = [
-    "twitter",
-    "instagram",
-    "linkedin",
-    "telegram",
-    "discord",
-    "reddit",
-    "medium",
-    "github"
-  ];
-  defaultProviderLinks = {
-    twitter: "https://twitter.com/ERC725Account",
-    instagram: "https://www.instagram.com/lukso",
-    linkedin: "https://linkedin.com/company/lukso",
-    telegram: "https://t.me/LUKSO_News",
-    discord: "https://discord.gg/lukso",
-    reddit: "https://www.reddit.com/r/lukso",
-    medium: "https://medium.com/lukso",
-    github: "https://github.com/lukso-network"
-  };
+  constructor() {
+    super(...arguments);
+    this.customStyle = "";
+    this.providers = "";
+    this.defaultProviders = [
+      "twitter",
+      "instagram",
+      "linkedin",
+      "telegram",
+      "discord",
+      "reddit",
+      "medium",
+      "github"
+    ];
+    this.defaultProviderLinks = {
+      twitter: "https://twitter.com/ERC725Account",
+      instagram: "https://www.instagram.com/lukso",
+      linkedin: "https://linkedin.com/company/lukso",
+      telegram: "https://t.me/LUKSO_News",
+      discord: "https://discord.gg/lukso",
+      reddit: "https://www.reddit.com/r/lukso",
+      medium: "https://medium.com/lukso",
+      github: "https://github.com/lukso-network"
+    };
+  }
   linkTemplate(name, url) {
     return shared_tailwindElement_index.x`<a
       href=${url}

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

@@ -1,5 +1,5 @@
-import { T as TailwindStyledElement, x } from '../../index-2d057f81.js';
-import { n, t } from '../../property-5367c26a.js';
+import { T as TailwindStyledElement, x } from '../../index-44537fbb.js';
+import { n, t } from '../../property-27a56e78.js';
 
 const style = ":host {\n    display: inline-flex\n}";
 
@@ -15,28 +15,31 @@ var __decorateClass = (decorators, target, key, kind) => {
   return result;
 };
 let LuksoShare = class extends TailwindStyledElement(style) {
-  customStyle = "";
-  providers = "";
-  defaultProviders = [
-    "twitter",
-    "instagram",
-    "linkedin",
-    "telegram",
-    "discord",
-    "reddit",
-    "medium",
-    "github"
-  ];
-  defaultProviderLinks = {
-    twitter: "https://twitter.com/ERC725Account",
-    instagram: "https://www.instagram.com/lukso",
-    linkedin: "https://linkedin.com/company/lukso",
-    telegram: "https://t.me/LUKSO_News",
-    discord: "https://discord.gg/lukso",
-    reddit: "https://www.reddit.com/r/lukso",
-    medium: "https://medium.com/lukso",
-    github: "https://github.com/lukso-network"
-  };
+  constructor() {
+    super(...arguments);
+    this.customStyle = "";
+    this.providers = "";
+    this.defaultProviders = [
+      "twitter",
+      "instagram",
+      "linkedin",
+      "telegram",
+      "discord",
+      "reddit",
+      "medium",
+      "github"
+    ];
+    this.defaultProviderLinks = {
+      twitter: "https://twitter.com/ERC725Account",
+      instagram: "https://www.instagram.com/lukso",
+      linkedin: "https://linkedin.com/company/lukso",
+      telegram: "https://t.me/LUKSO_News",
+      discord: "https://discord.gg/lukso",
+      reddit: "https://www.reddit.com/r/lukso",
+      medium: "https://medium.com/lukso",
+      github: "https://github.com/lukso-network"
+    };
+  }
   linkTemplate(name, url) {
     return x`<a
       href=${url}

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

@@ -2,9 +2,9 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const shared_tailwindElement_index = require('../../index-96bba619.cjs');
-const property = require('../../property-98f7e05b.cjs');
-const styleMap = require('../../style-map-b13b92c1.cjs');
+const shared_tailwindElement_index = require('../../index-b103f110.cjs');
+const property = require('../../property-e2dd6303.cjs');
+const styleMap = require('../../style-map-ff389c6a.cjs');
 const index = require('../../index-2b104ecb.cjs');
 const uniqId = require('../../uniq-id-f0b18085.cjs');
 require('../lukso-sanitize/index.cjs');
@@ -23,14 +23,53 @@ var __decorateClass = (decorators, target, key, kind) => {
 };
 const DEFAULT_COLOR = "green-54";
 exports.LuksoSwitch = class LuksoSwitch extends shared_tailwindElement_index.TailwindElement {
-  color = DEFAULT_COLOR;
-  id = "";
-  name = "switch";
-  label = "";
-  description = "";
-  error = "";
-  isChecked = false;
-  isDisabled = false;
+  constructor() {
+    super();
+    this.color = DEFAULT_COLOR;
+    this.id = "";
+    this.name = "switch";
+    this.label = "";
+    this.description = "";
+    this.error = "";
+    this.isChecked = false;
+    this.isDisabled = false;
+    this.styles = index.ce({
+      slots: {
+        label: "transition duration-300 ease-in block h-6 overflow-hidden rounded-full relative inline-block w-10",
+        input: "absolute block w-6 h-6 rounded-full bg-white border-2 appearance-none transition duration-300 ease-in"
+      },
+      variants: {
+        isChecked: {
+          true: {
+            input: "translate-x-4"
+          },
+          false: {
+            label: "bg-neutral-90",
+            input: "border-neutral-90"
+          }
+        },
+        isDisabled: {
+          true: {
+            label: "opacity-70 cursor-not-allowed",
+            input: "cursor-not-allowed"
+          },
+          false: {
+            label: "cursor-pointer",
+            input: "cursor-pointer"
+          }
+        },
+        hasError: {
+          true: {
+            label: "!bg-red-65",
+            input: "!border-red-65"
+          }
+        }
+      }
+    });
+    if (!this.id) {
+      this.id = `switch-${uniqId.uniqId()}`;
+    }
+  }
   async handleChange(event) {
     const target = event.target;
     await this.updateComplete;
@@ -44,45 +83,6 @@ exports.LuksoSwitch = class LuksoSwitch extends shared_tailwindElement_index.Tai
     });
     this.dispatchEvent(changeEvent);
   }
-  constructor() {
-    super();
-    if (!this.id) {
-      this.id = `switch-${uniqId.uniqId()}`;
-    }
-  }
-  styles = index.ce({
-    slots: {
-      label: "transition duration-300 ease-in block h-6 overflow-hidden rounded-full relative inline-block w-10",
-      input: "absolute block w-6 h-6 rounded-full bg-white border-2 appearance-none transition duration-300 ease-in"
-    },
-    variants: {
-      isChecked: {
-        true: {
-          input: "translate-x-4"
-        },
-        false: {
-          label: "bg-neutral-90",
-          input: "border-neutral-90"
-        }
-      },
-      isDisabled: {
-        true: {
-          label: "opacity-70 cursor-not-allowed",
-          input: "cursor-not-allowed"
-        },
-        false: {
-          label: "cursor-pointer",
-          input: "cursor-pointer"
-        }
-      },
-      hasError: {
-        true: {
-          label: "!bg-red-65",
-          input: "!border-red-65"
-        }
-      }
-    }
-  });
   labelTemplate() {
     return shared_tailwindElement_index.x`
       <div