@lukso/web-components 1.51.5 → 1.51.6

package/dist/{index-b83c7efa.js → cn-3e29cec8.js}

@@ -1,12 +1,3 @@
-import { T as TailwindStyledElement, x } from './index-04d11436.js';
-import { n, e } from './query-assigned-elements-5d94572f.js';
-import { o } from './style-map-5be28c06.js';
-import './components/lukso-profile/index.js';
-import './color-palette.js';
-import { c as customStyleMap } from './index-ee4182e6.js';
-
-const style = ":host {\n  display: inline-flex;\n  width: 100%;\n}\n\n:host([width]) {\n  width: inherit;\n}";
-
 import.meta.url.replace(/^file:\/\/|\/\w+\.?[jt]s$/g, "").replace(/\/index\.[a-z]+$/g, "");
 
 import.meta.url.replace(/^file:\/\/|\/\w+\.?[jt]s$/g, "").replace(/\/index\.[a-z]+$/g, "");
@@ -2538,324 +2529,4 @@ const cn = (...inputs) => {
   return twMerge(clsx(inputs));
 };
 
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result)
-    __defProp(target, key, result);
-  return result;
-};
-let LuksoCard = class extends TailwindStyledElement(style) {
-  constructor() {
-    super(...arguments);
-    this.variant = "basic";
-    this.backgroundUrl = "";
-    this.profileUrl = "";
-    this.profileAddress = "";
-    this.width = void 0;
-    this.height = void 0;
-    this.customClass = "";
-    this.headerClass = "";
-    this.size = "medium";
-    this.isHoverable = false;
-    this.mediumStyles = `rounded-24 shadow-neutral-drop-shadow-2xl`;
-    this.smallStyles = `rounded-12 shadow-neutral-drop-shadow`;
-    this.smallHoverStyles = `hover:shadow-neutral-drop-shadow-1xl cursor-pointer transition`;
-  }
-  backgroundImageOrGradient() {
-    const opacity = "80";
-    const gradientStart = `#${this.profileAddress.slice(2, 8)}${opacity}`;
-    const gradientEnd = `#${this.profileAddress.slice(36, 42)}${opacity}`;
-    if (this.backgroundUrl) {
-      return `url(${this.backgroundUrl})`;
-    }
-    return `linear-gradient(90deg, ${gradientStart}, ${gradientEnd})`;
-  }
-  basicTemplate() {
-    return x`
-      <div
-        data-testid="card"
-        style=${customStyleMap({
-      [`min-height: ${this.height}px`]: !!this.height,
-      [`width: ${this.width}px`]: !!this.width
-    })}
-        class=${cn("bg-neutral-100", {
-      [this.mediumStyles]: !this.customClass && this.size === "medium",
-      [this.smallStyles]: !this.customClass && this.size === "small",
-      [this.smallHoverStyles]: this.isHoverable && this.size === "small",
-      [this.customClass]: !!this.customClass,
-      "w-full": !this.width
-    })}
-      >
-        <slot name="content"></slot>
-      </div>
-    `;
-  }
-  withHeaderTemplate() {
-    return x`
-      <div
-        data-testid="card"
-        style=${o({
-      minHeight: `${this.height}px`,
-      width: `${this.width}px`
-    })}
-        class=${cn("bg-neutral-100 grid grid-rows-[auto,1fr] overflow-hidden", {
-      [this.mediumStyles]: !this.customClass && this.size === "medium",
-      [this.smallStyles]: !this.customClass && this.size === "small",
-      [this.smallHoverStyles]: this.isHoverable && this.size === "small",
-      [this.customClass]: !!this.customClass,
-      "w-full": !this.width
-    })}
-      >
-        <div class=${this.headerClass}>
-          <slot name="header"></slot>
-        </div>
-        <div class="bg-neutral-100 shadow-neutral-above-shadow-1xl rounded-24">
-          <slot name="content"></slot>
-        </div>
-      </div>
-    `;
-  }
-  profileTemplate() {
-    return x`
-      <div
-        data-testid="card"
-        style=${customStyleMap({
-      [`min-height: ${this.height}px`]: !!this.height,
-      [`width: ${this.width}px`]: !!this.width
-    })}
-        class=${cn("bg-neutral-100 grid", {
-      [this.mediumStyles]: !this.customClass && this.size === "medium",
-      [this.smallStyles]: !this.customClass && this.size === "small",
-      [this.smallHoverStyles]: this.isHoverable && this.size === "small",
-      [this.customClass]: !!this.customClass,
-      "w-full": !this.width
-    })}
-      >
-        <div
-          style=${o({
-      backgroundImage: this.backgroundImageOrGradient()
-    })}
-          class=${cn(
-      "row-end-1 col-span-1 col-end-1 row-span-1 h-full w-full bg-center bg-cover rounded-24 relative",
-      this.headerClass
-    )}
-        >
-          ${this.backgroundUrl && x` <div
-            class="h-full full rounded-[24px_24px_0_0] bg-neutral-20/10 absolute"
-          ></div>`}
-          <div>
-            <slot name="header"></slot>
-          </div>
-        </div>
-        <div
-          class="grid grid-rows-[1fr,auto] row-end-1 col-span-1 col-end-1 row-span-1"
-        >
-          <div></div>
-          <div class="bg-neutral-100 rounded-24 relative">
-            <lukso-profile
-              profile-url=${this.profileUrl}
-              size="large"
-              profile-address=${this.profileAddress}
-              has-identicon
-              class="absolute -top-[40px] left-[calc(50%_-_40px)] z-10"
-            ></lukso-profile>
-            <div
-              class="overflow-hidden w-[153px] h-[70px] -top-[70px] relative mx-auto flex items-end justify-center -mb-3"
-            >
-              <div
-                class="bg-neutral-100 rounded-[103px_103px_0_0] w-[96px] h-[48px]"
-              ></div>
-            </div>
-            <slot name="content"></slot>
-          </div>
-        </div>
-      </div>
-    `;
-  }
-  profile2Template() {
-    return x`
-      <div
-        data-testid="card"
-        style=${customStyleMap({
-      [`min-height: ${this.height}px`]: !!this.height,
-      [`width: ${this.width}px`]: !!this.width
-    })}
-        class=${cn("bg-neutral-100 grid grid-rows-[auto,1fr]", {
-      [this.mediumStyles]: !this.customClass && this.size === "medium",
-      [this.smallStyles]: !this.customClass && this.size === "small",
-      [this.smallHoverStyles]: this.isHoverable && this.size === "small",
-      [this.customClass]: !!this.customClass,
-      ["w-full"]: !this.width
-    })}
-      >
-        <div
-          style=${o({
-      backgroundImage: this.backgroundImageOrGradient()
-    })}
-          class=${cn(
-      "min-h-[129px] -mb-6 bg-center bg-cover rounded-[24px_24px_0_0] relative bg-neutral-100",
-      this.headerClass
-    )}
-        >
-          ${this.backgroundUrl && x`<div
-            class="min-h-full min-w-full rounded-[24px_24px_0_0] bg-neutral-10/10 absolute"
-          ></div>`}
-          <div>
-            <slot name="header"></slot>
-          </div>
-        </div>
-        <div class="grid grid-rows-[max-content,auto]">
-          <div class="bg-neutral-100 relative">
-            <lukso-profile
-              profile-url=${this.profileUrl}
-              size="large"
-              profile-address=${this.profileAddress}
-              has-identicon
-              class="absolute -top-[40px] left-[calc(50%_-_40px)] z-10"
-            ></lukso-profile>
-            <div
-              class="overflow-hidden w-[153px] h-[70px] -top-[70px] relative mx-auto flex items-end justify-center -mb-2"
-            >
-              <div
-                class="bg-neutral-100 rounded-[103px_103px_0_0] w-[96px] h-[48px]"
-              ></div>
-            </div>
-            <slot name="content"></slot>
-          </div>
-          <div
-            class="bg-neutral-97 rounded-b-24 shadow-neutral-inner-shadow-top"
-          >
-            <slot name="bottom"></slot>
-          </div>
-        </div>
-      </div>
-    `;
-  }
-  heroTemplate() {
-    return x`
-      <div
-        data-testid="card"
-        style=${customStyleMap({
-      [`min-height: ${this.height}px`]: !!this.height,
-      [`width: ${this.width}px`]: !!this.width
-    })}
-        class=${cn("h-[240px] flex bg-neutral-100", {
-      [this.mediumStyles]: !this.customClass && this.size === "medium",
-      [this.smallStyles]: !this.customClass && this.size === "small",
-      [this.smallHoverStyles]: this.isHoverable && this.size === "small",
-      [this.customClass]: !!this.customClass,
-      ["w-full"]: !this.width
-    })}
-      >
-        <div
-          style=${o({
-      backgroundImage: `url(${this.backgroundUrl})`
-    })}
-          class="h-full w-full -mb-6 bg-center bg-cover rounded-24 relative"
-        >
-          ${this.backgroundUrl && x`<div
-            class="h-full w-full rounded-24 bg-neutral-20/10 absolute"
-          ></div>`}
-          <div
-            class="h-full w-full flex flex-col items-center justify-center  absolute"
-          >
-            <slot name="content"></slot>
-          </div>
-        </div>
-      </div>
-    `;
-  }
-  dappTemplate() {
-    return x`
-      <div
-        data-testid="card"
-        style=${customStyleMap({
-      [`min-height: ${this.height}px`]: !!this.height,
-      [`width: ${this.width}px`]: !!this.width
-    })}
-        class=${cn("bg-neutral-100 grid grid-rows-[auto,1fr]", {
-      [this.mediumStyles]: !this.customClass && this.size === "medium",
-      [this.smallStyles]: !this.customClass && this.size === "small",
-      [this.smallHoverStyles]: this.isHoverable && this.size === "small",
-      [this.customClass]: !!this.customClass,
-      ["w-full"]: !this.width
-    })}
-      >
-        <div
-          style=${o({
-      backgroundImage: this.backgroundImageOrGradient()
-    })}
-          class=${cn(
-      "min-h-[240px] bg-center bg-cover rounded-[24px_24px_0_0] relative",
-      this.headerClass
-    )}
-        >
-          <div>
-            <slot name="header"></slot>
-          </div>
-        </div>
-        <div
-          class="bg-neutral-100 shadow-neutral-above-shadow-1xl rounded-[0_0_24px_24px] relative"
-        >
-          <slot name="content"></slot>
-        </div>
-      </div>
-    `;
-  }
-  render() {
-    switch (this.variant) {
-      case "with-header":
-        return this.withHeaderTemplate();
-      case "profile":
-        return this.profileTemplate();
-      case "profile-2":
-        return this.profile2Template();
-      case "hero":
-        return this.heroTemplate();
-      case "dapp":
-        return this.dappTemplate();
-      default:
-        return this.basicTemplate();
-    }
-  }
-};
-__decorateClass([
-  n({ type: String })
-], LuksoCard.prototype, "variant", 2);
-__decorateClass([
-  n({ type: String, attribute: "background-url" })
-], LuksoCard.prototype, "backgroundUrl", 2);
-__decorateClass([
-  n({ type: String, attribute: "profile-url" })
-], LuksoCard.prototype, "profileUrl", 2);
-__decorateClass([
-  n({ type: String, attribute: "profile-address" })
-], LuksoCard.prototype, "profileAddress", 2);
-__decorateClass([
-  n({ type: Number })
-], LuksoCard.prototype, "width", 2);
-__decorateClass([
-  n({ type: Number })
-], LuksoCard.prototype, "height", 2);
-__decorateClass([
-  n({ type: String, attribute: "custom-class" })
-], LuksoCard.prototype, "customClass", 2);
-__decorateClass([
-  n({ type: String, attribute: "header-class" })
-], LuksoCard.prototype, "headerClass", 2);
-__decorateClass([
-  n({ type: String })
-], LuksoCard.prototype, "size", 2);
-__decorateClass([
-  n({ type: Boolean, attribute: "is-hoverable" })
-], LuksoCard.prototype, "isHoverable", 2);
-LuksoCard = __decorateClass([
-  e("lukso-card")
-], LuksoCard);
-
-export { LuksoCard as L, cn as c };
+export { cn as c };

