@luzmo/lucero 1.0.1-alpha.20 → 1.0.1-alpha.22

package/components/action-menu/index.cjs

@@ -15,8 +15,8 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const h=require("../luzmo-icons-CtA-TJPd.cjs"),o=require("../base-Cy0MQrPT.cjs"),b=require("../state-vf0PJN3_.cjs"),u=require("../if-defined-DaXWqfzc.cjs"),m=require("../observe-slot-presence-bc9chhsi.cjs"),p=require("../observe-slot-text-D2VAEFSd.cjs"),v=require("../slottable-request-event-BfUUt1Mh.cjs"),d=require("../picker-X96xmLAw.cjs");require("../action-button/index.cjs");require("../icon/index.cjs");require("../overlay/index.cjs");require("../popover/index.cjs");const y=":host{display:inline-flex}:host([quiet]){min-width:0}:host>luzmo-menu{display:none}::slotted([slot=icon]){flex-shrink:0}.icon{flex-shrink:0}#popover{max-width:none}:host([dir=ltr]) ::slotted([slot=icon]),:host([dir=ltr]) .icon{margin-left:calc(-1 * (var(--luzmo-action-button-textonly-padding-left-adjusted) - var(--luzmo-action-button-padding-left-adjusted)))}:host([dir=rtl]) ::slotted([slot=icon]),:host([dir=rtl]) .icon{margin-right:calc(-1 * (var(--luzmo-action-button-textonly-padding-left-adjusted) - var(--luzmo-action-button-padding-left-adjusted)))}:host([dir]) slot[icon-only]::slotted([slot=icon]),:host([dir]) slot[icon-only] .icon{margin-inline:calc((var(--luzmo-action-button-edge-to-text, var(--action-button-edge-to-text)) - var(--luzmo-action-button-edge-to-visual-only, var(--action-button-edge-to-visual-only))) * -1)}luzmo-overlay:not(:defined){display:none}";var f=Object.defineProperty,g=Object.getOwnPropertyDescriptor,c=(l,t,s,i)=>{for(var e=i>1?void 0:i?g(t,s):t,r=l.length-1,a;r>=0;r--)(a=l[r])&&(e=(i?a(t,s,e):a(e))||e);return i&&e&&f(t,s,e),e};class n extends m.ObserveSlotPresence(p.ObserveSlotText(d.LuzmoPickerBase,"label"),'[slot="label-only"]'){constructor(){super(...arguments),this.selects=void 0,this.listRole="menu",this.itemRole="menuitem",this.handleSlottableRequest=t=>{this.dispatchEvent(new v.SlottableRequestEvent(t.name,t.data))}}static get styles(){return[o.r(y)]}get hasLabel(){return this.slotHasContent}get labelOnly(){return this.slotContentIsPresent}get buttonContent(){return[o.x`
-        ${this.labelOnly?o.x``:o.x`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=require("@luzmo/icons"),o=require("lit"),c=require("lit/decorators.js"),u=require("lit/directives/if-defined.js"),b=require("../observe-slot-presence-bc9chhsi.cjs"),p=require("../observe-slot-text-ByPG1Lqw.cjs"),f=require("../slottable-request-event-BfUUt1Mh.cjs"),h=require("../picker-DxYgh4LR.cjs");require("../action-button/index.cjs");require("../icon/index.cjs");require("../overlay/index.cjs");require("../popover/index.cjs");const v=":host{display:inline-flex}:host([quiet]){min-width:0}:host>luzmo-menu{display:none}::slotted([slot=icon]){flex-shrink:0}.icon{flex-shrink:0}#popover{max-width:none}:host([dir=ltr]) ::slotted([slot=icon]),:host([dir=ltr]) .icon{margin-left:calc(-1 * (var(--luzmo-action-button-textonly-padding-left-adjusted) - var(--luzmo-action-button-padding-left-adjusted)))}:host([dir=rtl]) ::slotted([slot=icon]),:host([dir=rtl]) .icon{margin-right:calc(-1 * (var(--luzmo-action-button-textonly-padding-left-adjusted) - var(--luzmo-action-button-padding-left-adjusted)))}:host([dir]) slot[icon-only]::slotted([slot=icon]),:host([dir]) slot[icon-only] .icon{margin-inline:calc((var(--luzmo-action-button-edge-to-text, var(--action-button-edge-to-text)) - var(--luzmo-action-button-edge-to-visual-only, var(--action-button-edge-to-visual-only))) * -1)}luzmo-overlay:not(:defined){display:none}";var y=Object.defineProperty,z=Object.getOwnPropertyDescriptor,d=(l,t,s,i)=>{for(var e=i>1?void 0:i?z(t,s):t,r=l.length-1,a;r>=0;r--)(a=l[r])&&(e=(i?a(t,s,e):a(e))||e);return i&&e&&y(t,s,e),e};class n extends b.ObserveSlotPresence(p.ObserveSlotText(h.LuzmoPickerBase,"label"),'[slot="label-only"]'){constructor(){super(...arguments),this.selects=void 0,this.listRole="menu",this.itemRole="menuitem",this.handleSlottableRequest=t=>{this.dispatchEvent(new f.SlottableRequestEvent(t.name,t.data))}}static get styles(){return[o.unsafeCSS(v)]}get hasLabel(){return this.slotHasContent}get labelOnly(){return this.slotContentIsPresent}get buttonContent(){return[o.html`
+        ${this.labelOnly?o.html``:o.html`
               <slot
                 name="icon"
                 slot="icon"
@@ -25,7 +25,7 @@
               >
                 <luzmo-icon
                   class="icon"
-                  .icon=${h.K}
+                  .icon=${m.luzmoEllipsisHorizontal}
                   size=${this.size}
                 ></luzmo-icon>
               </slot>
@@ -33,15 +33,15 @@
         <slot name="label" ?hidden=${!this.hasLabel}></slot>
         <slot name="label-only"></slot>
         <slot name="tooltip" @slotchange=${this.handleTooltipSlotchange}></slot>
-      `]}render(){return this.tooltipEl&&(this.tooltipEl.disabled=this.open),o.x`
+      `]}render(){return this.tooltipEl&&(this.tooltipEl.disabled=this.open),o.html`
       <luzmo-action-button
-        aria-describedby=${d.DESCRIPTION_ID}
+        aria-describedby=${h.DESCRIPTION_ID}
         ?quiet=${this.quiet}
-        static-color=${u.o(this.staticColor)}
+        static-color=${u.ifDefined(this.staticColor)}
         aria-haspopup="true"
-        aria-controls=${u.o(this.open?"menu":void 0)}
+        aria-controls=${u.ifDefined(this.open?"menu":void 0)}
         aria-expanded=${this.open?"true":"false"}
-        aria-label=${u.o(this.label||void 0)}
+        aria-label=${u.ifDefined(this.label||void 0)}
         id="button"
         class="button"
         size=${this.size}
@@ -53,4 +53,4 @@
         ${this.buttonContent}
       </luzmo-action-button>
       ${this.renderMenu} ${this.renderDescriptionSlot}
-    `}update(t){t.has("invalid")&&(this.invalid=!1),super.update(t)}}c([o.n({type:String})],n.prototype,"selects",2);c([o.n({reflect:!0,attribute:"static-color"})],n.prototype,"staticColor",2);c([b.r()],n.prototype,"labelOnly",1);customElements.get("luzmo-action-menu")||customElements.define("luzmo-action-menu",n);exports.LuzmoActionMenu=n;
+    `}update(t){t.has("invalid")&&(this.invalid=!1),super.update(t)}}d([c.property({type:String})],n.prototype,"selects",2);d([c.property({reflect:!0,attribute:"static-color"})],n.prototype,"staticColor",2);d([c.state()],n.prototype,"labelOnly",1);customElements.get("luzmo-action-menu")||customElements.define("luzmo-action-menu",n);exports.LuzmoActionMenu=n;

package/components/action-menu/index.js

@@ -15,14 +15,14 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-import { K as z } from "../luzmo-icons-CiSek5iM.js";
-import { r as b, x as r, n as c } from "../base-CFWO09N1.js";
-import { r as h } from "../state-DwIwYPvt.js";
-import { o as a } from "../if-defined-DULpqYwi.js";
-import { O as p } from "../observe-slot-presence-CmVi0zTc.js";
-import { O as f } from "../observe-slot-text-C3moTjwy.js";
+import { luzmoEllipsisHorizontal as z } from "@luzmo/icons";
+import { unsafeCSS as b, html as r } from "lit";
+import { property as c, state as p } from "lit/decorators.js";
+import { ifDefined as a } from "lit/directives/if-defined.js";
+import { O as h } from "../observe-slot-presence-CmVi0zTc.js";
+import { O as f } from "../observe-slot-text-CugmOzNZ.js";
 import { S as g } from "../slottable-request-event-DggLA4Rx.js";
-import { L as x, D as v } from "../picker-BsQJBF9j.js";
+import { L as x, D as v } from "../picker-Cm6_didQ.js";
 import "../action-button/index.js";
 import "../icon/index.js";
 import "../overlay/index.js";
@@ -40,7 +40,7 @@ var w = Object.defineProperty, $ = Object.getOwnPropertyDescriptor, m = (l, o, n
     (s = l[u]) && (e = (t ? s(o, n, e) : s(e)) || e);
   return t && e && w(o, n, e), e;
 };
-class i extends p(
+class i extends h(
   f(x, "label"),
   '[slot="label-only"]'
 ) {
@@ -118,7 +118,7 @@ m([
   c({ reflect: !0, attribute: "static-color" })
 ], i.prototype, "staticColor", 2);
 m([
-  h()
+  p()
 ], i.prototype, "labelOnly", 1);
 customElements.get("luzmo-action-menu") || customElements.define("luzmo-action-menu", i);
 export {

package/components/{async-directive-BwIAw5tB.js → async-directive-CDQoI4mS.js}

@@ -15,26 +15,25 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-import { f as _ } from "./directive-helpers-D4KMv2dC.js";
-import { i as f, t as A } from "./directive-oAbCiebi.js";
+import { i as _, f as A, t as c } from "./directive-OK_Jd_xx.js";
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const n = (e, t) => {
+const o = (e, t) => {
   var i;
   const s = e._$AN;
   if (s === void 0) return !1;
-  for (const o of s) (i = o._$AO) == null || i.call(o, t, !1), n(o, t);
+  for (const n of s) (i = n._$AO) == null || i.call(n, t, !1), o(n, t);
   return !0;
-}, r = (e) => {
+}, $ = (e) => {
   let t, s;
   do {
     if ((t = e._$AM) === void 0) break;
     s = t._$AN, s.delete(e), e = t;
   } while ((s == null ? void 0 : s.size) === 0);
-}, $ = (e) => {
+}, r = (e) => {
   for (let t; t = e._$AM; e = t) {
     let s = t._$AN;
     if (s === void 0) t._$AN = s = /* @__PURE__ */ new Set();
@@ -42,31 +41,31 @@ const n = (e, t) => {
     s.add(e), l(t);
   }
 };
-function c(e) {
-  this._$AN !== void 0 ? (r(this), this._$AM = e, $(this)) : this._$AM = e;
+function f(e) {
+  this._$AN !== void 0 ? ($(this), this._$AM = e, r(this)) : this._$AM = e;
 }
 function d(e, t = !1, s = 0) {
-  const i = this._$AH, o = this._$AN;
-  if (o !== void 0 && o.size !== 0) if (t) if (Array.isArray(i)) for (let h = s; h < i.length; h++) n(i[h], !1), r(i[h]);
-  else i != null && (n(i, !1), r(i));
-  else n(this, e);
+  const i = this._$AH, n = this._$AN;
+  if (n !== void 0 && n.size !== 0) if (t) if (Array.isArray(i)) for (let h = s; h < i.length; h++) o(i[h], !1), $(i[h]);
+  else i != null && (o(i, !1), $(i));
+  else o(this, e);
 }
 const l = (e) => {
-  e.type == A.CHILD && (e._$AP ?? (e._$AP = d), e._$AQ ?? (e._$AQ = c));
+  e.type == c.CHILD && (e._$AP ?? (e._$AP = d), e._$AQ ?? (e._$AQ = f));
 };
-class C extends f {
+class u extends _ {
   constructor() {
     super(...arguments), this._$AN = void 0;
   }
   _$AT(t, s, i) {
-    super._$AT(t, s, i), $(this), this.isConnected = t._$AU;
+    super._$AT(t, s, i), r(this), this.isConnected = t._$AU;
   }
   _$AO(t, s = !0) {
-    var i, o;
-    t !== this.isConnected && (this.isConnected = t, t ? (i = this.reconnected) == null || i.call(this) : (o = this.disconnected) == null || o.call(this)), s && (n(this, t), r(this));
+    var i, n;
+    t !== this.isConnected && (this.isConnected = t, t ? (i = this.reconnected) == null || i.call(this) : (n = this.disconnected) == null || n.call(this)), s && (o(this, t), $(this));
   }
   setValue(t) {
-    if (_(this._$Ct)) this._$Ct._$AI(t, this);
+    if (A(this._$Ct)) this._$Ct._$AI(t, this);
     else {
       const s = [...this._$Ct._$AH];
       s[this._$Ci] = t, this._$Ct._$AI(s, this, 0);
@@ -78,5 +77,5 @@ class C extends f {
   }
 }
 export {
-  C as f
+  u as f
 };

package/components/async-directive-CddlkYlZ.cjs

@@ -0,0 +1,22 @@
+/*! * Lucero - The design system for Luzmo.
+ * 
+ * Copyright © 2025 Luzmo
+ * All rights reserved.
+ * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
+ * This license allows users with a current active Luzmo account to use Lucero.
+ * This license terminates automatically if a user no longer has an active Luzmo account.
+ * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
+ * 
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ * */
+"use strict";const _=require("./directive-DrvvqO47.cjs");/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */const o=(e,t)=>{var i;const s=e._$AN;if(s===void 0)return!1;for(const n of s)(i=n._$AO)==null||i.call(n,t,!1),o(n,t);return!0},r=e=>{let t,s;do{if((t=e._$AM)===void 0)break;s=t._$AN,s.delete(e),e=t}while((s==null?void 0:s.size)===0)},$=e=>{for(let t;t=e._$AM;e=t){let s=t._$AN;if(s===void 0)t._$AN=s=new Set;else if(s.has(e))break;s.add(e),f(t)}};function c(e){this._$AN!==void 0?(r(this),this._$AM=e,$(this)):this._$AM=e}function A(e,t=!1,s=0){const i=this._$AH,n=this._$AN;if(n!==void 0&&n.size!==0)if(t)if(Array.isArray(i))for(let h=s;h<i.length;h++)o(i[h],!1),r(i[h]);else i!=null&&(o(i,!1),r(i));else o(this,e)}const f=e=>{e.type==_.t.CHILD&&(e._$AP??(e._$AP=A),e._$AQ??(e._$AQ=c))};class d extends _.i{constructor(){super(...arguments),this._$AN=void 0}_$AT(t,s,i){super._$AT(t,s,i),$(this),this.isConnected=t._$AU}_$AO(t,s=!0){var i,n;t!==this.isConnected&&(this.isConnected=t,t?(i=this.reconnected)==null||i.call(this):(n=this.disconnected)==null||n.call(this)),s&&(o(this,t),r(this))}setValue(t){if(_.f(this._$Ct))this._$Ct._$AI(t,this);else{const s=[...this._$Ct._$AH];s[this._$Ci]=t,this._$Ct._$AI(s,this,0)}}disconnected(){}reconnected(){}}exports.f=d;

package/components/avatar/index.cjs

@@ -15,10 +15,10 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../base-Cy0MQrPT.cjs"),l=require("../query-BL-TJj7K.cjs"),d=require("../if-defined-DaXWqfzc.cjs"),u=require("../focusable-B_KwfEec.cjs"),z=require("../like-anchor-Bu3pXbjT.cjs"),c=require("../sized-mixin-WPHH0a_D.cjs"),h='@media (forced-colors: active){:host{--highcontrast-avatar-focus-indicator-color: CanvasText}}:host{--avatar-border-radius: var( --luzmo-avatar-border-radius, var(--luzmo-avatar-size, var(--avatar-size)) );inline-size:var(--luzmo-avatar-size, var(--avatar-size));block-size:var(--luzmo-avatar-size, var(--avatar-size));border-radius:var(--avatar-border-radius);-webkit-user-drag:none;-webkit-user-select:none;user-select:none;opacity:var(--luzmo-avatar-color-opacity, var(--avatar-color-opacity));border-width:0;outline:none;display:inline-block;position:relative;overflow:visible}:host([disabled]){opacity:var(--highcontrast-avatar-color-opacity-disabled, var(--luzmo-avatar-color-opacity-disabled, var(--avatar-color-opacity-disabled)))}:host(:not([disabled])) .is-focused:after,:host(:not([disabled])) .link:focus-visible:after{pointer-events:none;content:"";inline-size:calc(var(--luzmo-avatar-custom-size, var(--luzmo-avatar-size, var(--avatar-size))) + var(--luzmo-avatar-focus-indicator-gap, var(--avatar-focus-indicator-gap)) * 2);block-size:calc(var(--luzmo-avatar-custom-size, var(--luzmo-avatar-size, var(--avatar-size))) + var(--luzmo-avatar-focus-indicator-gap, var(--avatar-focus-indicator-gap)) * 2);border-style:solid;border-width:var(--luzmo-avatar-focus-indicator-width, var(--avatar-focus-indicator-width));border-color:var(--highcontrast-avatar-focus-indicator-color, var(--luzmo-avatar-focus-indicator-color, var(--avatar-focus-indicator-color)));border-radius:var(--avatar-border-radius);position:absolute;inset-block-start:calc((var(--luzmo-avatar-focus-indicator-gap, var(--avatar-focus-indicator-gap)) + var(--luzmo-avatar-focus-indicator-width, var(--avatar-focus-indicator-width))) * -1);inset-inline-start:calc((var(--luzmo-avatar-focus-indicator-gap, var(--avatar-focus-indicator-gap)) + var(--luzmo-avatar-focus-indicator-width, var(--avatar-focus-indicator-width))) * -1)}.link{outline:0}.image{inline-size:var(--luzmo-avatar-size, var(--avatar-size));block-size:var(--luzmo-avatar-size, var(--avatar-size));border-radius:var(--avatar-border-radius)}:host([rounding=none]){border-radius:0}:host([rounding=none]) img{border-radius:0}:host([rounding=full]){border-radius:100%}:host([rounding=full]) img{border-radius:100%}:host([border=light]){border:var(--luzmo-avatar-border-width, var(--avatar-border-width)) solid var(--luzmo-avatar-border-color, var(--avatar-border-color))}:host([border=none]){border:0}:host{--avatar-color-opacity: 1;--avatar-border-width: var(--luzmo-border-width);--avatar-border-color: var(--luzmo-border-color);--avatar-size: 32px;--avatar-focus-indicator-width: var(--luzmo-indicator-width);--avatar-focus-indicator-gap: var(--luzmo-indicator-gap);--avatar-focus-indicator-color: var(--luzmo-indicator-color);--avatar-color-opacity-disabled: .3}:host([size=xxs]){--avatar-size: var(--luzmo-component-height-xxs)}:host([size=xs]){--avatar-size: var(--luzmo-component-height-xs)}:host([size=s]){--avatar-size: var(--luzmo-component-height-s)}:host{--avatar-size: var(--luzmo-component-height)}:host([size=l]){--avatar-size: var(--luzmo-component-height-l)}:host([size=xl]){--avatar-size: var(--luzmo-component-height-xl)}:host([size=xxl]){--avatar-size: var(--luzmo-component-height-xxl)}img{vertical-align:top}';var m=Object.defineProperty,i=(e,o,v,b)=>{for(var a=void 0,s=e.length-1,n;s>=0;s--)(n=e[s])&&(a=n(o,v,a)||a);return a&&m(o,v,a),a};class r extends z.LikeAnchor(c.SizedMixin(u.Focusable,{validSizes:Object.values(c.ElementSizes)})){constructor(){super(...arguments),this.src=""}static get styles(){return[t.r(h)]}get focusElement(){return this.anchorElement||this}render(){const o=t.x`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("lit"),t=require("lit/decorators.js"),d=require("lit/directives/if-defined.js"),u=require("../focusable-CbVKgGfS.cjs"),z=require("../like-anchor-B2EqJPdw.cjs"),l=require("../sized-mixin-DcvJLFeo.cjs"),h='@media (forced-colors: active){:host{--highcontrast-avatar-focus-indicator-color: CanvasText}}:host{--avatar-border-radius: var( --luzmo-avatar-border-radius, var(--luzmo-avatar-size, var(--avatar-size)) );inline-size:var(--luzmo-avatar-size, var(--avatar-size));block-size:var(--luzmo-avatar-size, var(--avatar-size));border-radius:var(--avatar-border-radius);-webkit-user-drag:none;-webkit-user-select:none;user-select:none;opacity:var(--luzmo-avatar-color-opacity, var(--avatar-color-opacity));border-width:0;outline:none;display:inline-block;position:relative;overflow:visible}:host([disabled]){opacity:var(--highcontrast-avatar-color-opacity-disabled, var(--luzmo-avatar-color-opacity-disabled, var(--avatar-color-opacity-disabled)))}:host(:not([disabled])) .is-focused:after,:host(:not([disabled])) .link:focus-visible:after{pointer-events:none;content:"";inline-size:calc(var(--luzmo-avatar-custom-size, var(--luzmo-avatar-size, var(--avatar-size))) + var(--luzmo-avatar-focus-indicator-gap, var(--avatar-focus-indicator-gap)) * 2);block-size:calc(var(--luzmo-avatar-custom-size, var(--luzmo-avatar-size, var(--avatar-size))) + var(--luzmo-avatar-focus-indicator-gap, var(--avatar-focus-indicator-gap)) * 2);border-style:solid;border-width:var(--luzmo-avatar-focus-indicator-width, var(--avatar-focus-indicator-width));border-color:var(--highcontrast-avatar-focus-indicator-color, var(--luzmo-avatar-focus-indicator-color, var(--avatar-focus-indicator-color)));border-radius:var(--avatar-border-radius);position:absolute;inset-block-start:calc((var(--luzmo-avatar-focus-indicator-gap, var(--avatar-focus-indicator-gap)) + var(--luzmo-avatar-focus-indicator-width, var(--avatar-focus-indicator-width))) * -1);inset-inline-start:calc((var(--luzmo-avatar-focus-indicator-gap, var(--avatar-focus-indicator-gap)) + var(--luzmo-avatar-focus-indicator-width, var(--avatar-focus-indicator-width))) * -1)}.link{outline:0}.image{inline-size:var(--luzmo-avatar-size, var(--avatar-size));block-size:var(--luzmo-avatar-size, var(--avatar-size));border-radius:var(--avatar-border-radius)}:host([rounding=none]){border-radius:0}:host([rounding=none]) img{border-radius:0}:host([rounding=full]){border-radius:100%}:host([rounding=full]) img{border-radius:100%}:host([border=light]){border:var(--luzmo-avatar-border-width, var(--avatar-border-width)) solid var(--luzmo-avatar-border-color, var(--avatar-border-color))}:host([border=none]){border:0}:host{--avatar-color-opacity: 1;--avatar-border-width: var(--luzmo-border-width);--avatar-border-color: var(--luzmo-border-color);--avatar-size: 32px;--avatar-focus-indicator-width: var(--luzmo-indicator-width);--avatar-focus-indicator-gap: var(--luzmo-indicator-gap);--avatar-focus-indicator-color: var(--luzmo-indicator-color);--avatar-color-opacity-disabled: .3}:host([size=xxs]){--avatar-size: var(--luzmo-component-height-xxs)}:host([size=xs]){--avatar-size: var(--luzmo-component-height-xs)}:host([size=s]){--avatar-size: var(--luzmo-component-height-s)}:host{--avatar-size: var(--luzmo-component-height)}:host([size=l]){--avatar-size: var(--luzmo-component-height-l)}:host([size=xl]){--avatar-size: var(--luzmo-component-height-xl)}:host([size=xxl]){--avatar-size: var(--luzmo-component-height-xxl)}img{vertical-align:top}';var m=Object.defineProperty,i=(e,o,v,b)=>{for(var a=void 0,s=e.length-1,c;s>=0;s--)(c=e[s])&&(a=c(o,v,a)||a);return a&&m(o,v,a),a};class r extends z.LikeAnchor(l.SizedMixin(u.Focusable,{validSizes:Object.values(l.ElementSizes)})){constructor(){super(...arguments),this.src=""}static get styles(){return[n.unsafeCSS(h)]}get focusElement(){return this.anchorElement||this}render(){const o=n.html`
       <img
         class="image"
-        alt=${d.o(this.label||void 0)}
+        alt=${d.ifDefined(this.label||void 0)}
         src=${this.src}
       />
-    `;return this.href?this.renderAnchor({id:"link",className:"link",anchorContent:o}):o}}i([t.n({type:String,reflect:!0})],r.prototype,"border");i([t.n({type:String,reflect:!0})],r.prototype,"rounding");i([l.e("#link")],r.prototype,"anchorElement");i([t.n()],r.prototype,"src");customElements.get("luzmo-avatar")||customElements.define("luzmo-avatar",r);exports.LuzmoAvatar=r;
+    `;return this.href?this.renderAnchor({id:"link",className:"link",anchorContent:o}):o}}i([t.property({type:String,reflect:!0})],r.prototype,"border");i([t.property({type:String,reflect:!0})],r.prototype,"rounding");i([t.query("#link")],r.prototype,"anchorElement");i([t.property()],r.prototype,"src");customElements.get("luzmo-avatar")||customElements.define("luzmo-avatar",r);exports.LuzmoAvatar=r;

package/components/avatar/index.js

@@ -15,12 +15,12 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-import { r as n, x as m, n as i } from "../base-CFWO09N1.js";
-import { e as d } from "../query-D_KR_GUc.js";
-import { o as z } from "../if-defined-DULpqYwi.js";
-import { F as v } from "../focusable-C5JjRZmT.js";
-import { L as b } from "../like-anchor-DCFJN0LV.js";
-import { S as f, E as h } from "../sized-mixin-CJbBHWRQ.js";
+import { unsafeCSS as n, html as m } from "lit";
+import { property as i, query as d } from "lit/decorators.js";
+import { ifDefined as z } from "lit/directives/if-defined.js";
+import { F as v } from "../focusable-BjvsvVam.js";
+import { L as b } from "../like-anchor-CgqCU210.js";
+import { S as f, E as h } from "../sized-mixin-cJbo3PKR.js";
 const u = () => {
   if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
     const o = document.createElement("style");

package/components/base-5nDSSNeT.cjs

@@ -0,0 +1,18 @@
+/*! * Lucero - The design system for Luzmo.
+ * 
+ * Copyright © 2025 Luzmo
+ * All rights reserved.
+ * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
+ * This license allows users with a current active Luzmo account to use Lucero.
+ * This license terminates automatically if a user no longer has an active Luzmo account.
+ * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
+ * 
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ * */
+"use strict";const m=require("lit"),r=new Set,h=()=>{if(typeof document>"u")return;const i=document.documentElement.dir==="rtl"?document.documentElement.dir:"ltr";r.forEach(s=>{s.setAttribute("dir",i)})};let a=null;typeof document<"u"&&(a=new MutationObserver(h),a.observe(document.documentElement,{attributes:!0,attributeFilter:["dir"]}));const f=i=>i.startManagingContentDirection!==void 0||i.tagName==="LUZMO-THEME";function l(i){class s extends i{get isLTR(){return this.dir==="ltr"}hasVisibleFocusInTree(){if(typeof document>"u")return!1;const n=((u=document)=>{var d;let t=u.activeElement;for(;t!=null&&t.shadowRoot&&t.shadowRoot.activeElement;)t=t.shadowRoot.activeElement;const c=t?[t]:[];for(;t;){const o=t.assignedSlot||t.parentElement||((d=t.getRootNode())==null?void 0:d.host);o&&c.push(o),t=o}return c})(this.getRootNode())[0];if(!n)return!1;try{return n.matches(":focus-visible")||n.matches(".focus-visible")}catch{return n.matches(".focus-visible")}}connectedCallback(){if(typeof document>"u"){super.connectedCallback();return}if(!this.hasAttribute("dir")){let e=this.assignedSlot||this.parentNode;for(;e!==(document==null?void 0:document.documentElement)&&!f(e);)e=e.assignedSlot||e.parentNode||e.host;if(this.dir=e.dir==="rtl"?e.dir:this.dir||"ltr",e===(document==null?void 0:document.documentElement))r.add(this);else{const{localName:n}=e;n.search("-")>-1&&typeof customElements<"u"&&!customElements.get(n)?customElements.whenDefined(n).then(()=>{e.startManagingContentDirection(this)}):e.startManagingContentDirection(this)}this._dirParent=e}super.connectedCallback()}disconnectedCallback(){super.disconnectedCallback(),this._dirParent&&(this._dirParent===(document==null?void 0:document.documentElement)?r.delete(this):this._dirParent.stopManagingContentDirection(this),this.removeAttribute("dir"))}}return s}class E extends l(m.LitElement){}exports.LuzmoElement=E;exports.LuzmoMixin=l;

package/components/base-CdYjmV_8.js

@@ -0,0 +1,96 @@
+/*! * Lucero - The design system for Luzmo.
+ * 
+ * Copyright © 2025 Luzmo
+ * All rights reserved.
+ * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
+ * This license allows users with a current active Luzmo account to use Lucero.
+ * This license terminates automatically if a user no longer has an active Luzmo account.
+ * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
+ * 
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ * */
+import { LitElement as u } from "lit";
+const r = /* @__PURE__ */ new Set(), m = () => {
+  if (typeof document > "u") return;
+  const i = document.documentElement.dir === "rtl" ? document.documentElement.dir : "ltr";
+  r.forEach((s) => {
+    s.setAttribute("dir", i);
+  });
+};
+let a = null;
+typeof document < "u" && (a = new MutationObserver(m), a.observe(document.documentElement, {
+  attributes: !0,
+  attributeFilter: ["dir"]
+}));
+const h = (i) => i.startManagingContentDirection !== void 0 || i.tagName === "LUZMO-THEME";
+function f(i) {
+  class s extends i {
+    /**
+     * @private
+     */
+    get isLTR() {
+      return this.dir === "ltr";
+    }
+    hasVisibleFocusInTree() {
+      if (typeof document > "u") return !1;
+      const n = ((l = document) => {
+        var d;
+        let t = l.activeElement;
+        for (; t != null && t.shadowRoot && t.shadowRoot.activeElement; )
+          t = t.shadowRoot.activeElement;
+        const c = t ? [t] : [];
+        for (; t; ) {
+          const o = t.assignedSlot || t.parentElement || ((d = t.getRootNode()) == null ? void 0 : d.host);
+          o && c.push(o), t = o;
+        }
+        return c;
+      })(this.getRootNode())[0];
+      if (!n)
+        return !1;
+      try {
+        return n.matches(":focus-visible") || n.matches(".focus-visible");
+      } catch {
+        return n.matches(".focus-visible");
+      }
+    }
+    connectedCallback() {
+      if (typeof document > "u") {
+        super.connectedCallback();
+        return;
+      }
+      if (!this.hasAttribute("dir")) {
+        let e = this.assignedSlot || this.parentNode;
+        for (; e !== (document == null ? void 0 : document.documentElement) && !h(e); )
+          e = e.assignedSlot || // step into the shadow DOM of the parent of a slotted node
+          e.parentNode || // DOM Element detected
+          e.host;
+        if (this.dir = e.dir === "rtl" ? e.dir : this.dir || "ltr", e === (document == null ? void 0 : document.documentElement))
+          r.add(this);
+        else {
+          const { localName: n } = e;
+          n.search("-") > -1 && typeof customElements < "u" && !customElements.get(n) ? customElements.whenDefined(n).then(() => {
+            e.startManagingContentDirection(this);
+          }) : e.startManagingContentDirection(this);
+        }
+        this._dirParent = e;
+      }
+      super.connectedCallback();
+    }
+    disconnectedCallback() {
+      super.disconnectedCallback(), this._dirParent && (this._dirParent === (document == null ? void 0 : document.documentElement) ? r.delete(this) : this._dirParent.stopManagingContentDirection(this), this.removeAttribute("dir"));
+    }
+  }
+  return s;
+}
+class b extends f(u) {
+}
+export {
+  f as L,
+  b as a
+};

package/components/button/button-base.d.ts

@@ -12,6 +12,9 @@ declare const LuzmoButtonBase_base: typeof Focusable & {
  * @slot icon - icon element(s) to display at the start of the button
  */
 export declare class LuzmoButtonBase extends LuzmoButtonBase_base {
+    /**
+     * @internal
+     */
     static get styles(): CSSResultArray;
     active: boolean;
     /**
@@ -20,11 +23,24 @@ export declare class LuzmoButtonBase extends LuzmoButtonBase_base {
      */
     type: 'button' | 'submit' | 'reset';
     /**
+     * @internal
      * HTML anchor element that component clicks by proxy
      */
     private anchorElement;
+    /**
+     * @internal
+     * The element that receives focus when the button is focused.
+     */
     get focusElement(): HTMLElement;
+    /**
+     * @internal
+     * Whether the button has a label.
+     */
     protected get hasLabel(): boolean;
+    /**
+     * @internal
+     * The content of the button.
+     */
     protected get buttonContent(): TemplateResult[];
     constructor();
     private handleClickCapture;

package/components/button/button.d.ts

@@ -15,11 +15,30 @@ declare const LuzmoButton_base: typeof LuzmoButtonBase & {
  *
  * @slot - text label of the Button
  * @slot icon - The icon to use for Button
+ * @fires change - Announces that the `value` of the element has changed
+ * @attr size - The size of the select: `s`, `m`, `l` or `xl`
+ * @attr disabled - Whether the button is disabled.
  */
 export declare class LuzmoButton extends LuzmoButton_base {
+    /**
+     * @internal
+     */
     static get styles(): CSSResultArray;
+    /**
+     * @attr pending-label - The label to display when the button is in a pending state.
+     * @default 'Pending'
+     */
     pendingLabel: string;
+    /**
+     * @attr pending - Whether the button should be displayed in a pending state.
+     * @default false
+     * Use this property to set the button into a pending state
+     */
     pending: boolean;
+    /**
+     * @internal
+     * The controller that manages the pending state of the button.
+     */
     pendingStateController: PendingStateController<this>;
     /**
      * Initializes the `PendingStateController` for the Button component.
@@ -28,31 +47,48 @@ export declare class LuzmoButton extends LuzmoButton_base {
     constructor();
     click(): void;
     /**
+     * @attr variant - The visual variant to apply to this button.
      * The visual variant to apply to this button.
      */
     get variant(): ButtonVariants;
     set variant(variant: ButtonVariants);
+    /**
+     * @internal
+     * The visual variant to apply to this button.
+     */
     private _variant;
     /**
+     * @attr static-color - The static color variant to use for this button.
      * The static color variant to use for this button.
      */
     staticColor?: 'black' | 'white';
     /**
+     * @attr treatment - The visual treatment to apply to this button.
+     * @default 'fill'
      * The visual treatment to apply to this button.
      */
     treatment: ButtonTreatments;
     /**
+     * @attr quiet - Style this button to be less obvious
+     * @default false
      * Style this button to be less obvious
      */
     set quiet(quiet: boolean);
+    get quiet(): boolean;
     /**
+     * @internal
+     * Whether the button should be displayed in a quiet state
+     */
+    private _quiet;
+    /**
+     * @attr no-wrap - Disables text wrapping within the button component's label.
+     * @default false
      * Disables text wrapping within the button component's label.
      * Please note that this option is not a part of the design specification
      * and should be used carefully, with consideration of this overflow behavior
      * and the readability of the button's content.
      */
     noWrap: boolean;
-    get quiet(): boolean;
     protected firstUpdated(changes: PropertyValues<this>): void;
     protected renderButton(): TemplateResult;
 }