@lukso/web-components 1.115.2 → 1.115.3

package/dist/{bundle-mjs-d58a83c6.cjs → cn-90c03edf.js}

@@ -1,4 +1,10 @@
-'use strict';
+import { colorPalette, borderRadius, boxShadows, fontSizes, fontWeights, scales, heights, lineHeights } from './tailwind-config.js';
+
+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, "");
+
+import.meta.url.replace(/^file:\/\/|\/\w+\.?[jt]s$/g, "").replace(/\/index\.[a-z]+$/g, "");
 
 const CLASS_PART_SEPARATOR = '-';
 function createClassUtils(config) {
@@ -2562,7 +2568,32 @@ function mergeConfigProperties(baseObject, mergeObject) {
 function extendTailwindMerge(configExtension, ...createConfig) {
   return typeof configExtension === 'function' ? createTailwindMerge(getDefaultConfig, configExtension, ...createConfig) : createTailwindMerge(() => mergeConfigs(getDefaultConfig(), configExtension), ...createConfig);
 }
-const twMerge = /*#__PURE__*/createTailwindMerge(getDefaultConfig);
 
-exports.extendTailwindMerge = extendTailwindMerge;
-exports.twMerge = twMerge;
+function r(e){var t,f,n="";if("string"==typeof e||"number"==typeof e)n+=e;else if("object"==typeof e)if(Array.isArray(e))for(t=0;t<e.length;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=" "),n+=f);else for(t in e)e[t]&&(n&&(n+=" "),n+=t);return n}function clsx(){for(var e,t,f=0,n="";f<arguments.length;)(e=arguments[f++])&&(t=r(e))&&(n&&(n+=" "),n+=t);return n}
+
+const customTwMerge = extendTailwindMerge({
+  extend: {
+    theme: {
+      colors: Object.entries(colorPalette).reduce((acc, currentVal) => {
+        const colors = Object.keys(currentVal[1]).map(
+          (c) => `text-${currentVal[0]}-${c}`
+        );
+        return acc.concat(colors);
+      }, []),
+      borderRadius: Object.keys(borderRadius).map((s) => `rounded-${s}`)
+    },
+    classGroups: {
+      shadow: [{ shadow: Object.keys(boxShadows).map((s) => `shadow-${s}`) }],
+      "font-size": Object.keys(fontSizes).map((s) => `text-${s}`),
+      "font-weight": Object.keys(fontWeights).map((s) => `font-${s}`),
+      scale: Object.keys(scales).map((s) => `scale-${s}`),
+      h: Object.keys(heights).map((s) => `h-${s}`),
+      leading: Object.keys(lineHeights).map((s) => `leading-${s}`)
+    }
+  }
+});
+const cn = (...inputs) => {
+  return customTwMerge(clsx(inputs));
+};
+
+export { cn as c };

package/dist/{bundle-mjs-fbc6e2a8.js → cn-b6daa995.cjs}

@@ -1,3 +1,14 @@
+'use strict';
+
+const tailwindConfig = require('./tailwind-config.cjs');
+
+var _documentCurrentScript = typeof document !== 'undefined' ? document.currentScript : null;
+(typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.src || new URL('cn-b6daa995.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-b6daa995.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-b6daa995.cjs', document.baseURI).href)).replace(/^file:\/\/|\/\w+\.?[jt]s$/g, "").replace(/\/index\.[a-z]+$/g, "");
+
 const CLASS_PART_SEPARATOR = '-';
 function createClassUtils(config) {
   const classMap = createClassMap(config);
@@ -2560,6 +2571,32 @@ function mergeConfigProperties(baseObject, mergeObject) {
 function extendTailwindMerge(configExtension, ...createConfig) {
   return typeof configExtension === 'function' ? createTailwindMerge(getDefaultConfig, configExtension, ...createConfig) : createTailwindMerge(() => mergeConfigs(getDefaultConfig(), configExtension), ...createConfig);
 }
-const twMerge = /*#__PURE__*/createTailwindMerge(getDefaultConfig);
 
-export { extendTailwindMerge as e, twMerge as t };
+function r(e){var t,f,n="";if("string"==typeof e||"number"==typeof e)n+=e;else if("object"==typeof e)if(Array.isArray(e))for(t=0;t<e.length;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=" "),n+=f);else for(t in e)e[t]&&(n&&(n+=" "),n+=t);return n}function clsx(){for(var e,t,f=0,n="";f<arguments.length;)(e=arguments[f++])&&(t=r(e))&&(n&&(n+=" "),n+=t);return n}
+
+const customTwMerge = extendTailwindMerge({
+  extend: {
+    theme: {
+      colors: Object.entries(tailwindConfig.colorPalette).reduce((acc, currentVal) => {
+        const colors = Object.keys(currentVal[1]).map(
+          (c) => `text-${currentVal[0]}-${c}`
+        );
+        return acc.concat(colors);
+      }, []),
+      borderRadius: Object.keys(tailwindConfig.borderRadius).map((s) => `rounded-${s}`)
+    },
+    classGroups: {
+      shadow: [{ shadow: Object.keys(tailwindConfig.boxShadows).map((s) => `shadow-${s}`) }],
+      "font-size": Object.keys(tailwindConfig.fontSizes).map((s) => `text-${s}`),
+      "font-weight": Object.keys(tailwindConfig.fontWeights).map((s) => `font-${s}`),
+      scale: Object.keys(tailwindConfig.scales).map((s) => `scale-${s}`),
+      h: Object.keys(tailwindConfig.heights).map((s) => `h-${s}`),
+      leading: Object.keys(tailwindConfig.lineHeights).map((s) => `leading-${s}`)
+    }
+  }
+});
+const cn = (...inputs) => {
+  return customTwMerge(clsx(inputs));
+};
+
+exports.cn = cn;

package/dist/components/index.cjs

@@ -6,7 +6,7 @@ const components_luksoButton_index = require('./lukso-button/index.cjs');
 const components_luksoCard_index = require('./lukso-card/index.cjs');
 const components_luksoCheckbox_index = require('./lukso-checkbox/index.cjs');
 const components_luksoColorPicker_index = require('./lukso-color-picker/index.cjs');
-const components_luksoDropdown_index = require('../index-73fbf718.cjs');
+const components_luksoDropdown_index = require('../index-dbfb7d50.cjs');
 const components_luksoDropdownOption_index = require('./lukso-dropdown-option/index.cjs');
 const components_luksoFooter_index = require('./lukso-footer/index.cjs');
 const components_luksoIcon_index = require('./lukso-icon/index.cjs');
@@ -15,7 +15,7 @@ const components_luksoInput_index = require('./lukso-input/index.cjs');
 const components_luksoModal_index = require('./lukso-modal/index.cjs');
 const components_luksoNavbar_index = require('./lukso-navbar/index.cjs');
 const components_luksoPagination_index = require('./lukso-pagination/index.cjs');
-const components_luksoProfile_index = require('../index-1b37efea.cjs');
+const components_luksoProfile_index = require('../index-9f282d35.cjs');
 const components_luksoProgress_index = require('./lukso-progress/index.cjs');
 const components_luksoSanitize_index = require('./lukso-sanitize/index.cjs');
 const components_luksoSearch_index = require('./lukso-search/index.cjs');
@@ -29,18 +29,15 @@ const components_luksoTextarea_index = require('./lukso-textarea/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-6457c2f8.cjs');
-require('../cn-fc6d6aa9.cjs');
-require('../query-assigned-elements-d5e45650.cjs');
-require('../state-d9fb972b.cjs');
-require('../index-1d3f4a5a.cjs');
-require('../bundle-mjs-d58a83c6.cjs');
+const shared_tailwindElement_index = require('../index-dda1809d.cjs');
+require('../cn-b6daa995.cjs');
+require('../property-46482bf7.cjs');
+require('../state-94c1d585.cjs');
+require('../index-2b104ecb.cjs');
 require('../tailwind-config.cjs');
-require('node:fs');
-require('node:path');
-require('../style-map-54c139bb.cjs');
+require('../style-map-552ab28f.cjs');
 require('../directive-8278ab14.cjs');
-require('../index-0917a814.cjs');
+require('../index-f564f46f.cjs');
 require('../index-e9668573.cjs');
 
 

package/dist/components/index.js

@@ -2,7 +2,7 @@ export { LuksoButton } from './lukso-button/index.js';
 export { LuksoCard } from './lukso-card/index.js';
 export { LuksoCheckbox } from './lukso-checkbox/index.js';
 export { LuksoColorPicker } from './lukso-color-picker/index.js';
-export { L as LuksoDropdown } from '../index-0fbcd7f4.js';
+export { L as LuksoDropdown } from '../index-40811e43.js';
 export { LuksoDropdownOption } from './lukso-dropdown-option/index.js';
 export { LuksoFooter } from './lukso-footer/index.js';
 export { LuksoIcon } from './lukso-icon/index.js';
@@ -11,7 +11,7 @@ export { LuksoInput } from './lukso-input/index.js';
 export { LuksoModal } from './lukso-modal/index.js';
 export { LuksoNavbar } from './lukso-navbar/index.js';
 export { LuksoPagination } from './lukso-pagination/index.js';
-export { L as LuksoProfile } from '../index-ffb387db.js';
+export { L as LuksoProfile } from '../index-30c74dfe.js';
 export { LuksoProgress } from './lukso-progress/index.js';
 export { LuksoSanitize } from './lukso-sanitize/index.js';
 export { LuksoSearch } from './lukso-search/index.js';
@@ -25,16 +25,13 @@ export { LuksoTextarea } from './lukso-textarea/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-0590cf31.js';
-import '../cn-01b2d42a.js';
-import '../query-assigned-elements-1c8c9e90.js';
-import '../state-b9ca4e74.js';
-import '../index-ca8e900d.js';
-import '../bundle-mjs-fbc6e2a8.js';
+export { a as TailwindElement, T as TailwindStyledElement } from '../index-86a3fdc1.js';
+import '../cn-90c03edf.js';
+import '../property-140ef335.js';
+import '../state-876605e4.js';
+import '../index-d14b6a34.js';
 import '../tailwind-config.js';
-import 'node:fs';
-import 'node:path';
-import '../style-map-7a555e98.js';
+import '../style-map-15dde65e.js';
 import '../directive-2bb7789e.js';
-import '../index-adf2fc92.js';
+import '../index-eb08047e.js';
 import '../index-5e194caf.js';

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

@@ -2,15 +2,12 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const shared_tailwindElement_index = require('../../index-6457c2f8.cjs');
-const queryAssignedElements = require('../../query-assigned-elements-d5e45650.cjs');
-const state = require('../../state-d9fb972b.cjs');
-const index = require('../../index-1d3f4a5a.cjs');
+const shared_tailwindElement_index = require('../../index-dda1809d.cjs');
+const property = require('../../property-46482bf7.cjs');
+const state = require('../../state-94c1d585.cjs');
+const index = require('../../index-2b104ecb.cjs');
 require('../../tailwind-config.cjs');
-require('node:fs');
-require('node:path');
-const cn = require('../../cn-fc6d6aa9.cjs');
-require('../../bundle-mjs-d58a83c6.cjs');
+const cn = require('../../cn-b6daa995.cjs');
 
 const style = ":host {\n\n    display: inline-flex\n}\n\n:host([is-full-width]) {\n\n    display: flex;\n\n    width: 100%\n}";
 
@@ -213,7 +210,7 @@ exports.LuksoButton = class LuksoButton extends shared_tailwindElement_index.Tai
         color=${this.variant === "secondary" || this.variant === "text" ? "neutral-20" : "neutral-100"}
         class=${icon()}
       ></lukso-icon>
-      ${this.loadingText ? shared_tailwindElement_index.x`<span class=${text()}>${this.loadingText}</span>` : shared_tailwindElement_index.A}`;
+      ${this.loadingText ? shared_tailwindElement_index.x`<span class=${text()}>${this.loadingText}</span>` : shared_tailwindElement_index.E}`;
   }
   counterTemplate() {
     const counterStyles = this.counterStyles({
@@ -246,7 +243,7 @@ exports.LuksoButton = class LuksoButton extends shared_tailwindElement_index.Tai
         @mouseleave=${this.handleMouseUp}
       >
         ${this.isLoading ? this.loadingTemplate() : shared_tailwindElement_index.x`<slot></slot>`}
-        ${this.count ? this.counterTemplate() : shared_tailwindElement_index.A}
+        ${this.count ? this.counterTemplate() : shared_tailwindElement_index.E}
       </button>
     `;
   }
@@ -277,65 +274,65 @@ exports.LuksoButton = class LuksoButton extends shared_tailwindElement_index.Tai
   }
 };
 __decorateClass([
-  queryAssignedElements.n({ type: String })
+  property.n({ type: String })
 ], exports.LuksoButton.prototype, "variant", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: String })
+  property.n({ type: String })
 ], exports.LuksoButton.prototype, "size", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: Boolean })
+  property.n({ type: Boolean })
 ], exports.LuksoButton.prototype, "disabled", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: Boolean, attribute: "is-full-width" })
+  property.n({ type: Boolean, attribute: "is-full-width" })
 ], exports.LuksoButton.prototype, "isFullWidth", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: Boolean, attribute: "is-long-press" })
+  property.n({ type: Boolean, attribute: "is-long-press" })
 ], exports.LuksoButton.prototype, "isLongPress", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: Boolean, attribute: "is-link" })
+  property.n({ type: Boolean, attribute: "is-link" })
 ], exports.LuksoButton.prototype, "isLink", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: Boolean, attribute: "is-loading" })
+  property.n({ type: Boolean, attribute: "is-loading" })
 ], exports.LuksoButton.prototype, "isLoading", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: String })
+  property.n({ type: String })
 ], exports.LuksoButton.prototype, "type", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: String })
+  property.n({ type: String })
 ], exports.LuksoButton.prototype, "href", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: String })
+  property.n({ type: String })
 ], exports.LuksoButton.prototype, "target", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: String })
+  property.n({ type: String })
 ], exports.LuksoButton.prototype, "rel", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: String, attribute: "loading-text" })
+  property.n({ type: String, attribute: "loading-text" })
 ], exports.LuksoButton.prototype, "loadingText", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: String, attribute: "custom-class" })
+  property.n({ type: String, attribute: "custom-class" })
 ], exports.LuksoButton.prototype, "customClass", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: Boolean, attribute: "is-active" })
+  property.n({ type: Boolean, attribute: "is-active" })
 ], exports.LuksoButton.prototype, "isActive", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: Number })
+  property.n({ type: Number })
 ], exports.LuksoButton.prototype, "count", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: Boolean, attribute: "is-icon" })
+  property.n({ type: Boolean, attribute: "is-icon" })
 ], exports.LuksoButton.prototype, "isIcon", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: String })
+  property.n({ type: String })
 ], exports.LuksoButton.prototype, "label", 2);
 __decorateClass([
-  state.t()
+  state.r()
 ], exports.LuksoButton.prototype, "isPressed", 2);
 __decorateClass([
-  state.t()
+  state.r()
 ], exports.LuksoButton.prototype, "noTransition", 2);
 __decorateClass([
-  state.t()
+  state.r()
 ], exports.LuksoButton.prototype, "timer", 2);
 exports.LuksoButton = __decorateClass([
-  queryAssignedElements.e("lukso-button")
+  property.t("lukso-button")
 ], exports.LuksoButton);

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

@@ -1,12 +1,9 @@
-import { T as TailwindStyledElement, x, A } from '../../index-0590cf31.js';
-import { n, e } from '../../query-assigned-elements-1c8c9e90.js';
-import { t } from '../../state-b9ca4e74.js';
-import { c as ce } from '../../index-ca8e900d.js';
+import { T as TailwindStyledElement, x, E } from '../../index-86a3fdc1.js';
+import { n, t } from '../../property-140ef335.js';
+import { r } from '../../state-876605e4.js';
+import { c as ce } from '../../index-d14b6a34.js';
 import '../../tailwind-config.js';
-import 'node:fs';
-import 'node:path';
-import { c as cn } from '../../cn-01b2d42a.js';
-import '../../bundle-mjs-fbc6e2a8.js';
+import { c as cn } from '../../cn-90c03edf.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}";
 
@@ -209,7 +206,7 @@ let LuksoButton = class extends TailwindStyledElement(style) {
         color=${this.variant === "secondary" || this.variant === "text" ? "neutral-20" : "neutral-100"}
         class=${icon()}
       ></lukso-icon>
-      ${this.loadingText ? x`<span class=${text()}>${this.loadingText}</span>` : A}`;
+      ${this.loadingText ? x`<span class=${text()}>${this.loadingText}</span>` : E}`;
   }
   counterTemplate() {
     const counterStyles = this.counterStyles({
@@ -242,7 +239,7 @@ let LuksoButton = class extends TailwindStyledElement(style) {
         @mouseleave=${this.handleMouseUp}
       >
         ${this.isLoading ? this.loadingTemplate() : x`<slot></slot>`}
-        ${this.count ? this.counterTemplate() : A}
+        ${this.count ? this.counterTemplate() : E}
       </button>
     `;
   }
@@ -324,16 +321,16 @@ __decorateClass([
   n({ type: String })
 ], LuksoButton.prototype, "label", 2);
 __decorateClass([
-  t()
+  r()
 ], LuksoButton.prototype, "isPressed", 2);
 __decorateClass([
-  t()
+  r()
 ], LuksoButton.prototype, "noTransition", 2);
 __decorateClass([
-  t()
+  r()
 ], LuksoButton.prototype, "timer", 2);
 LuksoButton = __decorateClass([
-  e("lukso-button")
+  t("lukso-button")
 ], LuksoButton);
 
 export { LuksoButton };

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

@@ -2,20 +2,30 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const components_luksoProfile_index = require('../../index-1b37efea.cjs');
-const shared_tailwindElement_index = require('../../index-6457c2f8.cjs');
-const queryAssignedElements = require('../../query-assigned-elements-d5e45650.cjs');
-const state = require('../../state-d9fb972b.cjs');
-const styleMap = require('../../style-map-54c139bb.cjs');
-const index = require('../../index-1d3f4a5a.cjs');
+const components_luksoProfile_index = require('../../index-9f282d35.cjs');
+const shared_tailwindElement_index = require('../../index-dda1809d.cjs');
+const property = require('../../property-46482bf7.cjs');
+const state = require('../../state-94c1d585.cjs');
+const styleMap = require('../../style-map-552ab28f.cjs');
+const index = require('../../index-2b104ecb.cjs');
 require('../../tailwind-config.cjs');
-require('node:fs');
-require('node:path');
-const cn = require('../../cn-fc6d6aa9.cjs');
-const index$1 = require('../../index-0917a814.cjs');
+const cn = require('../../cn-b6daa995.cjs');
+const index$1 = require('../../index-f564f46f.cjs');
 require('../lukso-image/index.cjs');
 require('../../directive-8278ab14.cjs');
-require('../../bundle-mjs-d58a83c6.cjs');
+
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const e=(e,t,c)=>(c.configurable=!0,c.enumerable=!0,Reflect.decorate&&"object"!=typeof t&&Object.defineProperty(e,t,c),c);
+
+/**
+ * @license
+ * Copyright 2021 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */function o(o){return (e$1,n)=>{const{slot:r,selector:s}=o??{},c="slot"+(r?`[name=${r}]`:":not([name])");return e(e$1,n,{get(){const t=this.renderRoot?.querySelector(c),e=t?.assignedElements(o)??[];return void 0===s?e:e.filter((t=>t.matches(s)))}})}}
 
 const style = ":host {\n  display: inline-flex;\n  width: 100%;\n}\n\n:host([width]) {\n  width: inherit;\n}";
 
@@ -180,7 +190,7 @@ exports.LuksoCard = class LuksoCard extends shared_tailwindElement_index.Tailwin
           </div>`}
           ${this.hasOverlay ? shared_tailwindElement_index.x`<div
                 class="h-full full rounded-t-[inherit] rounded-b-0 bg-neutral-20/10 absolute"
-              ></div>` : shared_tailwindElement_index.A}
+              ></div>` : shared_tailwindElement_index.E}
           <div class="relative h-full">
             <slot name="header"></slot>
           </div>
@@ -306,7 +316,7 @@ exports.LuksoCard = class LuksoCard extends shared_tailwindElement_index.Tailwin
           </div>`}
           ${this.hasOverlay && this.backgroundUrl ? shared_tailwindElement_index.x`<div
                 class="h-full w-full rounded-[inherit] bg-neutral-20/10 absolute"
-              ></div>` : shared_tailwindElement_index.A}
+              ></div>` : shared_tailwindElement_index.E}
           <div
             class="h-full w-full flex flex-col items-center justify-center absolute"
           >
