@lukso/web-components 1.61.0 → 1.63.0

package/dist/components/index.cjs

@@ -23,15 +23,15 @@ const components_luksoTest_index = require('./lukso-test/index.cjs');
 const components_luksoTooltip_index = require('./lukso-tooltip/index.cjs');
 const components_luksoUsername_index = require('./lukso-username/index.cjs');
 const components_luksoWizard_index = require('./lukso-wizard/index.cjs');
-const shared_tailwindElement_index = require('../index-4964f1aa.cjs');
+const shared_tailwindElement_index = require('../index-688c3040.cjs');
 require('../cn-4ec0bd94.cjs');
 require('../query-assigned-elements-1d5d9d4c.cjs');
 require('../state-f73a8b4f.cjs');
 require('../index-e8741080.cjs');
 require('../tailwind-config.cjs');
-require('../style-map-0e5b61bc.cjs');
+require('../style-map-c86dd6e2.cjs');
 require('../directive-8278ab14.cjs');
-require('../index-b1813aa6.cjs');
+require('../index-98e8e0d5.cjs');
 require('../index-e9668573.cjs');
 
 

package/dist/components/index.js

@@ -19,13 +19,13 @@ export { LuksoTest } from './lukso-test/index.js';
 export { LuksoTooltip } from './lukso-tooltip/index.js';
 export { LuksoUsername } from './lukso-username/index.js';
 export { LuksoWizard } from './lukso-wizard/index.js';
-export { a as TailwindElement, T as TailwindStyledElement } from '../index-2cbce78e.js';
+export { a as TailwindElement, T as TailwindStyledElement } from '../index-3527fb14.js';
 import '../cn-616567d4.js';
 import '../query-assigned-elements-5d94572f.js';
 import '../state-0a779257.js';
 import '../index-c55a1069.js';
 import '../tailwind-config.js';
-import '../style-map-ec917798.js';
+import '../style-map-9fdda015.js';
 import '../directive-2bb7789e.js';
-import '../index-61181f2e.js';
+import '../index-1765cfe1.js';
 import '../index-5e194caf.js';

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const shared_tailwindElement_index = require('../../index-4964f1aa.cjs');
+const shared_tailwindElement_index = require('../../index-688c3040.cjs');
 const queryAssignedElements = require('../../query-assigned-elements-1d5d9d4c.cjs');
 const state = require('../../state-f73a8b4f.cjs');
 const index = require('../../index-e8741080.cjs');

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

@@ -1,4 +1,4 @@
-import { T as TailwindStyledElement, x, A } from '../../index-2cbce78e.js';
+import { T as TailwindStyledElement, x, A } from '../../index-3527fb14.js';
 import { n, e } from '../../query-assigned-elements-5d94572f.js';
 import { t } from '../../state-0a779257.js';
 import { s as se } from '../../index-c55a1069.js';

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

@@ -2,14 +2,14 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const shared_tailwindElement_index = require('../../index-4964f1aa.cjs');
+const shared_tailwindElement_index = require('../../index-688c3040.cjs');
 const queryAssignedElements = require('../../query-assigned-elements-1d5d9d4c.cjs');
-const styleMap = require('../../style-map-0e5b61bc.cjs');
+const styleMap = require('../../style-map-c86dd6e2.cjs');
 const index = require('../../index-e8741080.cjs');
 require('../lukso-profile/index.cjs');
 require('../../tailwind-config.cjs');
 const cn = require('../../cn-4ec0bd94.cjs');
-const index$1 = require('../../index-b1813aa6.cjs');
+const index$1 = require('../../index-98e8e0d5.cjs');
 require('../../directive-8278ab14.cjs');
 require('../../index-e9668573.cjs');
 
@@ -37,7 +37,7 @@ exports.LuksoCard = class LuksoCard extends shared_tailwindElement_index.Tailwin
     this.height = void 0;
     this.customClass = "";
     this.headerClass = "";
-    this.size = "medium";
+    this.borderRadius = "medium";
     this.shadow = "large";
     this.isHoverable = false;
     this.mediumStyles = `rounded-24 shadow-neutral-drop-shadow-2xl`;
