@lukso/web-components 1.128.0 → 1.130.0

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

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const shared_tailwindElement_index = require('../../index-4145c314.cjs');
-const property = require('../../property-cba034d3.cjs');
+const shared_tailwindElement_index = require('../../index-1fd569a9.cjs');
+const property = require('../../property-7a90cede.cjs');
 
 const style = ":host {\n    display: inline-flex\n}";
 
@@ -19,31 +19,28 @@ var __decorateClass = (decorators, target, key, kind) => {
   return result;
 };
 exports.LuksoShare = class LuksoShare extends shared_tailwindElement_index.TailwindStyledElement(style) {
-  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"
-    };
-  }
+  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"
+  };
   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-a09c053e.js';
-import { n, t } from '../../property-6d71df6f.js';
+import { T as TailwindStyledElement, x } from '../../index-82b4fdeb.js';
+import { n, t } from '../../property-cfc5fabd.js';
 
 const style = ":host {\n    display: inline-flex\n}";
 
@@ -15,31 +15,28 @@ var __decorateClass = (decorators, target, key, kind) => {
   return result;
 };
 let LuksoShare = class extends TailwindStyledElement(style) {
-  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"
-    };
-  }
+  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"
+  };
   linkTemplate(name, url) {
     return x`<a
       href=${url}

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

@@ -2,11 +2,12 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const shared_tailwindElement_index = require('../../index-4145c314.cjs');
-const property = require('../../property-cba034d3.cjs');
-const styleMap = require('../../style-map-41455c7b.cjs');
+const shared_tailwindElement_index = require('../../index-1fd569a9.cjs');
+const property = require('../../property-7a90cede.cjs');
+const styleMap = require('../../style-map-2abffb39.cjs');
 const index = require('../../index-2b104ecb.cjs');
 const uniqId = require('../../uniq-id-f0b18085.cjs');
+require('../lukso-sanitize/index.cjs');
 require('../../directive-8278ab14.cjs');
 
 var __defProp = Object.defineProperty;
@@ -22,53 +23,14 @@ var __decorateClass = (decorators, target, key, kind) => {
 };
 const DEFAULT_COLOR = "green-54";
 exports.LuksoSwitch = class LuksoSwitch extends shared_tailwindElement_index.TailwindElement {
-  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()}`;
-    }
-  }
+  color = DEFAULT_COLOR;
+  id = "";
+  name = "switch";
+  label = "";
+  description = "";
+  error = "";
+  isChecked = false;
+  isDisabled = false;
   async handleChange(event) {
     const target = event.target;
     await this.updateComplete;
@@ -82,6 +44,45 @@ 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
@@ -93,7 +94,7 @@ exports.LuksoSwitch = class LuksoSwitch extends shared_tailwindElement_index.Tai
   descriptionTemplate() {
     return shared_tailwindElement_index.x`
       <div class="paragraph-inter-12-regular text-neutral-20 pb-2">
-        ${this.description ?? shared_tailwindElement_index.E}
+        <lukso-sanitize html-content=${this.description}></lukso-sanitize>
       </div>
     `;
   }

package/dist/components/lukso-switch/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-switch/index.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAA;AAI3D,qBACa,WAAY,SAAQ,eAAe;IAE9C,KAAK,SAAgB;IAGrB,EAAE,SAAK;IAGP,IAAI,SAAW;IAGf,KAAK,SAAK;IAGV,WAAW,SAAK;IAGhB,KAAK,SAAK;IAGV,SAAS,UAAQ;IAMjB,UAAU,UAAQ;YAEJ,YAAY;;IAsB1B,OAAO,CAAC,MAAM,CAkCZ;IAEF,aAAa;IASb,mBAAmB;IAQnB,aAAa;IAMb,MAAM;CA4CP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,WAAW,CAAA;KAC5B;CACF"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-switch/index.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAA;AAC3D,OAAO,6BAA6B,CAAA;AAIpC,qBACa,WAAY,SAAQ,eAAe;IAE9C,KAAK,SAAgB;IAGrB,EAAE,SAAK;IAGP,IAAI,SAAW;IAGf,KAAK,SAAK;IAGV,WAAW,SAAK;IAGhB,KAAK,SAAK;IAGV,SAAS,UAAQ;IAMjB,UAAU,UAAQ;YAEJ,YAAY;;IAsB1B,OAAO,CAAC,MAAM,CAkCZ;IAEF,aAAa;IASb,mBAAmB;IAQnB,aAAa;IAMb,MAAM;CA4CP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,WAAW,CAAA;KAC5B;CACF"}

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

@@ -1,8 +1,9 @@
-import { a as TailwindElement, x, E } from '../../index-a09c053e.js';
-import { n, t } from '../../property-6d71df6f.js';
-import { o } from '../../style-map-745a1d23.js';
+import { a as TailwindElement, x, E } from '../../index-82b4fdeb.js';
+import { n, t } from '../../property-cfc5fabd.js';
+import { o } from '../../style-map-c8670fc8.js';
 import { c as ce } from '../../index-d14b6a34.js';
 import { u as uniqId } from '../../uniq-id-ce2d165c.js';