@@ -373,50 +383,50 @@ exports.LuksoCard = class LuksoCard extends shared_tailwindElement_index.Tailwin
   }
 };
 __decorateClass([
-  queryAssignedElements.n({ type: String })
+  property.n({ type: String })
 ], exports.LuksoCard.prototype, "variant", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: String, attribute: "background-url" })
+  property.n({ type: String, attribute: "background-url" })
 ], exports.LuksoCard.prototype, "backgroundUrl", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: String, attribute: "profile-url" })
+  property.n({ type: String, attribute: "profile-url" })
 ], exports.LuksoCard.prototype, "profileUrl", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: String, attribute: "profile-address" })
+  property.n({ type: String, attribute: "profile-address" })
 ], exports.LuksoCard.prototype, "profileAddress", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: Number })
+  property.n({ type: Number })
 ], exports.LuksoCard.prototype, "width", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: Number })
+  property.n({ type: Number })
 ], exports.LuksoCard.prototype, "height", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: String, attribute: "custom-class" })
+  property.n({ type: String, attribute: "custom-class" })
 ], exports.LuksoCard.prototype, "customClass", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: String, attribute: "header-class" })
+  property.n({ type: String, attribute: "header-class" })
 ], exports.LuksoCard.prototype, "headerClass", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: String, attribute: "border-radius" })