@@ -46,7 +46,8 @@ exports.LuksoCard = class LuksoCard extends shared_tailwindElement_index.Tailwin
     this.cardStyles = index.se({
       base: `bg-neutral-100`,
       variants: {
-        size: {
+        borderRadius: {
+          none: `rounded-0`,
           small: `rounded-12`,
           medium: `rounded-24`
         },
@@ -96,7 +97,7 @@ exports.LuksoCard = class LuksoCard extends shared_tailwindElement_index.Tailwin
   }
   basicTemplate() {
     const cardStyles = this.cardStyles({
-      size: this.size,
+      borderRadius: this.borderRadius,
       shadow: this.shadow,
       isHoverable: this.isHoverable,
       hasNoWidth: !this.width
@@ -116,7 +117,7 @@ exports.LuksoCard = class LuksoCard extends shared_tailwindElement_index.Tailwin
   }
   withHeaderTemplate() {
     const cardStyles = this.cardStyles({
-      size: this.size,
+      borderRadius: this.borderRadius,
       shadow: this.shadow,
       isHoverable: this.isHoverable,
       hasNoWidth: !this.width,
@@ -134,7 +135,9 @@ exports.LuksoCard = class LuksoCard extends shared_tailwindElement_index.Tailwin
         <div class=${this.headerClass}>
           <slot name="header"></slot>
         </div>
-        <div class="bg-neutral-100 shadow-neutral-above-shadow-1xl rounded-24">
+        <div
+          class="bg-neutral-100 shadow-neutral-above-shadow-1xl rounded-[inherit]"
+        >
           <slot name="content"></slot>
         </div>
       </div>
@@ -142,7 +145,7 @@ exports.LuksoCard = class LuksoCard extends shared_tailwindElement_index.Tailwin
   }
   profileTemplate() {
     const cardStyles = this.cardStyles({
-      size: this.size,
+      borderRadius: this.borderRadius,
       shadow: this.shadow,
       isHoverable: this.isHoverable,
       hasNoWidth: !this.width,
@@ -162,12 +165,12 @@ exports.LuksoCard = class LuksoCard extends shared_tailwindElement_index.Tailwin
       backgroundImage: this.backgroundImageOrGradient()
     })}
           class=${cn.cn(
-      "min-h-[92px] -mb-6 w-full bg-center bg-cover rounded-[24px_24px_0_0] relative",
+      "min-h-[92px] -mb-6 w-full bg-center bg-cover rounded-t-[inherit] rounded-b-0 relative",
       this.headerClass
     )}
         >
           ${this.backgroundUrl && shared_tailwindElement_index.x` <div
-            class="h-full full rounded-[24px_24px_0_0] bg-neutral-20/10 absolute"
+            class="h-full full rounded-t-[inherit] rounded-b-0 bg-neutral-20/10 absolute"
           ></div>`}
           <div>
             <slot name="header"></slot>
@@ -178,11 +181,11 @@ exports.LuksoCard = class LuksoCard extends shared_tailwindElement_index.Tailwin
           style=${index$1.customStyleMap({
       [`width: ${this.width}px`]: !!this.width
     })}
-          class="bg-neutral-100 rounded-24 relative break-normal"
+          class="bg-neutral-100 rounded-[inherit] relative break-normal"
         >
           <lukso-profile
             profile-url=${this.profileUrl}
-            size="large"
+            borderRadius="large"
             profile-address=${this.profileAddress}
             has-identicon
             class="absolute -top-[40px] left-[calc(50%_-_40px)] z-10"
@@ -201,7 +204,7 @@ exports.LuksoCard = class LuksoCard extends shared_tailwindElement_index.Tailwin
   }
   profile2Template() {
     const cardStyles = this.cardStyles({
-      size: this.size,
+      borderRadius: this.borderRadius,
       shadow: this.shadow,
       isHoverable: this.isHoverable,
       hasNoWidth: !this.width,
@@ -221,22 +224,22 @@ exports.LuksoCard = class LuksoCard extends shared_tailwindElement_index.Tailwin
       backgroundImage: this.backgroundImageOrGradient()
     })}
           class=${cn.cn(
-      "min-h-[129px] -mb-6 bg-center bg-cover rounded-[24px_24px_0_0] relative bg-neutral-100",
+      "min-h-[129px] -mb-6 bg-center bg-cover rounded-t-[inherit] rounded-b-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"
+            class="min-h-full min-w-full rounded-t-[inherit] rounded-b-0 bg-neutral-10/10 absolute"
           ></div>`}
           <div>
             <slot name="header"></slot>
           </div>
         </div>
-        <div class="grid grid-rows-[max-content,auto]">
+        <div class="grid grid-rows-[max-content,auto] rounded-b-[inherit]">
           <div class="bg-neutral-100 relative">
             <lukso-profile
               profile-url=${this.profileUrl}
-              size="large"
+              borderRadius="large"
               profile-address=${this.profileAddress}
               has-identicon
               class="absolute -top-[40px] left-[calc(50%_-_40px)] z-10"
@@ -251,7 +254,7 @@ exports.LuksoCard = class LuksoCard extends shared_tailwindElement_index.Tailwin
             <slot name="content"></slot>
           </div>
           <div
-            class="bg-neutral-97 rounded-b-24 shadow-neutral-inner-shadow-top"
+            class="bg-neutral-97 rounded-b-[inherit] shadow-neutral-inner-shadow-top"
           >
             <slot name="bottom"></slot>
           </div>
@@ -261,7 +264,7 @@ exports.LuksoCard = class LuksoCard extends shared_tailwindElement_index.Tailwin
   }
   heroTemplate() {
     const cardStyles = this.cardStyles({
-      size: this.size,
+      borderRadius: this.borderRadius,
       shadow: this.shadow,
       isHoverable: this.isHoverable,
       hasNoWidth: !this.width,
@@ -280,10 +283,10 @@ exports.LuksoCard = class LuksoCard extends shared_tailwindElement_index.Tailwin
           style=${styleMap.o({
       backgroundImage: `url('${this.backgroundUrl}')`
     })}
-          class="h-full w-full -mb-6 bg-center bg-cover rounded-24 relative"
+          class="h-full w-full -mb-6 bg-center bg-cover rounded-[inherit] relative"
         >
           ${this.backgroundUrl && shared_tailwindElement_index.x`<div
-            class="h-full w-full rounded-24 bg-neutral-20/10 absolute"
+            class="h-full w-full rounded-[inherit] bg-neutral-20/10 absolute"
           ></div>`}
           <div
             class="h-full w-full flex flex-col items-center justify-center  absolute"
@@ -296,7 +299,7 @@ exports.LuksoCard = class LuksoCard extends shared_tailwindElement_index.Tailwin
   }
   dappTemplate() {
     const cardStyles = this.cardStyles({
-      size: this.size,
+      borderRadius: this.borderRadius,
       shadow: this.shadow,
       isHoverable: this.isHoverable,
       hasNoWidth: !this.width,
@@ -316,7 +319,7 @@ exports.LuksoCard = class LuksoCard extends shared_tailwindElement_index.Tailwin
       backgroundImage: this.backgroundImageOrGradient()
     })}
           class=${cn.cn(
-      "min-h-[240px] bg-center bg-cover rounded-[24px_24px_0_0] relative",
+      "min-h-[240px] bg-center bg-cover rounded-t-[inherit] rounded-b-0 relative",
       this.headerClass
     )}
         >
@@ -325,7 +328,7 @@ exports.LuksoCard = class LuksoCard extends shared_tailwindElement_index.Tailwin
           </div>
         </div>
         <div
-          class="bg-neutral-100 shadow-neutral-above-shadow-1xl rounded-[0_0_24px_24px] relative"
+          class="bg-neutral-100 shadow-neutral-above-shadow-1xl rounded-t-0 rounded-b-[inherit] relative"
         >
           <slot name="content"></slot>
         </div>
@@ -374,8 +377,8 @@ __decorateClass([
   queryAssignedElements.n({ type: String, attribute: "header-class" })
 ], exports.LuksoCard.prototype, "headerClass", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: String })
-], exports.LuksoCard.prototype, "size", 2);
+  queryAssignedElements.n({ type: String, attribute: "border-radius" })
+], exports.LuksoCard.prototype, "borderRadius", 2);
 __decorateClass([
   queryAssignedElements.n({ type: String })
 ], exports.LuksoCard.prototype, "shadow", 2);

package/dist/components/lukso-card/index.d.ts

@@ -1,5 +1,5 @@
 export type CardVariants = 'basic' | 'with-header' | 'profile' | 'profile-2' | 'hero' | 'dapp';
-export type CardSizes = 'small' | 'medium';
+export type CardBorderRadius = 'small' | 'medium' | 'none';
 export type CardShadows = 'small' | 'medium' | 'large';
 declare const LuksoCard_base: typeof import("lit").LitElement;
 export declare class LuksoCard extends LuksoCard_base {
@@ -11,7 +11,7 @@ export declare class LuksoCard extends LuksoCard_base {
     height: number | undefined;
     customClass: string;
     headerClass: string;
-    size: CardSizes;
+    borderRadius: CardBorderRadius;
     shadow: CardShadows;
     isHoverable: boolean;
     private mediumStyles;

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-card/index.ts"],"names":[],"mappings":"AAOA,OAAO,4BAA4B,CAAA;AAInC,MAAM,MAAM,YAAY,GACpB,OAAO,GACP,aAAa,GACb,SAAS,GACT,WAAW,GACX,MAAM,GACN,MAAM,CAAA;AAEV,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,QAAQ,CAAA;AAE1C,MAAM,MAAM,WAAW,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;;AAEtD,qBACa,SAAU,SAAQ,cAA4B;IAEzD,OAAO,EAAE,YAAY,CAAU;IAG/B,aAAa,SAAK;IAGlB,UAAU,SAAK;IAGf,cAAc,SAAK;IAGnB,KAAK,EAAE,MAAM,GAAG,SAAS,CAAY;IAGrC,MAAM,EAAE,MAAM,GAAG,SAAS,CAAY;IAGtC,WAAW,SAAK;IAGhB,WAAW,SAAK;IAGhB,IAAI,EAAE,SAAS,CAAW;IAG1B,MAAM,EAAE,WAAW,CAAU;IAG7B,WAAW,UAAQ;IAEnB,OAAO,CAAC,YAAY,CAA8C;IAClE,OAAO,CAAC,WAAW,CAA0C;IAC7D,OAAO,CAAC,gBAAgB,CAAmE;IAE3F,OAAO,CAAC,yBAAyB;IAiBjC,OAAO,CAAC,UAAU,CAoChB;IAEF,aAAa;IAsBb,kBAAkB;IA4BlB,eAAe;IA8Df,gBAAgB;IA+DhB,YAAY;IAsCZ,YAAY;IAwCZ,MAAM;CAgBP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,YAAY,EAAE,SAAS,CAAA;KACxB;CACF"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-card/index.ts"],"names":[],"mappings":"AAOA,OAAO,4BAA4B,CAAA;AAInC,MAAM,MAAM,YAAY,GACpB,OAAO,GACP,aAAa,GACb,SAAS,GACT,WAAW,GACX,MAAM,GACN,MAAM,CAAA;AAEV,MAAM,MAAM,gBAAgB,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAA;AAE1D,MAAM,MAAM,WAAW,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;;AAEtD,qBACa,SAAU,SAAQ,cAA4B;IAEzD,OAAO,EAAE,YAAY,CAAU;IAG/B,aAAa,SAAK;IAGlB,UAAU,SAAK;IAGf,cAAc,SAAK;IAGnB,KAAK,EAAE,MAAM,GAAG,SAAS,CAAY;IAGrC,MAAM,EAAE,MAAM,GAAG,SAAS,CAAY;IAGtC,WAAW,SAAK;IAGhB,WAAW,SAAK;IAGhB,YAAY,EAAE,gBAAgB,CAAW;IAGzC,MAAM,EAAE,WAAW,CAAU;IAG7B,WAAW,UAAQ;IAEnB,OAAO,CAAC,YAAY,CAA8C;IAClE,OAAO,CAAC,WAAW,CAA0C;IAC7D,OAAO,CAAC,gBAAgB,CAAmE;IAE3F,OAAO,CAAC,yBAAyB;IAiBjC,OAAO,CAAC,UAAU,CAqChB;IAEF,aAAa;IAsBb,kBAAkB;IA8BlB,eAAe;IA8Df,gBAAgB;IA+DhB,YAAY;IAsCZ,YAAY;IAwCZ,MAAM;CAgBP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,YAAY,EAAE,SAAS,CAAA;KACxB;CACF"}

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

@@ -1,11 +1,11 @@
-import { T as TailwindStyledElement, x } from '../../index-2cbce78e.js';
+import { T as TailwindStyledElement, x } from '../../index-3527fb14.js';
 import { n, e } from '../../query-assigned-elements-5d94572f.js';
-import { o } from '../../style-map-ec917798.js';
+import { o } from '../../style-map-9fdda015.js';
 import { s as se } from '../../index-c55a1069.js';
 import '../lukso-profile/index.js';
 import '../../tailwind-config.js';
 import { c as cn } from '../../cn-616567d4.js';
-import { c as customStyleMap } from '../../index-61181f2e.js';
+import { c as customStyleMap } from '../../index-1765cfe1.js';
 import '../../directive-2bb7789e.js';
 import '../../index-5e194caf.js';
 
@@ -33,7 +33,7 @@ let LuksoCard = class extends TailwindStyledElement(style) {
     this.height = void 0;
     this.customClass = "";
     this.headerClass = "";
-    this.size = "medium";
+    this.borderRadius = "medium";
     this.shadow = "large";
     this.isHoverable = false;
     this.mediumStyles = `rounded-24 shadow-neutral-drop-shadow-2xl`;
@@ -42,7 +42,8 @@ let LuksoCard = class extends TailwindStyledElement(style) {
     this.cardStyles = se({
       base: `bg-neutral-100`,
       variants: {
-        size: {
+        borderRadius: {
+          none: `rounded-0`,
           small: `rounded-12`,
           medium: `rounded-24`
         },
@@ -92,7 +93,7 @@ let LuksoCard = class extends TailwindStyledElement(style) {
   }
   basicTemplate() {
     const cardStyles = this.cardStyles({
-      size: this.size,
+      borderRadius: this.borderRadius,
       shadow: this.shadow,
       isHoverable: this.isHoverable,
       hasNoWidth: !this.width
@@ -112,7 +113,7 @@ let LuksoCard = class extends TailwindStyledElement(style) {
   }
   withHeaderTemplate() {
     const cardStyles = this.cardStyles({
-      size: this.size,
+      borderRadius: this.borderRadius,
       shadow: this.shadow,
       isHoverable: this.isHoverable,
       hasNoWidth: !this.width,
@@ -130,7 +131,9 @@ let LuksoCard = class extends TailwindStyledElement(style) {
         <div class=${this.headerClass}>
           <slot name="header"></slot>
         </div>
-        <div class="bg-neutral-100 shadow-neutral-above-shadow-1xl rounded-24">
+        <div
+          class="bg-neutral-100 shadow-neutral-above-shadow-1xl rounded-[inherit]"
+        >
           <slot name="content"></slot>
         </div>
       </div>
@@ -138,7 +141,7 @@ let LuksoCard = class extends TailwindStyledElement(style) {
   }
   profileTemplate() {
     const cardStyles = this.cardStyles({
-      size: this.size,
+      borderRadius: this.borderRadius,
       shadow: this.shadow,
       isHoverable: this.isHoverable,
       hasNoWidth: !this.width,
@@ -158,12 +161,12 @@ let LuksoCard = class extends TailwindStyledElement(style) {
       backgroundImage: this.backgroundImageOrGradient()
     })}
           class=${cn(
-      "min-h-[92px] -mb-6 w-full bg-center bg-cover rounded-[24px_24px_0_0] relative",
+      "min-h-[92px] -mb-6 w-full bg-center bg-cover rounded-t-[inherit] rounded-b-0 relative",
       this.headerClass
     )}
         >
           ${this.backgroundUrl && x` <div
-            class="h-full full rounded-[24px_24px_0_0] bg-neutral-20/10 absolute"
+            class="h-full full rounded-t-[inherit] rounded-b-0 bg-neutral-20/10 absolute"
           ></div>`}
           <div>
             <slot name="header"></slot>
@@ -174,11 +177,11 @@ let LuksoCard = class extends TailwindStyledElement(style) {
           style=${customStyleMap({
       [`width: ${this.width}px`]: !!this.width
     })}
-          class="bg-neutral-100 rounded-24 relative break-normal"
+          class="bg-neutral-100 rounded-[inherit] relative break-normal"
         >
           <lukso-profile
             profile-url=${this.profileUrl}
-            size="large"
+            borderRadius="large"
             profile-address=${this.profileAddress}
             has-identicon
             class="absolute -top-[40px] left-[calc(50%_-_40px)] z-10"
@@ -197,7 +200,7 @@ let LuksoCard = class extends TailwindStyledElement(style) {
   }
   profile2Template() {
     const cardStyles = this.cardStyles({
-      size: this.size,
+      borderRadius: this.borderRadius,
       shadow: this.shadow,
       isHoverable: this.isHoverable,
       hasNoWidth: !this.width,
@@ -217,22 +220,22 @@ let LuksoCard = class extends TailwindStyledElement(style) {
       backgroundImage: this.backgroundImageOrGradient()
     })}
           class=${cn(
-      "min-h-[129px] -mb-6 bg-center bg-cover rounded-[24px_24px_0_0] relative bg-neutral-100",
+      "min-h-[129px] -mb-6 bg-center bg-cover rounded-t-[inherit] rounded-b-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"
+            class="min-h-full min-w-full rounded-t-[inherit] rounded-b-0 bg-neutral-10/10 absolute"
           ></div>`}
           <div>
             <slot name="header"></slot>
           </div>
         </div>
-        <div class="grid grid-rows-[max-content,auto]">
+        <div class="grid grid-rows-[max-content,auto] rounded-b-[inherit]">
           <div class="bg-neutral-100 relative">
             <lukso-profile
               profile-url=${this.profileUrl}
-              size="large"
+              borderRadius="large"
               profile-address=${this.profileAddress}
               has-identicon
               class="absolute -top-[40px] left-[calc(50%_-_40px)] z-10"
@@ -247,7 +250,7 @@ let LuksoCard = class extends TailwindStyledElement(style) {
             <slot name="content"></slot>
           </div>
           <div
-            class="bg-neutral-97 rounded-b-24 shadow-neutral-inner-shadow-top"
+            class="bg-neutral-97 rounded-b-[inherit] shadow-neutral-inner-shadow-top"
           >
             <slot name="bottom"></slot>
           </div>
@@ -257,7 +260,7 @@ let LuksoCard = class extends TailwindStyledElement(style) {
   }
   heroTemplate() {
     const cardStyles = this.cardStyles({
-      size: this.size,
+      borderRadius: this.borderRadius,
       shadow: this.shadow,
       isHoverable: this.isHoverable,
       hasNoWidth: !this.width,
@@ -276,10 +279,10 @@ let LuksoCard = class extends TailwindStyledElement(style) {
           style=${o({
       backgroundImage: `url('${this.backgroundUrl}')`
     })}
-          class="h-full w-full -mb-6 bg-center bg-cover rounded-24 relative"
+          class="h-full w-full -mb-6 bg-center bg-cover rounded-[inherit] relative"
         >
           ${this.backgroundUrl && x`<div
-            class="h-full w-full rounded-24 bg-neutral-20/10 absolute"
+            class="h-full w-full rounded-[inherit] bg-neutral-20/10 absolute"
           ></div>`}
           <div
             class="h-full w-full flex flex-col items-center justify-center  absolute"
@@ -292,7 +295,7 @@ let LuksoCard = class extends TailwindStyledElement(style) {
   }
   dappTemplate() {
     const cardStyles = this.cardStyles({
-      size: this.size,
+      borderRadius: this.borderRadius,
       shadow: this.shadow,
       isHoverable: this.isHoverable,
       hasNoWidth: !this.width,
@@ -312,7 +315,7 @@ let LuksoCard = class extends TailwindStyledElement(style) {
       backgroundImage: this.backgroundImageOrGradient()
     })}
           class=${cn(
-      "min-h-[240px] bg-center bg-cover rounded-[24px_24px_0_0] relative",
+      "min-h-[240px] bg-center bg-cover rounded-t-[inherit] rounded-b-0 relative",
       this.headerClass
     )}
         >
@@ -321,7 +324,7 @@ let LuksoCard = class extends TailwindStyledElement(style) {
           </div>
         </div>
         <div
-          class="bg-neutral-100 shadow-neutral-above-shadow-1xl rounded-[0_0_24px_24px] relative"
+          class="bg-neutral-100 shadow-neutral-above-shadow-1xl rounded-t-0 rounded-b-[inherit] relative"
         >
           <slot name="content"></slot>
         </div>
@@ -370,8 +373,8 @@ __decorateClass([
   n({ type: String, attribute: "header-class" })
 ], LuksoCard.prototype, "headerClass", 2);
 __decorateClass([
-  n({ type: String })
-], LuksoCard.prototype, "size", 2);
+  n({ type: String, attribute: "border-radius" })
+], LuksoCard.prototype, "borderRadius", 2);
 __decorateClass([
   n({ type: String })
 ], LuksoCard.prototype, "shadow", 2);

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

@@ -20,7 +20,7 @@ export declare const HeroCard: any;
 export declare const DappCard: any;
 /** You can customize card with `custom-class` property, it will be used instead of default styles.  */
 export declare const CustomCard: any;
-/** You can select card size with `size` property.  */
+/** You can select card border radius with `borderRadius` property.  */
 export declare const SmallCard: any;
 /** Card can be as hoverable element with `is-hoverable` property.  */
 export declare const HoverableCard: any;

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

@@ -1 +1 @@
-{"version":3,"file":"lukso-card.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-card/lukso-card.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,MAAM,2BAA2B,CAAA;AAEhD,OAAO,SAAS,CAAA;AAChB,OAAO,kBAAkB,CAAA;AACzB,OAAO,mBAAmB,CAAA;AAE1B,qJAAqJ;AACrJ,QAAA,MAAM,IAAI,EAAE,IAyIX,CAAA;AAED,eAAe,IAAI,CAAA;AA4InB,iDAAiD;AACjD,eAAO,MAAM,WAAW,KAA2B,CAAA;AAQnD,iHAAiH;AACjH,eAAO,MAAM,SAAS,KAA2B,CAAA;AAYjD,wCAAwC;AACxC,eAAO,MAAM,cAAc,KAA2B,CAAA;AAatD,+EAA+E;AAC/E,eAAO,MAAM,oBAAoB,KAAgC,CAAA;AAajE,sIAAsI;AACtI,eAAO,MAAM,WAAW,KAA2B,CAAA;AAmBnD,uCAAuC;AACvC,eAAO,MAAM,YAAY,KAA2B,CAAA;AAOpD,kCAAkC;AAClC,eAAO,MAAM,QAAQ,KAAwB,CAAA;AAK7C,kCAAkC;AAClC,eAAO,MAAM,QAAQ,KAA2B,CAAA;AAKhD,uGAAuG;AACvG,eAAO,MAAM,UAAU,KAA2B,CAAA;AAalD,sDAAsD;AACtD,eAAO,MAAM,SAAS,KAA2B,CAAA;AAKjD,sEAAsE;AACtE,eAAO,MAAM,aAAa,KAA2B,CAAA;AAOrD,0DAA0D;AAC1D,eAAO,MAAM,MAAM,KAA2B,CAAA"}
+{"version":3,"file":"lukso-card.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-card/lukso-card.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,MAAM,2BAA2B,CAAA;AAEhD,OAAO,SAAS,CAAA;AAChB,OAAO,kBAAkB,CAAA;AACzB,OAAO,mBAAmB,CAAA;AAE1B,qJAAqJ;AACrJ,QAAA,MAAM,IAAI,EAAE,IA8IX,CAAA;AAED,eAAe,IAAI,CAAA;AA4InB,iDAAiD;AACjD,eAAO,MAAM,WAAW,KAA2B,CAAA;AAQnD,iHAAiH;AACjH,eAAO,MAAM,SAAS,KAA2B,CAAA;AAYjD,wCAAwC;AACxC,eAAO,MAAM,cAAc,KAA2B,CAAA;AAatD,+EAA+E;AAC/E,eAAO,MAAM,oBAAoB,KAAgC,CAAA;AAajE,sIAAsI;AACtI,eAAO,MAAM,WAAW,KAA2B,CAAA;AAmBnD,uCAAuC;AACvC,eAAO,MAAM,YAAY,KAA2B,CAAA;AAOpD,kCAAkC;AAClC,eAAO,MAAM,QAAQ,KAAwB,CAAA;AAK7C,kCAAkC;AAClC,eAAO,MAAM,QAAQ,KAA2B,CAAA;AAKhD,uGAAuG;AACvG,eAAO,MAAM,UAAU,KAA2B,CAAA;AAalD,uEAAuE;AACvE,eAAO,MAAM,SAAS,KAA2B,CAAA;AAKjD,sEAAsE;AACtE,eAAO,MAAM,aAAa,KAA2B,CAAA;AAOrD,0DAA0D;AAC1D,eAAO,MAAM,MAAM,KAA2B,CAAA"}

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const shared_tailwindElement_index = require('../../index-4964f1aa.cjs');
+const shared_tailwindElement_index = require('../../index-688c3040.cjs');
 const queryAssignedElements = require('../../query-assigned-elements-1d5d9d4c.cjs');
 const state = require('../../state-f73a8b4f.cjs');
 const index = require('../../index-e9668573.cjs');

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

@@ -1,4 +1,4 @@
-import { a as TailwindElement, x, A } from '../../index-2cbce78e.js';
+import { a as TailwindElement, x, A } from '../../index-3527fb14.js';
 import { n, e } from '../../query-assigned-elements-5d94572f.js';
 import { t } from '../../state-0a779257.js';
 import { c as customClassMap } from '../../index-5e194caf.js';

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const shared_tailwindElement_index = require('../../index-4964f1aa.cjs');
+const shared_tailwindElement_index = require('../../index-688c3040.cjs');
 const queryAssignedElements = require('../../query-assigned-elements-1d5d9d4c.cjs');
 
 var __defProp = Object.defineProperty;

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

@@ -1,4 +1,4 @@
-import { a as TailwindElement, x } from '../../index-2cbce78e.js';
+import { a as TailwindElement, x } from '../../index-3527fb14.js';
 import { n, e } from '../../query-assigned-elements-5d94572f.js';
 
 var __defProp = Object.defineProperty;

package/dist/components/lukso-icon/icons/video-outline.d.ts

@@ -0,0 +1,3 @@
+import { IconOptions } from '../../../components/lukso-icon/index.js';
+export declare const videoOutline: (options: IconOptions) => import("lit-html").TemplateResult<1>;
+//# sourceMappingURL=video-outline.d.ts.map

package/dist/components/lukso-icon/icons/video-outline.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"video-outline.d.ts","sourceRoot":"","sources":["../../../../../../src/components/lukso-icon/icons/video-outline.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAA;AAE9D,eAAO,MAAM,YAAY,YAAa,WAAW,yCAgFhD,CAAA"}