+import '../lukso-sanitize/index.js';
 import '../../directive-2bb7789e.js';
 
 var __defProp = Object.defineProperty;
@@ -18,53 +19,14 @@ var __decorateClass = (decorators, target, key, kind) => {
 };
 const DEFAULT_COLOR = "green-54";
 let LuksoSwitch = class extends TailwindElement {
-  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 = 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()}`;
-    }
-  }
+  color = DEFAULT_COLOR;
+  id = "";
+  name = "switch";
+  label = "";
+  description = "";
+  error = "";
+  isChecked = false;
+  isDisabled = false;
   async handleChange(event) {
     const target = event.target;
     await this.updateComplete;
@@ -78,6 +40,45 @@ let LuksoSwitch = class extends TailwindElement {
     });
     this.dispatchEvent(changeEvent);
   }
+  constructor() {
+    super();
+    if (!this.id) {
+      this.id = `switch-${uniqId()}`;
+    }
+  }
+  styles = 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 x`
       <div
@@ -89,7 +90,7 @@ let LuksoSwitch = class extends TailwindElement {
   descriptionTemplate() {
     return x`
       <div class="paragraph-inter-12-regular text-neutral-20 pb-2">
-        ${this.description ?? E}
+        <lukso-sanitize html-content=${this.description}></lukso-sanitize>
       </div>
     `;
   }

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

@@ -2,10 +2,10 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const shared_tailwindElement_index = require('../../index-4145c314.cjs');
-const property = require('../../property-cba034d3.cjs');
+const shared_tailwindElement_index = require('../../index-1fd569a9.cjs');
+const property = require('../../property-7a90cede.cjs');
 const index = require('../../index-2b104ecb.cjs');
-const index$1 = require('../../index-664bbe9a.cjs');
+const index$1 = require('../../index-8eb2e6d8.cjs');
 require('../../directive-8278ab14.cjs');
 
 const style = ":host {\n    display: inline-flex\n}";
@@ -22,39 +22,36 @@ var __decorateClass = (decorators, target, key, kind) => {
   return result;
 };
 exports.LuksoTag = class LuksoTag extends shared_tailwindElement_index.TailwindStyledElement(style) {
-  constructor() {
-    super(...arguments);
-    this.size = "small";
-    this.isRounded = false;
-    this.backgroundColor = "";
-    this.borderColor = "";
-    this.textColor = "";
-    this.tagStyles = index.ce({
-      base: "inline-flex items-center justify-center border border-neutral-20 text-neutral-20 px-2 whitespace-nowrap",
-      variants: {
-        size: {
-          "x-small": "font-inter text-8 font-500 leading-20 h-[20px] px-1 rounded-4",
-          small: "paragraph-inter-12-medium h-[28px] px-2 rounded-8",
-          large: "paragraph-inter-14-medium h-[34px] px-4 rounded-8"
-        },
-        isRounded: {
-          true: "rounded-[56px]"
-        }
+  size = "small";
+  isRounded = false;
+  backgroundColor = "";
+  borderColor = "";
+  textColor = "";
+  tagStyles = index.ce({
+    base: "inline-flex items-center justify-center border border-neutral-20 text-neutral-20 px-2 whitespace-nowrap",
+    variants: {
+      size: {
+        "x-small": "font-inter text-8 font-500 leading-20 h-[20px] px-1 rounded-4",
+        small: "paragraph-inter-12-medium h-[28px] px-2 rounded-8",
+        large: "paragraph-inter-14-medium h-[34px] px-4 rounded-8"
       },
-      compoundVariants: [
-        {
-          size: "small",
-          isRounded: true,
-          class: "px-3"
-        },
-        {
-          size: "x-small",
-          isRounded: true,
-          class: "px-2"
-        }
-      ]
-    });
-  }
+      isRounded: {
+        true: "rounded-[56px]"
+      }
+    },
+    compoundVariants: [
+      {
+        size: "small",
+        isRounded: true,
+        class: "px-3"
+      },
+      {
+        size: "x-small",
+        isRounded: true,
+        class: "px-2"
+      }
+    ]
+  });
   resolveBorderColor() {
     if (this.borderColor) {
       return this.borderColor;

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

@@ -1,7 +1,7 @@
-import { T as TailwindStyledElement, x } from '../../index-a09c053e.js';
-import { n, t } from '../../property-6d71df6f.js';
+import { T as TailwindStyledElement, x } from '../../index-82b4fdeb.js';
+import { n, t } from '../../property-cfc5fabd.js';
 import { c as ce } from '../../index-d14b6a34.js';
-import { c as customStyleMap } from '../../index-323568a1.js';
+import { c as customStyleMap } from '../../index-11b4b329.js';
 import '../../directive-2bb7789e.js';
 
 const style = ":host {\n    display: inline-flex\n}";
@@ -18,39 +18,36 @@ var __decorateClass = (decorators, target, key, kind) => {
   return result;
 };
 let LuksoTag = class extends TailwindStyledElement(style) {
-  constructor() {
-    super(...arguments);
-    this.size = "small";
-    this.isRounded = false;
-    this.backgroundColor = "";
-    this.borderColor = "";
-    this.textColor = "";
-    this.tagStyles = ce({
-      base: "inline-flex items-center justify-center border border-neutral-20 text-neutral-20 px-2 whitespace-nowrap",
-      variants: {
-        size: {
-          "x-small": "font-inter text-8 font-500 leading-20 h-[20px] px-1 rounded-4",
-          small: "paragraph-inter-12-medium h-[28px] px-2 rounded-8",
-          large: "paragraph-inter-14-medium h-[34px] px-4 rounded-8"
-        },
-        isRounded: {
-          true: "rounded-[56px]"
-        }
+  size = "small";
+  isRounded = false;
+  backgroundColor = "";
+  borderColor = "";
+  textColor = "";
+  tagStyles = ce({
+    base: "inline-flex items-center justify-center border border-neutral-20 text-neutral-20 px-2 whitespace-nowrap",
+    variants: {
+      size: {
+        "x-small": "font-inter text-8 font-500 leading-20 h-[20px] px-1 rounded-4",
+        small: "paragraph-inter-12-medium h-[28px] px-2 rounded-8",
+        large: "paragraph-inter-14-medium h-[34px] px-4 rounded-8"
       },
-      compoundVariants: [
-        {
-          size: "small",
-          isRounded: true,
-          class: "px-3"
-        },
-        {
-          size: "x-small",
-          isRounded: true,
-          class: "px-2"
-        }
-      ]
-    });
-  }
+      isRounded: {
+        true: "rounded-[56px]"
+      }
+    },
+    compoundVariants: [
+      {
+        size: "small",
+        isRounded: true,
+        class: "px-3"
+      },
+      {
+        size: "x-small",
+        isRounded: true,
+        class: "px-2"
+      }
+    ]
+  });
   resolveBorderColor() {
     if (this.borderColor) {
       return this.borderColor;

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

@@ -2,14 +2,14 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const shared_tailwindElement_index = require('../../index-4145c314.cjs');
-const property = require('../../property-cba034d3.cjs');
-const state = require('../../state-dd655282.cjs');
+const shared_tailwindElement_index = require('../../index-1fd569a9.cjs');
+const property = require('../../property-7a90cede.cjs');
+const state = require('../../state-09b048f8.cjs');
 const index = require('../../index-e9668573.cjs');
 require('../lukso-icon/index.cjs');
 require('../lukso-sanitize/index.cjs');
 require('../../directive-8278ab14.cjs');
-require('../../style-map-41455c7b.cjs');
+require('../../style-map-2abffb39.cjs');
 
 const style = ":host {\n    display: flex;\n    height: 100%\n}";
 
@@ -25,14 +25,11 @@ var __decorateClass = (decorators, target, key, kind) => {
   return result;
 };
 exports.LuksoTerms = class LuksoTerms extends shared_tailwindElement_index.TailwindStyledElement(style) {
-  constructor() {
-    super(...arguments);
-    this.text = "";
-    this.hasScrollButton = true;
-    this.defaultStyles = `h-[56px] w-full sticky bottom-0 -mt-[56px]
+  text = "";
+  hasScrollButton = true;
+  defaultStyles = `h-[56px] w-full sticky bottom-0 -mt-[56px]
     bg-gradient-to-b from-transparent to-neutral-100/80
     flex justify-center transition-opacity opacity-0`;
-  }
   onScrollBottom() {
     const event = new CustomEvent("on-bottom-scroll", {
       bubbles: true,

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

@@ -1,11 +1,11 @@
-import { T as TailwindStyledElement, x } from '../../index-a09c053e.js';
-import { n, t } from '../../property-6d71df6f.js';
-import { r } from '../../state-a4d47754.js';
+import { T as TailwindStyledElement, x } from '../../index-82b4fdeb.js';
+import { n, t } from '../../property-cfc5fabd.js';
+import { r } from '../../state-1aaee2b7.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-745a1d23.js';
+import '../../style-map-c8670fc8.js';
 
 const style = ":host {\n    display: flex;\n    height: 100%\n}";
 
@@ -21,14 +21,11 @@ var __decorateClass = (decorators, target, key, kind) => {
   return result;
 };
 let LuksoTerms = class extends TailwindStyledElement(style) {
-  constructor() {
-    super(...arguments);
-    this.text = "";
-    this.hasScrollButton = true;
-    this.defaultStyles = `h-[56px] w-full sticky bottom-0 -mt-[56px]
+  text = "";
+  hasScrollButton = true;
+  defaultStyles = `h-[56px] w-full sticky bottom-0 -mt-[56px]
     bg-gradient-to-b from-transparent to-neutral-100/80
     flex justify-center transition-opacity opacity-0`;
-  }
   onScrollBottom() {
     const event = new CustomEvent("on-bottom-scroll", {
       bubbles: true,