+  property.n({ type: String, attribute: "border-radius" })
 ], exports.LuksoCard.prototype, "borderRadius", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: String })
+  property.n({ type: String })
 ], exports.LuksoCard.prototype, "shadow", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: Boolean, attribute: "is-hoverable" })
+  property.n({ type: Boolean, attribute: "is-hoverable" })
 ], exports.LuksoCard.prototype, "isHoverable", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: Boolean, attribute: "has-overlay" })
+  property.n({ type: Boolean, attribute: "has-overlay" })
 ], exports.LuksoCard.prototype, "hasOverlay", 2);
 __decorateClass([
-  queryAssignedElements.n({ type: Boolean, attribute: "is-eoa" })
+  property.n({ type: Boolean, attribute: "is-eoa" })
 ], exports.LuksoCard.prototype, "isEoa", 2);
 __decorateClass([
-  queryAssignedElements.l({ slot: "bottom", flatten: true })
+  o({ slot: "bottom", flatten: true })
 ], exports.LuksoCard.prototype, "bottomNodes", 2);
 __decorateClass([
-  state.t()
+  state.r()
 ], exports.LuksoCard.prototype, "hasBottom", 2);
 exports.LuksoCard = __decorateClass([
-  queryAssignedElements.e("lukso-card")
+  property.t("lukso-card")
 ], exports.LuksoCard);

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