package/dist/{index-619f20e8.cjs → cn-98077c72.cjs}

@@ -1,20 +1,11 @@
 'use strict';
 
-const shared_tailwindElement_index = require('./index-997f3f0e.cjs');
-const queryAssignedElements = require('./query-assigned-elements-1d5d9d4c.cjs');
-const styleMap = require('./style-map-671a0511.cjs');
-require('./components/lukso-profile/index.cjs');
-require('./color-palette.cjs');
-const index = require('./index-beb7703d.cjs');
-
 var _documentCurrentScript = typeof document !== 'undefined' ? document.currentScript : null;
-const style = ":host {\n  display: inline-flex;\n  width: 100%;\n}\n\n:host([width]) {\n  width: inherit;\n}";
-
-(typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.src || new URL('index-619f20e8.cjs', document.baseURI).href)).replace(/^file:\/\/|\/\w+\.?[jt]s$/g, "").replace(/\/index\.[a-z]+$/g, "");
+(typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.src || new URL('cn-98077c72.cjs', document.baseURI).href)).replace(/^file:\/\/|\/\w+\.?[jt]s$/g, "").replace(/\/index\.[a-z]+$/g, "");
 
-(typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.src || new URL('index-619f20e8.cjs', document.baseURI).href)).replace(/^file:\/\/|\/\w+\.?[jt]s$/g, "").replace(/\/index\.[a-z]+$/g, "");
+(typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.src || new URL('cn-98077c72.cjs', document.baseURI).href)).replace(/^file:\/\/|\/\w+\.?[jt]s$/g, "").replace(/\/index\.[a-z]+$/g, "");
 