@@ -1,17 +1,27 @@
-import { m as makeBlockie } from '../../index-ffb387db.js';
-import { T as TailwindStyledElement, x, A } from '../../index-0590cf31.js';
-import { n, l, e } from '../../query-assigned-elements-1c8c9e90.js';
-import { t } from '../../state-b9ca4e74.js';
-import { o } from '../../style-map-7a555e98.js';
-import { c as ce } from '../../index-ca8e900d.js';
+import { m as makeBlockie } from '../../index-30c74dfe.js';
+import { T as TailwindStyledElement, x, E } from '../../index-86a3fdc1.js';
+import { n, t } from '../../property-140ef335.js';
+import { r } from '../../state-876605e4.js';
+import { o as o$1 } from '../../style-map-15dde65e.js';
+import { c as ce } from '../../index-d14b6a34.js';
 import '../../tailwind-config.js';
-import 'node:fs';
-import 'node:path';
-import { c as cn } from '../../cn-01b2d42a.js';
-import { c as customStyleMap } from '../../index-adf2fc92.js';
+import { c as cn } from '../../cn-90c03edf.js';
+import { c as customStyleMap } from '../../index-eb08047e.js';
 import '../lukso-image/index.js';
 import '../../directive-2bb7789e.js';
-import '../../bundle-mjs-fbc6e2a8.js';
+
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const e=(e,t,c)=>(c.configurable=!0,c.enumerable=!0,Reflect.decorate&&"object"!=typeof t&&Object.defineProperty(e,t,c),c);
+
+/**
+ * @license
+ * Copyright 2021 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */function o(o){return (e$1,n)=>{const{slot:r,selector:s}=o??{},c="slot"+(r?`[name=${r}]`:":not([name])");return e(e$1,n,{get(){const t=this.renderRoot?.querySelector(c),e=t?.assignedElements(o)??[];return void 0===s?e:e.filter((t=>t.matches(s)))}})}}
 
 const style = ":host {\n  display: inline-flex;\n  width: 100%;\n}\n\n:host([width]) {\n  width: inherit;\n}";
 
@@ -126,7 +136,7 @@ let LuksoCard = class extends TailwindStyledElement(style) {
     return x`
       <div
         data-testid="card"
-        style=${o({
+        style=${o$1({
       minHeight: `${this.height}px`,
       width: `${this.width}px`
     })}
@@ -161,7 +171,7 @@ let LuksoCard = class extends TailwindStyledElement(style) {
         class=${cn(cardStyles, this.customClass)}
       >
         <div
-          style=${o({
+          style=${o$1({
       backgroundImage: this.backgroundGradient()
     })}
           class=${cn(
@@ -176,7 +186,7 @@ let LuksoCard = class extends TailwindStyledElement(style) {
           </div>`}
           ${this.hasOverlay ? x`<div
                 class="h-full full rounded-t-[inherit] rounded-b-0 bg-neutral-20/10 absolute"
-              ></div>` : A}
+              ></div>` : E}
           <div class="relative h-full">
             <slot name="header"></slot>
           </div>
@@ -225,7 +235,7 @@ let LuksoCard = class extends TailwindStyledElement(style) {
         class=${cn(cardStyles, this.customClass)}
       >
         <div
-          style=${o({
+          style=${o$1({
       backgroundImage: this.backgroundGradient()
     })}
           class=${cn(
@@ -302,7 +312,7 @@ let LuksoCard = class extends TailwindStyledElement(style) {
           </div>`}
           ${this.hasOverlay && this.backgroundUrl ? x`<div
                 class="h-full w-full rounded-[inherit] bg-neutral-20/10 absolute"
-              ></div>` : A}
+              ></div>` : E}
           <div
             class="h-full w-full flex flex-col items-center justify-center absolute"
           >
@@ -330,7 +340,7 @@ let LuksoCard = class extends TailwindStyledElement(style) {
         class=${cn(cardStyles, this.customClass)}
       >
         <div
-          style=${o({
+          style=${o$1({
       backgroundImage: this.backgroundGradient()
     })}
           class=${cn(
@@ -408,13 +418,13 @@ __decorateClass([
   n({ type: Boolean, attribute: "is-eoa" })
 ], LuksoCard.prototype, "isEoa", 2);
 __decorateClass([
-  l({ slot: "bottom", flatten: true })
+  o({ slot: "bottom", flatten: true })
 ], LuksoCard.prototype, "bottomNodes", 2);
 __decorateClass([
-  t()
+  r()
 ], LuksoCard.prototype, "hasBottom", 2);
 LuksoCard = __decorateClass([
-  e("lukso-card")
+  t("lukso-card")
 ], LuksoCard);
 
 export { LuksoCard };