-(typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.src || new URL('index-619f20e8.cjs', document.baseURI).href)).replace(/^file:\/\/|\/\w+\.?[jt]s$/g, "").replace(/\/index\.[a-z]+$/g, "");
+(typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.src || new URL('cn-98077c72.cjs', document.baseURI).href)).replace(/^file:\/\/|\/\w+\.?[jt]s$/g, "").replace(/\/index\.[a-z]+$/g, "");
 
 /**
  * The code in this file is copied from https://github.com/lukeed/clsx and modified to suit the needs of tailwind-merge better.
@@ -2541,324 +2532,4 @@ const cn = (...inputs) => {
   return twMerge(clsx(inputs));
 };
 
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result)
-    __defProp(target, key, result);
-  return result;
-};
-exports.LuksoCard = class LuksoCard extends shared_tailwindElement_index.TailwindStyledElement(style) {
-  constructor() {
-    super(...arguments);
-    this.variant = "basic";
-    this.backgroundUrl = "";
-    this.profileUrl = "";
-    this.profileAddress = "";
-    this.width = void 0;
-    this.height = void 0;
-    this.customClass = "";
-    this.headerClass = "";
-    this.size = "medium";
-    this.isHoverable = false;
-    this.mediumStyles = `rounded-24 shadow-neutral-drop-shadow-2xl`;
-    this.smallStyles = `rounded-12 shadow-neutral-drop-shadow`;
-    this.smallHoverStyles = `hover:shadow-neutral-drop-shadow-1xl cursor-pointer transition`;
-  }
-  backgroundImageOrGradient() {
-    const opacity = "80";
-    const gradientStart = `#${this.profileAddress.slice(2, 8)}${opacity}`;
-    const gradientEnd = `#${this.profileAddress.slice(36, 42)}${opacity}`;
-    if (this.backgroundUrl) {
-      return `url(${this.backgroundUrl})`;
-    }
-    return `linear-gradient(90deg, ${gradientStart}, ${gradientEnd})`;
-  }
-  basicTemplate() {
-    return shared_tailwindElement_index.x`
-      <div
-        data-testid="card"
-        style=${index.customStyleMap({
-      [`min-height: ${this.height}px`]: !!this.height,
-      [`width: ${this.width}px`]: !!this.width
-    })}
-        class=${cn("bg-neutral-100", {
-      [this.mediumStyles]: !this.customClass && this.size === "medium",
-      [this.smallStyles]: !this.customClass && this.size === "small",
-      [this.smallHoverStyles]: this.isHoverable && this.size === "small",
-      [this.customClass]: !!this.customClass,
-      "w-full": !this.width
-    })}
-      >
-        <slot name="content"></slot>
-      </div>
-    `;
-  }
-  withHeaderTemplate() {
-    return shared_tailwindElement_index.x`
-      <div
-        data-testid="card"
-        style=${styleMap.o({
-      minHeight: `${this.height}px`,
-      width: `${this.width}px`
-    })}
-        class=${cn("bg-neutral-100 grid grid-rows-[auto,1fr] overflow-hidden", {
-      [this.mediumStyles]: !this.customClass && this.size === "medium",
-      [this.smallStyles]: !this.customClass && this.size === "small",
-      [this.smallHoverStyles]: this.isHoverable && this.size === "small",
-      [this.customClass]: !!this.customClass,
-      "w-full": !this.width
-    })}
-      >
-        <div class=${this.headerClass}>
-          <slot name="header"></slot>
-        </div>
-        <div class="bg-neutral-100 shadow-neutral-above-shadow-1xl rounded-24">
-          <slot name="content"></slot>
-        </div>
-      </div>
-    `;
-  }
-  profileTemplate() {
-    return shared_tailwindElement_index.x`
-      <div
-        data-testid="card"
-        style=${index.customStyleMap({
-      [`min-height: ${this.height}px`]: !!this.height,
-      [`width: ${this.width}px`]: !!this.width
-    })}
-        class=${cn("bg-neutral-100 grid", {
-      [this.mediumStyles]: !this.customClass && this.size === "medium",
-      [this.smallStyles]: !this.customClass && this.size === "small",
-      [this.smallHoverStyles]: this.isHoverable && this.size === "small",
-      [this.customClass]: !!this.customClass,
-      "w-full": !this.width
-    })}
-      >
-        <div
-          style=${styleMap.o({
-      backgroundImage: this.backgroundImageOrGradient()
-    })}
-          class=${cn(
-      "row-end-1 col-span-1 col-end-1 row-span-1 h-full w-full bg-center bg-cover rounded-24 relative",
-      this.headerClass
-    )}
-        >
-          ${this.backgroundUrl && shared_tailwindElement_index.x` <div
-            class="h-full full rounded-[24px_24px_0_0] bg-neutral-20/10 absolute"
-          ></div>`}
-          <div>
-            <slot name="header"></slot>
-          </div>
-        </div>
-        <div
-          class="grid grid-rows-[1fr,auto] row-end-1 col-span-1 col-end-1 row-span-1"
-        >
-          <div></div>
-          <div class="bg-neutral-100 rounded-24 relative">
-            <lukso-profile
-              profile-url=${this.profileUrl}
-              size="large"
-              profile-address=${this.profileAddress}
-              has-identicon
-              class="absolute -top-[40px] left-[calc(50%_-_40px)] z-10"
-            ></lukso-profile>
-            <div
-              class="overflow-hidden w-[153px] h-[70px] -top-[70px] relative mx-auto flex items-end justify-center -mb-3"
-            >
-              <div
-                class="bg-neutral-100 rounded-[103px_103px_0_0] w-[96px] h-[48px]"
-              ></div>
-            </div>
-            <slot name="content"></slot>
-          </div>
-        </div>
-      </div>
-    `;
-  }
-  profile2Template() {
-    return shared_tailwindElement_index.x`
-      <div
-        data-testid="card"
-        style=${index.customStyleMap({
-      [`min-height: ${this.height}px`]: !!this.height,
-      [`width: ${this.width}px`]: !!this.width
-    })}
-        class=${cn("bg-neutral-100 grid grid-rows-[auto,1fr]", {
-      [this.mediumStyles]: !this.customClass && this.size === "medium",
-      [this.smallStyles]: !this.customClass && this.size === "small",
-      [this.smallHoverStyles]: this.isHoverable && this.size === "small",
-      [this.customClass]: !!this.customClass,
-      ["w-full"]: !this.width
-    })}
-      >
-        <div
-          style=${styleMap.o({
-      backgroundImage: this.backgroundImageOrGradient()
-    })}
-          class=${cn(
-      "min-h-[129px] -mb-6 bg-center bg-cover rounded-[24px_24px_0_0] relative bg-neutral-100",
-      this.headerClass
-    )}
-        >
-          ${this.backgroundUrl && shared_tailwindElement_index.x`<div
-            class="min-h-full min-w-full rounded-[24px_24px_0_0] bg-neutral-10/10 absolute"
-          ></div>`}
-          <div>
-            <slot name="header"></slot>
-          </div>
-        </div>
-        <div class="grid grid-rows-[max-content,auto]">
-          <div class="bg-neutral-100 relative">
-            <lukso-profile
-              profile-url=${this.profileUrl}
-              size="large"
-              profile-address=${this.profileAddress}
-              has-identicon
-              class="absolute -top-[40px] left-[calc(50%_-_40px)] z-10"
-            ></lukso-profile>
-            <div
-              class="overflow-hidden w-[153px] h-[70px] -top-[70px] relative mx-auto flex items-end justify-center -mb-2"
-            >
-              <div
-                class="bg-neutral-100 rounded-[103px_103px_0_0] w-[96px] h-[48px]"
-              ></div>
-            </div>
-            <slot name="content"></slot>
-          </div>
-          <div
-            class="bg-neutral-97 rounded-b-24 shadow-neutral-inner-shadow-top"
-          >
-            <slot name="bottom"></slot>
-          </div>
-        </div>
-      </div>
-    `;
-  }
-  heroTemplate() {
-    return shared_tailwindElement_index.x`
-      <div
-        data-testid="card"
-        style=${index.customStyleMap({
-      [`min-height: ${this.height}px`]: !!this.height,
-      [`width: ${this.width}px`]: !!this.width
-    })}
-        class=${cn("h-[240px] flex bg-neutral-100", {
-      [this.mediumStyles]: !this.customClass && this.size === "medium",
-      [this.smallStyles]: !this.customClass && this.size === "small",
-      [this.smallHoverStyles]: this.isHoverable && this.size === "small",
-      [this.customClass]: !!this.customClass,
-      ["w-full"]: !this.width
-    })}
-      >
-        <div
-          style=${styleMap.o({
-      backgroundImage: `url(${this.backgroundUrl})`
-    })}
-          class="h-full w-full -mb-6 bg-center bg-cover rounded-24 relative"
-        >
-          ${this.backgroundUrl && shared_tailwindElement_index.x`<div
-            class="h-full w-full rounded-24 bg-neutral-20/10 absolute"
-          ></div>`}
-          <div
-            class="h-full w-full flex flex-col items-center justify-center  absolute"
-          >
-            <slot name="content"></slot>
-          </div>
-        </div>
-      </div>
-    `;
-  }
-  dappTemplate() {
-    return shared_tailwindElement_index.x`
-      <div
-        data-testid="card"
-        style=${index.customStyleMap({
-      [`min-height: ${this.height}px`]: !!this.height,
-      [`width: ${this.width}px`]: !!this.width
-    })}
-        class=${cn("bg-neutral-100 grid grid-rows-[auto,1fr]", {
-      [this.mediumStyles]: !this.customClass && this.size === "medium",
-      [this.smallStyles]: !this.customClass && this.size === "small",
-      [this.smallHoverStyles]: this.isHoverable && this.size === "small",
-      [this.customClass]: !!this.customClass,
-      ["w-full"]: !this.width
-    })}
-      >
-        <div
-          style=${styleMap.o({
-      backgroundImage: this.backgroundImageOrGradient()
-    })}
-          class=${cn(
-      "min-h-[240px] bg-center bg-cover rounded-[24px_24px_0_0] relative",
-      this.headerClass
-    )}
-        >
-          <div>
-            <slot name="header"></slot>
-          </div>
-        </div>
-        <div
-          class="bg-neutral-100 shadow-neutral-above-shadow-1xl rounded-[0_0_24px_24px] relative"
-        >
-          <slot name="content"></slot>
-        </div>
-      </div>
-    `;
-  }
-  render() {
-    switch (this.variant) {
-      case "with-header":
-        return this.withHeaderTemplate();
-      case "profile":
-        return this.profileTemplate();
-      case "profile-2":
-        return this.profile2Template();
-      case "hero":
-        return this.heroTemplate();
-      case "dapp":
-        return this.dappTemplate();
-      default:
-        return this.basicTemplate();
-    }
-  }
-};
-__decorateClass([
-  queryAssignedElements.n({ type: String })
-], exports.LuksoCard.prototype, "variant", 2);
-__decorateClass([
-  queryAssignedElements.n({ type: String, attribute: "background-url" })
-], exports.LuksoCard.prototype, "backgroundUrl", 2);
-__decorateClass([
-  queryAssignedElements.n({ type: String, attribute: "profile-url" })
-], exports.LuksoCard.prototype, "profileUrl", 2);
-__decorateClass([
-  queryAssignedElements.n({ type: String, attribute: "profile-address" })
-], exports.LuksoCard.prototype, "profileAddress", 2);
-__decorateClass([
-  queryAssignedElements.n({ type: Number })
-], exports.LuksoCard.prototype, "width", 2);
-__decorateClass([
-  queryAssignedElements.n({ type: Number })
-], exports.LuksoCard.prototype, "height", 2);
-__decorateClass([
-  queryAssignedElements.n({ type: String, attribute: "custom-class" })
-], exports.LuksoCard.prototype, "customClass", 2);
-__decorateClass([
-  queryAssignedElements.n({ type: String, attribute: "header-class" })
-], exports.LuksoCard.prototype, "headerClass", 2);
-__decorateClass([
-  queryAssignedElements.n({ type: String })
-], exports.LuksoCard.prototype, "size", 2);
-__decorateClass([
-  queryAssignedElements.n({ type: Boolean, attribute: "is-hoverable" })
-], exports.LuksoCard.prototype, "isHoverable", 2);
-exports.LuksoCard = __decorateClass([
-  queryAssignedElements.e("lukso-card")
-], exports.LuksoCard);
-
 exports.cn = cn;