@luzmo/lucero 2.5.0 → 2.5.2

package/components/tabs/index.cjs

@@ -15,4 +15,4 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require("../tokens.cjs");const e=require("../tabs-DxOD4QNt.cjs");exports.LuzmoTab=e.i,exports.LuzmoTabPanel=e.r,exports.LuzmoTabs=e.n,exports.LuzmoTabsOverflow=e.t;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require("../tokens.cjs");const e=require("../tabs-B0WHKMuF.cjs");exports.LuzmoTab=e.i,exports.LuzmoTabPanel=e.r,exports.LuzmoTabs=e.n,exports.LuzmoTabsOverflow=e.t;

package/components/tabs/index.js

@@ -16,5 +16,4 @@
  * SOFTWARE.
  * */
 import "../tokens.js";
-import { i as e, n as t, r as n, t as r } from "../tabs-BD_ATrBg.js";
-export { e as LuzmoTab, n as LuzmoTabPanel, t as LuzmoTabs, r as LuzmoTabsOverflow };
+export { i as LuzmoTab, r as LuzmoTabPanel, n as LuzmoTabs, t as LuzmoTabsOverflow } from "../tabs-Dkt0B_-A.js";

package/components/{tabs-DxOD4QNt.cjs → tabs-B0WHKMuF.cjs}

@@ -15,7 +15,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-require("./tokens.cjs");const e=require("./decorate-Dq34MBGe.cjs"),t=require("./sized-mixin-BT7cv-fT.cjs"),n=require("./focus-visible-DNHNlrty.cjs"),r=require("./focusable-B6h03pAe.cjs"),i=require("./roving-tabindex-BoPao4td.cjs");require("./icon-zOPAWCdx.cjs");const a=require("./observe-slot-text-CvL-2ey3.cjs"),o=require("./random-id-BcUJAxUZ.cjs");require("./action-button-CX1uYbQp.cjs");const s=require("./observe-slot-presence-CS8pMePk.cjs"),c=require("./scaled-indicator-DLJIztx0.cjs");let l=require("lit"),u=require("lit/decorators.js"),d=require("@luzmo/icons"),f=require("lit/directives/if-defined.js"),p=require("lit/directives/class-map.js"),m=require("lit/decorators/property.js"),h=require("@lit-labs/observers/intersection-controller.js"),g=require("@lit-labs/observers/resize-controller.js");var _=`:host{font-family:var(--luzmo-tab-font-family,var(--luzmo-font-family));box-sizing:border-box;block-size:calc(var(--luzmo-tabs-item-height,var(--tabs-item-height)) - var(--luzmo-tabs-divider-size,var(--tabs-divider-size)));z-index:1;white-space:nowrap;color:var(--highcontrast-tabs-color,var(--luzmo-tabs-color,var(--tabs-color)));transition:color var(--luzmo-tabs-animation-duration,var(--tabs-animation-duration)) ease-out;cursor:pointer;outline:none;-webkit-text-decoration:none;text-decoration:none;position:relative}::slotted([slot=icon]){block-size:var(--luzmo-tabs-icon-size,var(--tabs-icon-size));inline-size:var(--luzmo-tabs-icon-size,var(--tabs-icon-size));margin-block-start:var(--luzmo-tabs-top-to-icon,var(--tabs-top-to-icon))}[name=icon]+#item-label{margin-inline-start:var(--luzmo-tabs-icon-to-text,var(--tabs-icon-to-text))}:host:before{content:"";box-sizing:border-box;block-size:calc(100% - var(--luzmo-tabs-top-to-text,var(--tabs-top-to-text)));inline-size:calc(100% + var(--luzmo-tabs-focus-indicator-gap,var(--tabs-focus-indicator-gap)) * 2);border-radius:var(--luzmo-tabs-focus-indicator-border-radius,var(--tabs-focus-indicator-border-radius));pointer-events:none;position:absolute;inset-block-start:calc(var(--luzmo-tabs-top-to-text,var(--tabs-top-to-text)) / 2);inset-inline-start:calc(var(--luzmo-tabs-focus-indicator-gap,var(--tabs-focus-indicator-gap)) * -1);inset-inline-end:calc(var(--luzmo-tabs-focus-indicator-gap,var(--tabs-focus-indicator-gap)) * -1);border:var(--luzmo-tabs-focus-indicator-width,var(--tabs-focus-indicator-width)) solid transparent!important}@media (hover:hover){:host(:hover){color:var(--highcontrast-tabs-color-hover,var(--luzmo-tabs-color-hover,var(--tabs-color-hover)))}}:host([selected]){color:var(--highcontrast-tabs-color-selected,var(--luzmo-tabs-color-selected,var(--tabs-color-selected)))}:host([disabled]){cursor:default;color:var(--highcontrast-tabs-color-disabled,var(--luzmo-tabs-color-disabled,var(--tabs-color-disabled)))}:host([disabled]) #item-label{cursor:default}:host(:focus-visible){color:var(--highcontrast-tabs-color-key-focus,var(--luzmo-tabs-color-key-focus,var(--tabs-color-key-focus)))}:host(:focus-visible):before{border-color:var(--highcontrast-tabs-focus-indicator-color,var(--luzmo-tabs-focus-indicator-color,var(--tabs-focus-indicator-color)))!important}#item-label{cursor:pointer;vertical-align:top;font-family:var(--luzmo-tabs-font-family,var(--tabs-font-family));font-style:var(--luzmo-tabs-font-style,var(--tabs-font-style));font-size:var(--luzmo-tabs-font-size,var(--tabs-font-size));font-weight:var(--luzmo-tabs-font-weight,var(--tabs-font-weight));line-height:var(--luzmo-tabs-line-height,var(--tabs-line-height));margin-block-start:var(--luzmo-tabs-top-to-text,var(--tabs-top-to-text));margin-block-end:var(--luzmo-tabs-bottom-to-text,var(--tabs-bottom-to-text));-webkit-text-decoration:none;text-decoration:none;display:inline-block}#item-label:empty{display:none}:host{scroll-margin-inline:var(--luzmo-tabs-item-horizontal-spacing,var(--tabs-item-horizontal-spacing))}:host([disabled]){pointer-events:none}#item-label[hidden]{display:none}@media (forced-colors:active){:host:before{background-color:buttonface}:host ::slotted([slot=icon]){z-index:1;color:inherit;position:relative}#item-label{z-index:1;position:relative}:host([selected]),:host([selected]) ::slotted([slot=icon]),:host([selected]) #item-label{color:highlighttext}}:host([vertical]){flex-direction:column;justify-content:center;align-items:center;height:auto;display:flex}:host([dir][vertical]) slot[name=icon]+#item-label{margin-inline-start:0;margin-block:calc(var(--luzmo-tabs-top-to-text,var(--tabs-top-to-text)) / 2) calc(var(--luzmo-tabs-bottom-to-text,var(--tabs-bottom-to-text)) / 2)}:host([vertical]) ::slotted([slot=icon]){margin-block-start:calc(var(--luzmo-tabs-top-to-icon,var(--tabs-top-to-icon)) / 2)}`,v=class extends n.t(a.t(s.t(e.n,`[slot="icon"]`),``)){constructor(...e){super(...e),this.disabled=!1,this.label=``,this.selected=!1,this.vertical=!1,this.value=``}static get styles(){return[(0,l.unsafeCSS)(_)]}get hasIcon(){return this.slotContentIsPresent}get hasLabel(){return!!this.label||this.slotHasContent}render(){return l.html`
+require("./tokens.cjs");const e=require("./decorate-SO02l0A6.cjs"),t=require("./sized-mixin-CSajkMro.cjs"),n=require("./focus-visible-BQAhwoxi.cjs"),r=require("./focusable-BIHTrJd6.cjs"),i=require("./roving-tabindex-BUFR8hPH.cjs");require("./icon-BlbMP3mJ.cjs");const a=require("./observe-slot-text-BqwCIv2a.cjs"),o=require("./random-id-BcUJAxUZ.cjs");require("./action-button-CL4ZlryE.cjs");const s=require("./observe-slot-presence-CS8pMePk.cjs"),c=require("./scaled-indicator-DLJIztx0.cjs");let l=require("lit"),u=require("lit/decorators.js"),d=require("@luzmo/icons"),f=require("lit/directives/if-defined.js"),p=require("lit/directives/class-map.js"),m=require("lit/decorators/property.js"),h=require("@lit-labs/observers/intersection-controller.js"),g=require("@lit-labs/observers/resize-controller.js");var _=`:host{font-family:var(--luzmo-tab-font-family,var(--luzmo-font-family));box-sizing:border-box;block-size:calc(var(--luzmo-tabs-item-height,var(--tabs-item-height)) - var(--luzmo-tabs-divider-size,var(--tabs-divider-size)));z-index:1;white-space:nowrap;color:var(--highcontrast-tabs-color,var(--luzmo-tabs-color,var(--tabs-color)));transition:color var(--luzmo-tabs-animation-duration,var(--tabs-animation-duration)) ease-out;cursor:pointer;outline:none;-webkit-text-decoration:none;text-decoration:none;position:relative}::slotted([slot=icon]){block-size:var(--luzmo-tabs-icon-size,var(--tabs-icon-size));inline-size:var(--luzmo-tabs-icon-size,var(--tabs-icon-size));margin-block-start:var(--luzmo-tabs-top-to-icon,var(--tabs-top-to-icon))}[name=icon]+#item-label{margin-inline-start:var(--luzmo-tabs-icon-to-text,var(--tabs-icon-to-text))}:host:before{content:"";box-sizing:border-box;block-size:calc(100% - var(--luzmo-tabs-top-to-text,var(--tabs-top-to-text)));inline-size:calc(100% + var(--luzmo-tabs-focus-indicator-gap,var(--tabs-focus-indicator-gap)) * 2);border-radius:var(--luzmo-tabs-focus-indicator-border-radius,var(--tabs-focus-indicator-border-radius));pointer-events:none;position:absolute;inset-block-start:calc(var(--luzmo-tabs-top-to-text,var(--tabs-top-to-text)) / 2);inset-inline-start:calc(var(--luzmo-tabs-focus-indicator-gap,var(--tabs-focus-indicator-gap)) * -1);inset-inline-end:calc(var(--luzmo-tabs-focus-indicator-gap,var(--tabs-focus-indicator-gap)) * -1);border:var(--luzmo-tabs-focus-indicator-width,var(--tabs-focus-indicator-width)) solid transparent!important}@media (hover:hover){:host(:hover){color:var(--highcontrast-tabs-color-hover,var(--luzmo-tabs-color-hover,var(--tabs-color-hover)))}}:host([selected]){color:var(--highcontrast-tabs-color-selected,var(--luzmo-tabs-color-selected,var(--tabs-color-selected)))}:host([disabled]){cursor:default;color:var(--highcontrast-tabs-color-disabled,var(--luzmo-tabs-color-disabled,var(--tabs-color-disabled)))}:host([disabled]) #item-label{cursor:default}:host(:focus-visible){color:var(--highcontrast-tabs-color-key-focus,var(--luzmo-tabs-color-key-focus,var(--tabs-color-key-focus)))}:host(:focus-visible):before{border-color:var(--highcontrast-tabs-focus-indicator-color,var(--luzmo-tabs-focus-indicator-color,var(--tabs-focus-indicator-color)))!important}#item-label{cursor:pointer;vertical-align:top;font-family:var(--luzmo-tabs-font-family,var(--tabs-font-family));font-style:var(--luzmo-tabs-font-style,var(--tabs-font-style));font-size:var(--luzmo-tabs-font-size,var(--tabs-font-size));font-weight:var(--luzmo-tabs-font-weight,var(--tabs-font-weight));line-height:var(--luzmo-tabs-line-height,var(--tabs-line-height));margin-block-start:var(--luzmo-tabs-top-to-text,var(--tabs-top-to-text));margin-block-end:var(--luzmo-tabs-bottom-to-text,var(--tabs-bottom-to-text));-webkit-text-decoration:none;text-decoration:none;display:inline-block}#item-label:empty{display:none}:host{scroll-margin-inline:var(--luzmo-tabs-item-horizontal-spacing,var(--tabs-item-horizontal-spacing))}:host([disabled]){pointer-events:none}#item-label[hidden]{display:none}@media (forced-colors:active){:host:before{background-color:buttonface}:host ::slotted([slot=icon]){z-index:1;color:inherit;position:relative}#item-label{z-index:1;position:relative}:host([selected]),:host([selected]) ::slotted([slot=icon]),:host([selected]) #item-label{color:highlighttext}}:host([vertical]){flex-direction:column;justify-content:center;align-items:center;height:auto;display:flex}:host([dir][vertical]) slot[name=icon]+#item-label{margin-inline-start:0;margin-block:calc(var(--luzmo-tabs-top-to-text,var(--tabs-top-to-text)) / 2) calc(var(--luzmo-tabs-bottom-to-text,var(--tabs-bottom-to-text)) / 2)}:host([vertical]) ::slotted([slot=icon]){margin-block-start:calc(var(--luzmo-tabs-top-to-icon,var(--tabs-top-to-icon)) / 2)}`,v=class extends n.t(a.t(s.t(e.n,`[slot="icon"]`),``)){constructor(...e){super(...e),this.disabled=!1,this.label=``,this.selected=!1,this.vertical=!1,this.value=``}static get styles(){return[(0,l.unsafeCSS)(_)]}get hasIcon(){return this.slotContentIsPresent}get hasLabel(){return!!this.label||this.slotHasContent}render(){return l.html`
       ${this.hasIcon?l.html` <slot name="icon"></slot> `:l.nothing}
       <label id="item-label" ?hidden=${!this.hasLabel}>
         <slot>${this.label}</slot>
@@ -25,7 +25,7 @@ require("./tokens.cjs");const e=require("./decorate-Dq34MBGe.cjs"),t=require("./
         @focusin=${this.handleFocusin}
         @focusout=${this.handleFocusout}
       ></slot>
-    `}firstUpdated(){this.slot=`tab-panel`,this.setAttribute(`role`,`tabpanel`),this.tabIndex=0,this.hasAttribute(`id`)||(this.id=`luzmo-tab-panel-${o.t()}`)}updated(e){e.has(`selected`)&&(this.selected?(this.removeAttribute(`aria-hidden`),this.tabIndex=0):(this.setAttribute(`aria-hidden`,`true`),this.tabIndex=-1))}};e.t([(0,m.property)({type:Boolean,reflect:!0})],b.prototype,`selected`,void 0),e.t([(0,m.property)({type:String,reflect:!0})],b.prototype,`value`,void 0);var x=`#list{--tabs-item-height:calc(var(--luzmo-component-height) + var(--luzmo-spacing-5));--tabs-item-horizontal-spacing:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-3));--tabs-item-vertical-spacing:var(--luzmo-spacing-2);--tabs-start-to-edge:var(--luzmo-spacing-4);--tabs-top-to-text:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--tabs-bottom-to-text:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--tabs-icon-size:var(--luzmo-icon-size-s);--tabs-icon-to-text:var(--luzmo-spacing-3);--tabs-top-to-icon:var(--luzmo-spacing-4);--tabs-focus-indicator-gap:var(--luzmo-spacing-3);--tabs-font-size:var(--luzmo-font-size)}:host([size=s]) #list{--tabs-item-height:calc(var(--luzmo-component-height-s) + var(--luzmo-spacing-4));--tabs-item-horizontal-spacing:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-2));--tabs-item-vertical-spacing:var(--luzmo-spacing-2);--tabs-start-to-edge:var(--luzmo-spacing-4);--tabs-top-to-text:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--tabs-bottom-to-text:var(--luzmo-spacing-4);--tabs-icon-size:var(--luzmo-icon-size-xs);--tabs-icon-to-text:var(--luzmo-spacing-3);--tabs-top-to-icon:var(--luzmo-spacing-4);--tabs-focus-indicator-gap:var(--luzmo-spacing-3);--tabs-font-size:var(--luzmo-font-size-s)}:host([size=l]) #list{--tabs-item-height:calc(var(--luzmo-component-height-l) + var(--luzmo-spacing-5));--tabs-item-horizontal-spacing:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-4));--tabs-item-vertical-spacing:var(--luzmo-spacing-2);--tabs-start-to-edge:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--tabs-top-to-text:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-1));--tabs-bottom-to-text:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-1));--tabs-icon-size:var(--luzmo-icon-size-m);--tabs-icon-to-text:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tabs-top-to-icon:var(--luzmo-spacing-5);--tabs-focus-indicator-gap:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tabs-font-size:var(--luzmo-font-size-l)}:host([size=xl]) #list{--tabs-item-height:calc(var(--luzmo-component-height-xl) + var(--luzmo-spacing-5));--tabs-item-horizontal-spacing:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-4));--tabs-item-vertical-spacing:var(--luzmo-spacing-2);--tabs-start-to-edge:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--tabs-top-to-text:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-1));--tabs-bottom-to-text:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-1));--tabs-icon-size:var(--luzmo-icon-size-l);--tabs-icon-to-text:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tabs-top-to-icon:var(--luzmo-spacing-5);--tabs-focus-indicator-gap:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tabs-font-size:var(--luzmo-font-size-xl)}:host([compact]) #list{--luzmo-tabs-item-height:var(--luzmo-tabs-item-height-compact,var(--luzmo-component-height));--luzmo-tabs-top-to-text:var(--luzmo-tabs-top-to-text-compact,calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1)));--luzmo-tabs-bottom-to-text:var(--luzmo-tabs-bottom-to-text-compact,calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1)));--luzmo-tabs-top-to-icon:var(--luzmo-tabs-top-to-icon-compact,var(--luzmo-spacing-2))}:host([size=s][compact]) #list{--luzmo-tabs-item-height:var(--luzmo-tabs-item-height-compact,var(--luzmo-component-height-s));--luzmo-tabs-top-to-text:var(--luzmo-tabs-top-to-text-compact,var(--luzmo-spacing-2));--luzmo-tabs-bottom-to-text:var(--luzmo-tabs-bottom-to-text-compact,var(--luzmo-spacing-2));--luzmo-tabs-top-to-icon:var(--luzmo-tabs-top-to-icon-compact,var(--luzmo-spacing-1))}:host([size=l][compact]) #list{--luzmo-tabs-item-height:var(--luzmo-tabs-item-height-compact,var(--luzmo-component-height-l));--luzmo-tabs-top-to-text:var(--luzmo-tabs-top-to-text-compact,calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1)));--luzmo-tabs-bottom-to-text:var(--luzmo-tabs-bottom-to-text-compact,calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1)));--luzmo-tabs-top-to-icon:var(--luzmo-tabs-top-to-icon-compact,calc(var(--luzmo-spacing-3)))}:host([size=xl][compact]) #list{--luzmo-tabs-item-height:var(--luzmo-tabs-item-height-compact,var(--luzmo-component-height-xl));--luzmo-tabs-top-to-text:var(--luzmo-tabs-top-to-text-compact,var(--luzmo-spacing-4));--luzmo-tabs-bottom-to-text:var(--luzmo-tabs-bottom-to-text-compact,var(--luzmo-spacing-4));--luzmo-tabs-top-to-icon:var(--luzmo-tabs-top-to-icon-compact,calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1)))}`,S=`#list{--tabs-color:var(--luzmo-font-color);--tabs-color-selected:var(--luzmo-font-color-down);--tabs-color-hover:var(--luzmo-font-color-hover);--tabs-color-key-focus:var(--luzmo-font-color-focus);--tabs-color-disabled:var(--luzmo-disabled-color);--tabs-font-family:var(--luzmo-font-family);--tabs-font-style:var(--luzmo-font-style);--tabs-font-size:var(--luzmo-font-size);--tabs-line-height:var(--luzmo-line-height);--tabs-focus-indicator-width:var(--luzmo-indicator-width);--tabs-focus-indicator-border-radius:var(--luzmo-border-radius);--tabs-focus-indicator-color:var(--luzmo-indicator-color);--tabs-selection-indicator-color:var(--luzmo-font-color-down);--tabs-list-background-direction:top;--tabs-divider-size:2px;--tabs-divider-border-radius:1px;--tabs-animation-duration:var(--luzmo-animation-duration);--tabs-animation-ease:ease-in-out}:host([emphasized]) #list{--luzmo-tabs-color-selected:var(--luzmo-tabs-color-selected-emphasized,var(--luzmo-primary));--luzmo-tabs-color-hover:var(--luzmo-tabs-color-hover-emphasized,var(--luzmo-primary-hover));--luzmo-tabs-color-key-focus:var(--luzmo-tabs-color-key-focus-emphasized,var(--luzmo-primary-focus));--luzmo-tabs-selection-indicator-color:var(--luzmo-tabs-selection-indicator-color-emphasized,var(--luzmo-primary-down))}:host([direction^=vertical]) #list{--luzmo-tabs-list-background-direction:var(--luzmo-tabs-list-background-direction-vertical,right)}:host([direction^=vertical-right]) #list{--luzmo-tabs-list-background-direction:var(--luzmo-tabs-list-background-direction-vertical-right,left)}:is(:host([direction^=vertical]) #list:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)),:host([dir=rtl][direction^=vertical]) #list){--luzmo-tabs-list-background-direction:var(--luzmo-tabs-list-background-direction-vertical,left)}:is(:host([direction^=vertical-right]) #list:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)),:host([dir=rtl][direction^=vertical-right]) #list){--luzmo-tabs-list-background-direction:var(--luzmo-tabs-list-background-direction-vertical,right)}#list{z-index:0;vertical-align:top;background:linear-gradient(to var(--luzmo-tabs-list-background-direction,var(--tabs-list-background-direction)), var(--highcontrast-tabs-divider-background-color,var(--luzmo-tabs-divider-background-color,var(--tabs-divider-background-color))) 0 var(--luzmo-tabs-divider-size,var(--tabs-divider-size)), transparent var(--luzmo-tabs-divider-size,var(--tabs-divider-size)));margin:0;padding-block:0;display:flex;position:relative}::slotted([selected]:not([slot])){color:var(--highcontrast-tabs-color-selected,var(--luzmo-tabs-color-selected,var(--tabs-color-selected)))}::slotted([disabled]:not([slot])){cursor:default;color:var(--highcontrast-tabs-color-disabled,var(--luzmo-tabs-color-disabled,var(--tabs-color-disabled)))}#selection-indicator{background-color:var(--highcontrast-tabs-selection-indicator-color,var(--luzmo-tabs-selection-indicator-color,var(--tabs-selection-indicator-color)));z-index:0;transition:transform var(--luzmo-tabs-animation-duration,var(--tabs-animation-duration)) var(--luzmo-tabs-animation-ease,var(--tabs-animation-ease));transform-origin:0 0;border-radius:var(--luzmo-tabs-divider-border-radius,var(--tabs-divider-border-radius));position:absolute;inset-inline-start:0}:host([direction^=horizontal]) #list{align-items:center}:host([direction^=horizontal]) #list ::slotted(:not([slot])){vertical-align:top}:host([direction^=horizontal]) ::slotted(:not(:first-child)){margin-inline-start:var(--luzmo-tabs-item-horizontal-spacing,var(--tabs-item-horizontal-spacing))}:host([direction^=horizontal]) #list #selection-indicator{block-size:var(--luzmo-tabs-divider-size,var(--tabs-divider-size));position:absolute;inset-block-end:0}:host([direction^=horizontal][compact]) #list{box-sizing:initial;align-items:end}:host([quiet]) #list{background:0 0;border-color:#0000;display:inline-flex}:host([quiet]) #selection-indicator{padding-inline-start:var(--luzmo-tabs-start-to-item-quiet)}:host([direction^=vertical]) #list,:host([direction^=vertical-right]) #list{flex-direction:column;padding:0;display:inline-flex}:host([direction^=vertical-right][quiet]) #list,:host([direction^=vertical][quiet]) #list{border-color:#0000}:host([direction^=vertical]) #list ::slotted(:not([slot])),:host([direction^=vertical-right]) #list ::slotted(:not([slot])){block-size:var(--luzmo-tabs-item-height,var(--tabs-item-height));line-height:var(--luzmo-tabs-item-height,var(--tabs-item-height));margin-block-end:var(--luzmo-tabs-item-vertical-spacing,var(--tabs-item-vertical-spacing));margin-inline-start:var(--luzmo-tabs-start-to-edge,var(--tabs-start-to-edge));margin-inline-end:var(--luzmo-tabs-start-to-edge,var(--tabs-start-to-edge));padding-block:0}:host([direction^=vertical]) #list ::slotted(:not([slot])):before,:host([direction^=vertical-right]) #list ::slotted(:not([slot])):before{inset-inline-start:calc(var(--luzmo-tabs-focus-indicator-gap,var(--tabs-focus-indicator-gap)) * -1)}:host([direction^=vertical]) #list #selection-indicator,:host([direction^=vertical-right]) #list #selection-indicator{inline-size:var(--luzmo-tabs-divider-size,var(--tabs-divider-size));position:absolute;inset-block-start:0;inset-inline-start:0}:host([direction^=vertical-right]) #list #selection-indicator{inset-inline:auto 0}@media (forced-colors:active){#list{--highcontrast-tabs-divider-background-color:var(--luzmo-border-color);--highcontrast-tabs-selection-indicator-color:Highlight;--highcontrast-tabs-focus-indicator-color:CanvasText;--highcontrast-tabs-focus-indicator-background-color:Highlight;--highcontrast-tabs-color:ButtonText;--highcontrast-tabs-color-hover:ButtonText;--highcontrast-tabs-color-selected:HighlightText;--highcontrast-tabs-color-key-focus:ButtonText;--highcontrast-tabs-color-disabled:GrayText;forced-color-adjust:none}#list ::slotted([selected]:not([slot])):before{background-color:var(--highcontrast-tabs-focus-indicator-background-color)}:host([direction^=vertical][compact]) #list #list ::slotted(:not([slot])):before{block-size:100%;inset-block-start:0}:host([quiet]) #list{background:linear-gradient(to var(--luzmo-tabs-list-background-direction,var(--tabs-list-background-direction)), var(--highcontrast-tabs-divider-background-color,var(--luzmo-tabs-divider-background-color,var(--tabs-divider-background-color))) 0 var(--luzmo-tabs-divider-size,var(--tabs-divider-size)), transparent var(--luzmo-tabs-divider-size,var(--tabs-divider-size)))}}#list{--tabs-font-weight:var(--luzmo-font-weight);--tabs-divider-background-color:var(--luzmo-border-color)}:host{grid-template-columns:100%;display:grid;position:relative}:host(:not([direction^=vertical])){grid-template-rows:auto 1fr}:host([direction^=vertical]){grid-template-columns:auto 1fr}:host([dir=rtl]) #selection-indicator{left:0;right:auto}:host([direction=vertical-right]) #list #selection-indicator{inset-inline:auto 0}#list{justify-content:var(--luzmo-tabs-list-justify-content)}:host([disabled]) #list{pointer-events:none}:host([disabled]) #list #selection-indicator{background-color:var(--luzmo-tabs-color-disabled,var(--tabs-color-disabled))}:host([disabled]) ::slotted(sp-tab){color:var(--luzmo-tabs-color-disabled,var(--tabs-color-disabled))}:host([direction=vertical-right]) #list #selection-indicator,:host([direction=vertical]) #list #selection-indicator{inset-block-start:0}#selection-indicator.first-position{transition:none}:host([dir][direction=horizontal]) #list.scroll{scrollbar-width:none;overflow:auto hidden}:host([dir][direction=horizontal]) #list.scroll::-webkit-scrollbar{display:none}`;function C(e,t,n,r){let i=n[e+(t===`rtl`?-1:1)],a=r.scrollLeft+r.offsetWidth;return i?i.offsetLeft-r.offsetWidth:a}function w(e,t,n,r){let i=n[e+(t===`rtl`?1:-1)],a=t===`rtl`?-r.offsetWidth:0;return i?i.offsetLeft+i.offsetWidth:a}var T=class extends t.n(r.t,{noDefaultSize:!0}){static get styles(){return[(0,l.unsafeCSS)(x),(0,l.unsafeCSS)(S),c.t.baseStyles()]}set tabs(e){e!==this.tabs&&(this._tabs.forEach(e=>{this.resizeController.unobserve(e)}),e.forEach(e=>{this.resizeController.observe(e)}),this._tabs=e,this.rovingTabindexController.clearElementCache())}get tabs(){return this._tabs}constructor(){super(),this.auto=!1,this.compact=!1,this.direction=`horizontal`,this.emphasized=!1,this.label=``,this.enableTabsScroll=!1,this.quiet=!1,this.selectionIndicatorStyle=c.t.noSelectionStyle,this.shouldAnimate=!1,this.selected=``,this._tabs=[],this.resizeController=new g.ResizeController(this,{callback:()=>{this.updateSelectionIndicator()}}),this.rovingTabindexController=new i.t(this,{focusInIndex:e=>{let t=0;return e.find((e,n)=>{let r=this.selected?e.value===this.selected:!e.disabled;return t=n,r})?t:-1},direction:()=>`both`,elementEnterAction:e=>{this.auto&&(this.shouldAnimate=!0,this.selectTarget(e))},elements:()=>this.tabs,isFocusableElement:e=>!this.disabled&&!e.disabled,listenerScope:()=>this.tabList}),this.onTabsScroll=()=>{this.dispatchEvent(new Event(`luzmo-tabs-scroll`,{bubbles:!0,composed:!0}))},this.onClick=e=>{if(this.disabled)return;let t=e.composedPath().find(e=>e.parentElement===this);!t||t.disabled||(this.shouldAnimate=!0,this.selectTarget(t))},this.onKeyDown=e=>{if(e.code===`Enter`||e.code===`Space`){e.preventDefault();let t=e.target;t&&this.selectTarget(t)}},this.updateCheckedState=()=>{if(this.tabs.forEach(e=>{e.removeAttribute(`selected`)}),this.selected){let e=this.tabs.find(e=>e.value===this.selected);e?e.selected=!0:this.selected=``}else{let e=this.tabs[0];e&&e.setAttribute(`tabindex`,`0`)}this.updateSelectionIndicator()},this.updateSelectionIndicator=async()=>{let e=this.tabs.find(e=>e.selected);if(!e){this.selectionIndicatorStyle=c.t.noSelectionStyle;return}await Promise.all([e.updateComplete,document.fonts?document.fonts.ready:Promise.resolve()]);let{width:t,height:n}=e.getBoundingClientRect();this.selectionIndicatorStyle=this.direction===`horizontal`?c.t.transformX(e.offsetLeft,t):c.t.transformY(e.offsetTop,n)},new h.IntersectionController(this,{config:{root:null,rootMargin:`0px`,threshold:[0,1]},callback:()=>{this.updateSelectionIndicator()}})}get focusElement(){return this.rovingTabindexController.focusInElement||this}limitDeltaToInterval(e,t){return n=>n<e?e:n>t?t:n}scrollTabs(e,t=`smooth`){if(e===0)return;let{scrollLeft:n,clientWidth:r,scrollWidth:i}=this.tabList,a=i-r-Math.abs(n),o=this.dir===`ltr`?this.limitDeltaToInterval(-n,a):this.limitDeltaToInterval(-a,Math.abs(n));this.tabList?.scrollBy({left:o(e),top:0,behavior:t})}get scrollState(){if(this.tabList){let{scrollLeft:e,clientWidth:t,scrollWidth:n}=this.tabList,r=Math.abs(e)>0,i=Math.ceil(Math.abs(e))<n-t;return{canScrollLeft:this.dir===`ltr`?r:i,canScrollRight:this.dir===`ltr`?i:r}}return{}}async getUpdateComplete(){let e=await super.getUpdateComplete(),t=[...this.children].map(e=>e.updateComplete===void 0?Promise.resolve(!0):e.updateComplete);return await Promise.all(t),e}getNecessaryAutoScroll(e){let t=this.tabs[e],n=t.offsetLeft+t.offsetWidth,r=this.tabList.scrollLeft+this.tabList.offsetWidth,i=t.offsetLeft,a=this.tabList.scrollLeft;return n>r?C(e,this.dir,this.tabs,this.tabList):i<a?w(e,this.dir,this.tabs,this.tabList):-1}async scrollToSelection(){if(!this.enableTabsScroll||!this.selected)return;await this.updateComplete;let e=this.tabs.findIndex(e=>e.value===this.selected);if(e!==-1&&this.tabList){let t=this.getNecessaryAutoScroll(e);t!==-1&&this.tabList.scrollTo({left:t})}}updated(e){super.updated(e),e.has(`selected`)&&this.scrollToSelection()}managePanels({target:e}){e.assignedElements().map(e=>{let{value:t,id:n}=e,r=this.querySelector(`[role="tab"][value="${t}"]`);r&&(r.setAttribute(`aria-controls`,n),e.setAttribute(`aria-labelledby`,r.id)),e.selected=t===this.selected})}render(){return l.html`
+    `}firstUpdated(){this.slot=`tab-panel`,this.setAttribute(`role`,`tabpanel`),this.tabIndex=0,this.hasAttribute(`id`)||(this.id=`luzmo-tab-panel-${o.t()}`)}updated(e){e.has(`selected`)&&(this.selected?(this.removeAttribute(`aria-hidden`),this.tabIndex=0):(this.setAttribute(`aria-hidden`,`true`),this.tabIndex=-1))}};e.t([(0,m.property)({type:Boolean,reflect:!0})],b.prototype,`selected`,void 0),e.t([(0,m.property)({type:String,reflect:!0})],b.prototype,`value`,void 0);var x=`#list{--tabs-item-height:calc(var(--luzmo-component-height) + var(--luzmo-spacing-5));--tabs-item-horizontal-spacing:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-3));--tabs-item-vertical-spacing:var(--luzmo-spacing-2);--tabs-start-to-edge:var(--luzmo-spacing-4);--tabs-top-to-text:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--tabs-bottom-to-text:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--tabs-icon-size:var(--luzmo-icon-size-s);--tabs-icon-to-text:var(--luzmo-spacing-3);--tabs-top-to-icon:var(--luzmo-spacing-4);--tabs-focus-indicator-gap:var(--luzmo-spacing-3);--tabs-font-size:var(--luzmo-font-size)}:host([size=s]) #list{--tabs-item-height:calc(var(--luzmo-component-height-s) + var(--luzmo-spacing-4));--tabs-item-horizontal-spacing:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-2));--tabs-item-vertical-spacing:var(--luzmo-spacing-2);--tabs-start-to-edge:var(--luzmo-spacing-4);--tabs-top-to-text:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--tabs-bottom-to-text:var(--luzmo-spacing-4);--tabs-icon-size:var(--luzmo-icon-size-xs);--tabs-icon-to-text:var(--luzmo-spacing-3);--tabs-top-to-icon:var(--luzmo-spacing-4);--tabs-focus-indicator-gap:var(--luzmo-spacing-3);--tabs-font-size:var(--luzmo-font-size-s)}:host([size=l]) #list{--tabs-item-height:calc(var(--luzmo-component-height-l) + var(--luzmo-spacing-5));--tabs-item-horizontal-spacing:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-4));--tabs-item-vertical-spacing:var(--luzmo-spacing-2);--tabs-start-to-edge:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--tabs-top-to-text:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-1));--tabs-bottom-to-text:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-1));--tabs-icon-size:var(--luzmo-icon-size-m);--tabs-icon-to-text:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tabs-top-to-icon:var(--luzmo-spacing-5);--tabs-focus-indicator-gap:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tabs-font-size:var(--luzmo-font-size-l)}:host([size=xl]) #list{--tabs-item-height:calc(var(--luzmo-component-height-xl) + var(--luzmo-spacing-5));--tabs-item-horizontal-spacing:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-4));--tabs-item-vertical-spacing:var(--luzmo-spacing-2);--tabs-start-to-edge:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--tabs-top-to-text:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-1));--tabs-bottom-to-text:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-1));--tabs-icon-size:var(--luzmo-icon-size-l);--tabs-icon-to-text:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tabs-top-to-icon:var(--luzmo-spacing-5);--tabs-focus-indicator-gap:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tabs-font-size:var(--luzmo-font-size-xl)}:host([compact]) #list{--luzmo-tabs-item-height:var(--luzmo-tabs-item-height-compact,var(--luzmo-component-height));--luzmo-tabs-top-to-text:var(--luzmo-tabs-top-to-text-compact,calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1)));--luzmo-tabs-bottom-to-text:var(--luzmo-tabs-bottom-to-text-compact,calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1)));--luzmo-tabs-top-to-icon:var(--luzmo-tabs-top-to-icon-compact,var(--luzmo-spacing-2))}:host([size=s][compact]) #list{--luzmo-tabs-item-height:var(--luzmo-tabs-item-height-compact,var(--luzmo-component-height-s));--luzmo-tabs-top-to-text:var(--luzmo-tabs-top-to-text-compact,var(--luzmo-spacing-2));--luzmo-tabs-bottom-to-text:var(--luzmo-tabs-bottom-to-text-compact,var(--luzmo-spacing-2));--luzmo-tabs-top-to-icon:var(--luzmo-tabs-top-to-icon-compact,var(--luzmo-spacing-1))}:host([size=l][compact]) #list{--luzmo-tabs-item-height:var(--luzmo-tabs-item-height-compact,var(--luzmo-component-height-l));--luzmo-tabs-top-to-text:var(--luzmo-tabs-top-to-text-compact,calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1)));--luzmo-tabs-bottom-to-text:var(--luzmo-tabs-bottom-to-text-compact,calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1)));--luzmo-tabs-top-to-icon:var(--luzmo-tabs-top-to-icon-compact,calc(var(--luzmo-spacing-3)))}:host([size=xl][compact]) #list{--luzmo-tabs-item-height:var(--luzmo-tabs-item-height-compact,var(--luzmo-component-height-xl));--luzmo-tabs-top-to-text:var(--luzmo-tabs-top-to-text-compact,var(--luzmo-spacing-4));--luzmo-tabs-bottom-to-text:var(--luzmo-tabs-bottom-to-text-compact,var(--luzmo-spacing-4));--luzmo-tabs-top-to-icon:var(--luzmo-tabs-top-to-icon-compact,calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1)))}`,S=`#list{--tabs-color:var(--luzmo-font-color);--tabs-color-selected:var(--luzmo-font-color-down);--tabs-color-hover:var(--luzmo-font-color-hover);--tabs-color-key-focus:var(--luzmo-font-color-focus);--tabs-color-disabled:var(--luzmo-disabled-color);--tabs-font-family:var(--luzmo-font-family);--tabs-font-style:var(--luzmo-font-style);--tabs-font-size:var(--luzmo-font-size);--tabs-line-height:var(--luzmo-line-height);--tabs-focus-indicator-width:var(--luzmo-indicator-width);--tabs-focus-indicator-border-radius:var(--luzmo-border-radius);--tabs-focus-indicator-color:var(--luzmo-indicator-color);--tabs-selection-indicator-color:var(--luzmo-font-color-down);--tabs-list-background-direction:top;--tabs-divider-size:2px;--tabs-divider-border-radius:1px;--tabs-animation-duration:var(--luzmo-animation-duration);--tabs-animation-ease:ease-in-out}:host([emphasized]) #list{--luzmo-tabs-color-selected:var(--luzmo-tabs-color-selected-emphasized,var(--luzmo-primary));--luzmo-tabs-color-hover:var(--luzmo-tabs-color-hover-emphasized,var(--luzmo-primary-hover));--luzmo-tabs-color-key-focus:var(--luzmo-tabs-color-key-focus-emphasized,var(--luzmo-primary-focus));--luzmo-tabs-selection-indicator-color:var(--luzmo-tabs-selection-indicator-color-emphasized,var(--luzmo-primary-down))}:host([direction^=vertical]) #list{--luzmo-tabs-list-background-direction:var(--luzmo-tabs-list-background-direction-vertical,right)}:host([direction^=vertical-right]) #list{--luzmo-tabs-list-background-direction:var(--luzmo-tabs-list-background-direction-vertical-right,left)}:is(:host([direction^=vertical]) #list:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)),:host([dir=rtl][direction^=vertical]) #list){--luzmo-tabs-list-background-direction:var(--luzmo-tabs-list-background-direction-vertical,left)}:is(:host([direction^=vertical-right]) #list:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)),:host([dir=rtl][direction^=vertical-right]) #list){--luzmo-tabs-list-background-direction:var(--luzmo-tabs-list-background-direction-vertical,right)}#list{z-index:0;vertical-align:top;background:linear-gradient(to var(--luzmo-tabs-list-background-direction,var(--tabs-list-background-direction)), var(--highcontrast-tabs-divider-background-color,var(--luzmo-tabs-divider-background-color,var(--tabs-divider-background-color))) 0 var(--luzmo-tabs-divider-size,var(--tabs-divider-size)), transparent var(--luzmo-tabs-divider-size,var(--tabs-divider-size)));margin:0;padding-block:0;display:flex;position:relative}::slotted([selected]:not([slot])){color:var(--highcontrast-tabs-color-selected,var(--luzmo-tabs-color-selected,var(--tabs-color-selected)))}::slotted([disabled]:not([slot])){cursor:default;color:var(--highcontrast-tabs-color-disabled,var(--luzmo-tabs-color-disabled,var(--tabs-color-disabled)))}#selection-indicator{background-color:var(--highcontrast-tabs-selection-indicator-color,var(--luzmo-tabs-selection-indicator-color,var(--tabs-selection-indicator-color)));z-index:0;transition:transform var(--luzmo-tabs-animation-duration,var(--tabs-animation-duration)) var(--luzmo-tabs-animation-ease,var(--tabs-animation-ease));transform-origin:0 0;border-radius:var(--luzmo-tabs-divider-border-radius,var(--tabs-divider-border-radius));position:absolute;inset-inline-start:0}:host([direction^=horizontal]) #list{align-items:center}:host([direction^=horizontal]) #list ::slotted(:not([slot])){vertical-align:top}:host([direction^=horizontal]) ::slotted(:not(:first-child)){margin-inline-start:var(--luzmo-tabs-item-horizontal-spacing,var(--tabs-item-horizontal-spacing))}:host([direction^=horizontal]) #list #selection-indicator{block-size:var(--luzmo-tabs-divider-size,var(--tabs-divider-size));position:absolute;inset-block-end:0}:host([direction^=horizontal][compact]) #list{box-sizing:initial;align-items:end}:host([quiet]) #list{background:0 0;border-color:#0000;display:inline-flex}:host([quiet]) #selection-indicator{padding-inline-start:var(--luzmo-tabs-start-to-item-quiet)}:host([direction^=vertical]) #list,:host([direction^=vertical-right]) #list{flex-direction:column;padding:0;display:inline-flex}:host([direction^=vertical-right][quiet]) #list,:host([direction^=vertical][quiet]) #list{border-color:#0000}:host([direction^=vertical]) #list ::slotted(:not([slot])),:host([direction^=vertical-right]) #list ::slotted(:not([slot])){block-size:var(--luzmo-tabs-item-height,var(--tabs-item-height));line-height:var(--luzmo-tabs-item-height,var(--tabs-item-height));margin-block-end:var(--luzmo-tabs-item-vertical-spacing,var(--tabs-item-vertical-spacing));margin-inline-start:var(--luzmo-tabs-start-to-edge,var(--tabs-start-to-edge));margin-inline-end:var(--luzmo-tabs-start-to-edge,var(--tabs-start-to-edge));padding-block:0}:host([direction^=vertical]) #list ::slotted(:not([slot])):before,:host([direction^=vertical-right]) #list ::slotted(:not([slot])):before{inset-inline-start:calc(var(--luzmo-tabs-focus-indicator-gap,var(--tabs-focus-indicator-gap)) * -1)}:host([direction^=vertical]) #list #selection-indicator,:host([direction^=vertical-right]) #list #selection-indicator{inline-size:var(--luzmo-tabs-divider-size,var(--tabs-divider-size));position:absolute;inset-block-start:0;inset-inline-start:0}:host([direction^=vertical-right]) #list #selection-indicator{inset-inline:auto 0}@media (forced-colors:active){#list{--highcontrast-tabs-divider-background-color:var(--luzmo-border-color);--highcontrast-tabs-selection-indicator-color:Highlight;--highcontrast-tabs-focus-indicator-color:CanvasText;--highcontrast-tabs-focus-indicator-background-color:Highlight;--highcontrast-tabs-color:ButtonText;--highcontrast-tabs-color-hover:ButtonText;--highcontrast-tabs-color-selected:HighlightText;--highcontrast-tabs-color-key-focus:ButtonText;--highcontrast-tabs-color-disabled:GrayText;forced-color-adjust:none}#list ::slotted([selected]:not([slot])):before{background-color:var(--highcontrast-tabs-focus-indicator-background-color)}:host([direction^=vertical][compact]) #list #list ::slotted(:not([slot])):before{block-size:100%;inset-block-start:0}:host([quiet]) #list{background:linear-gradient(to var(--luzmo-tabs-list-background-direction,var(--tabs-list-background-direction)), var(--highcontrast-tabs-divider-background-color,var(--luzmo-tabs-divider-background-color,var(--tabs-divider-background-color))) 0 var(--luzmo-tabs-divider-size,var(--tabs-divider-size)), transparent var(--luzmo-tabs-divider-size,var(--tabs-divider-size)))}}#list{--tabs-font-weight:var(--luzmo-font-weight);--tabs-divider-background-color:var(--luzmo-border-color)}:host{grid-template-columns:100%;display:grid;position:relative}:host(:not([direction^=vertical])){grid-template-rows:auto 1fr}:host([direction^=vertical]){grid-template-columns:auto 1fr}:host([dir=rtl]) #selection-indicator{left:0;right:auto}:host([direction=vertical-right]) #list #selection-indicator{inset-inline:auto 0}#list{justify-content:var(--luzmo-tabs-list-justify-content)}:host([disabled]) #list{pointer-events:none}:host([disabled]) #list #selection-indicator{background-color:var(--luzmo-tabs-color-disabled,var(--tabs-color-disabled))}:host([disabled]) ::slotted(sp-tab){color:var(--luzmo-tabs-color-disabled,var(--tabs-color-disabled))}:host([direction=vertical-right]) #list #selection-indicator,:host([direction=vertical]) #list #selection-indicator{inset-block-start:0}#selection-indicator.first-position{transition:none}:host([dir][direction=horizontal]) #list.scroll{scrollbar-width:none;overflow:auto hidden}:host([dir][direction=horizontal]) #list.scroll::-webkit-scrollbar{display:none}`;function C(e,t,n,r){let i=n[e+(t===`rtl`?-1:1)],a=r.scrollLeft+r.offsetWidth;return i?i.offsetLeft-r.offsetWidth:a}function w(e,t,n,r){let i=n[e+(t===`rtl`?1:-1)],a=t===`rtl`?-r.offsetWidth:0;return i?i.offsetLeft+i.offsetWidth:a}var T=class extends t.n(r.t,{noDefaultSize:!0}){static get styles(){return[(0,l.unsafeCSS)(x),(0,l.unsafeCSS)(S),c.t.baseStyles()]}set tabs(e){e!==this.tabs&&(this._tabs.forEach(e=>{this.resizeController.unobserve(e)}),e.forEach(e=>{this.resizeController.observe(e)}),this._tabs=e,this.rovingTabindexController.clearElementCache())}get tabs(){return this._tabs}constructor(){super(),this.auto=!1,this.compact=!1,this.direction=`horizontal`,this.emphasized=!1,this.label=``,this.enableTabsScroll=!1,this.quiet=!1,this.selectionIndicatorStyle=c.t.noSelectionStyle,this.shouldAnimate=!1,this.selected=``,this._tabs=[],this.resizeController=new g.ResizeController(this,{callback:()=>{this.updateSelectionIndicator()}}),this.rovingTabindexController=new i.t(this,{focusInIndex:e=>{let t=0;return e.find((e,n)=>{let r=this.selected?e.value===this.selected:!e.disabled;return t=n,r})?t:-1},direction:()=>`both`,elementEnterAction:e=>{this.auto&&(this.shouldAnimate=!0,this.selectTarget(e))},elements:()=>this.tabs,isFocusableElement:e=>!this.disabled&&!e.disabled,listenerScope:()=>this.tabList}),this.onTabsScroll=()=>{this.dispatchEvent(new Event(`luzmo-tabs-scroll`,{bubbles:!0,composed:!0}))},this.onClick=e=>{if(this.disabled)return;let t=e.composedPath().find(e=>e.parentElement===this);t&&!t.disabled&&(this.shouldAnimate=!0,this.selectTarget(t))},this.onKeyDown=e=>{if(e.code===`Enter`||e.code===`Space`){e.preventDefault();let t=e.target;t&&this.selectTarget(t)}},this.updateCheckedState=()=>{if(this.tabs.forEach(e=>{e.removeAttribute(`selected`)}),this.selected){let e=this.tabs.find(e=>e.value===this.selected);e?e.selected=!0:this.selected=``}else{let e=this.tabs[0];e&&e.setAttribute(`tabindex`,`0`)}this.updateSelectionIndicator()},this.updateSelectionIndicator=async()=>{let e=this.tabs.find(e=>e.selected);if(!e){this.selectionIndicatorStyle=c.t.noSelectionStyle;return}await Promise.all([e.updateComplete,document.fonts?document.fonts.ready:Promise.resolve()]);let{width:t,height:n}=e.getBoundingClientRect();this.selectionIndicatorStyle=this.direction===`horizontal`?c.t.transformX(e.offsetLeft,t):c.t.transformY(e.offsetTop,n)},new h.IntersectionController(this,{config:{root:null,rootMargin:`0px`,threshold:[0,1]},callback:()=>{this.updateSelectionIndicator()}})}get focusElement(){return this.rovingTabindexController.focusInElement||this}limitDeltaToInterval(e,t){return n=>n<e?e:n>t?t:n}scrollTabs(e,t=`smooth`){if(e===0)return;let{scrollLeft:n,clientWidth:r,scrollWidth:i}=this.tabList,a=i-r-Math.abs(n),o=this.dir===`ltr`?this.limitDeltaToInterval(-n,a):this.limitDeltaToInterval(-a,Math.abs(n));this.tabList?.scrollBy({left:o(e),top:0,behavior:t})}get scrollState(){if(this.tabList){let{scrollLeft:e,clientWidth:t,scrollWidth:n}=this.tabList,r=Math.abs(e)>0,i=Math.ceil(Math.abs(e))<n-t;return{canScrollLeft:this.dir===`ltr`?r:i,canScrollRight:this.dir===`ltr`?i:r}}return{}}async getUpdateComplete(){let e=await super.getUpdateComplete(),t=[...this.children].map(e=>e.updateComplete===void 0?Promise.resolve(!0):e.updateComplete);return await Promise.all(t),e}getNecessaryAutoScroll(e){let t=this.tabs[e],n=t.offsetLeft+t.offsetWidth,r=this.tabList.scrollLeft+this.tabList.offsetWidth,i=t.offsetLeft,a=this.tabList.scrollLeft;return n>r?C(e,this.dir,this.tabs,this.tabList):i<a?w(e,this.dir,this.tabs,this.tabList):-1}async scrollToSelection(){if(!this.enableTabsScroll||!this.selected)return;await this.updateComplete;let e=this.tabs.findIndex(e=>e.value===this.selected);if(e!==-1&&this.tabList){let t=this.getNecessaryAutoScroll(e);t!==-1&&this.tabList.scrollTo({left:t})}}updated(e){super.updated(e),e.has(`selected`)&&this.scrollToSelection()}managePanels({target:e}){e.assignedElements().map(e=>{let{value:t,id:n}=e,r=this.querySelector(`[role="tab"][value="${t}"]`);r&&(r.setAttribute(`aria-controls`,n),e.setAttribute(`aria-labelledby`,r.id)),e.selected=t===this.selected})}render(){return l.html`
       <div
         class=${(0,p.classMap)({scroll:this.enableTabsScroll})}
         aria-label=${(0,f.ifDefined)(this.label??void 0)}

package/components/{tabs-BD_ATrBg.js → tabs-Dkt0B_-A.js}

@@ -16,17 +16,17 @@
  * SOFTWARE.
  * */
 import "./tokens.js";
-import { n as e, t } from "./decorate-CkCg3wfh.js";
-import { n } from "./sized-mixin-DzQTebN-.js";
-import { t as r } from "./focus-visible-Bt2uDmuM.js";
-import { t as i } from "./focusable-DuP0-Kuy.js";
-import { t as a } from "./roving-tabindex-pomAn3z-.js";
-import "./icon-CsJZMhIm.js";
-import { t as o } from "./observe-slot-text-Db8Kx3P-.js";
-import { t as s } from "./random-id-CiMDyX7v.js";
-import "./action-button-BRijXjEz.js";
-import { t as c } from "./observe-slot-presence-BKY6n06-.js";
-import { t as l } from "./scaled-indicator-C-TupV4L.js";
+import { n as e, t } from "./decorate-CpKsOs9z.js";
+import { n } from "./sized-mixin-BmxIAuoH.js";
+import { t as r } from "./focus-visible-D6TRtUd7.js";
+import { t as i } from "./focusable-xjv79E40.js";
+import { t as a } from "./roving-tabindex-BKMkfzY0.js";
+import "./icon-DADJww_a.js";
+import { t as o } from "./observe-slot-text-Dzkb_VqN.js";
+import { t as s } from "./random-id-CO3s9i3n.js";
+import "./action-button-BB3ZZFNN.js";
+import { t as c } from "./observe-slot-presence-t2N_C6Ud.js";
+import { t as l } from "./scaled-indicator-CsfzvTDr.js";
 import { html as u, nothing as d, unsafeCSS as f } from "lit";
 import { property as p, query as m, queryAssignedElements as h, state as g } from "lit/decorators.js";
 import { luzmoAngleLeft as _, luzmoAngleRight as v } from "@luzmo/icons";
@@ -35,7 +35,7 @@ import { classMap as b } from "lit/directives/class-map.js";
 import { property as x } from "lit/decorators/property.js";
 import { IntersectionController as S } from "@lit-labs/observers/intersection-controller.js";
 import { ResizeController as C } from "@lit-labs/observers/resize-controller.js";
-//#region src/components/tabs/tab.module.scss?inline
+// src/components/tabs/tab.module.scss?inline
 var w = ":host{font-family:var(--luzmo-tab-font-family,var(--luzmo-font-family));box-sizing:border-box;block-size:calc(var(--luzmo-tabs-item-height,var(--tabs-item-height)) - var(--luzmo-tabs-divider-size,var(--tabs-divider-size)));z-index:1;white-space:nowrap;color:var(--highcontrast-tabs-color,var(--luzmo-tabs-color,var(--tabs-color)));transition:color var(--luzmo-tabs-animation-duration,var(--tabs-animation-duration)) ease-out;cursor:pointer;outline:none;-webkit-text-decoration:none;text-decoration:none;position:relative}::slotted([slot=icon]){block-size:var(--luzmo-tabs-icon-size,var(--tabs-icon-size));inline-size:var(--luzmo-tabs-icon-size,var(--tabs-icon-size));margin-block-start:var(--luzmo-tabs-top-to-icon,var(--tabs-top-to-icon))}[name=icon]+#item-label{margin-inline-start:var(--luzmo-tabs-icon-to-text,var(--tabs-icon-to-text))}:host:before{content:\"\";box-sizing:border-box;block-size:calc(100% - var(--luzmo-tabs-top-to-text,var(--tabs-top-to-text)));inline-size:calc(100% + var(--luzmo-tabs-focus-indicator-gap,var(--tabs-focus-indicator-gap)) * 2);border-radius:var(--luzmo-tabs-focus-indicator-border-radius,var(--tabs-focus-indicator-border-radius));pointer-events:none;position:absolute;inset-block-start:calc(var(--luzmo-tabs-top-to-text,var(--tabs-top-to-text)) / 2);inset-inline-start:calc(var(--luzmo-tabs-focus-indicator-gap,var(--tabs-focus-indicator-gap)) * -1);inset-inline-end:calc(var(--luzmo-tabs-focus-indicator-gap,var(--tabs-focus-indicator-gap)) * -1);border:var(--luzmo-tabs-focus-indicator-width,var(--tabs-focus-indicator-width)) solid transparent!important}@media (hover:hover){:host(:hover){color:var(--highcontrast-tabs-color-hover,var(--luzmo-tabs-color-hover,var(--tabs-color-hover)))}}:host([selected]){color:var(--highcontrast-tabs-color-selected,var(--luzmo-tabs-color-selected,var(--tabs-color-selected)))}:host([disabled]){cursor:default;color:var(--highcontrast-tabs-color-disabled,var(--luzmo-tabs-color-disabled,var(--tabs-color-disabled)))}:host([disabled]) #item-label{cursor:default}:host(:focus-visible){color:var(--highcontrast-tabs-color-key-focus,var(--luzmo-tabs-color-key-focus,var(--tabs-color-key-focus)))}:host(:focus-visible):before{border-color:var(--highcontrast-tabs-focus-indicator-color,var(--luzmo-tabs-focus-indicator-color,var(--tabs-focus-indicator-color)))!important}#item-label{cursor:pointer;vertical-align:top;font-family:var(--luzmo-tabs-font-family,var(--tabs-font-family));font-style:var(--luzmo-tabs-font-style,var(--tabs-font-style));font-size:var(--luzmo-tabs-font-size,var(--tabs-font-size));font-weight:var(--luzmo-tabs-font-weight,var(--tabs-font-weight));line-height:var(--luzmo-tabs-line-height,var(--tabs-line-height));margin-block-start:var(--luzmo-tabs-top-to-text,var(--tabs-top-to-text));margin-block-end:var(--luzmo-tabs-bottom-to-text,var(--tabs-bottom-to-text));-webkit-text-decoration:none;text-decoration:none;display:inline-block}#item-label:empty{display:none}:host{scroll-margin-inline:var(--luzmo-tabs-item-horizontal-spacing,var(--tabs-item-horizontal-spacing))}:host([disabled]){pointer-events:none}#item-label[hidden]{display:none}@media (forced-colors:active){:host:before{background-color:buttonface}:host ::slotted([slot=icon]){z-index:1;color:inherit;position:relative}#item-label{z-index:1;position:relative}:host([selected]),:host([selected]) ::slotted([slot=icon]),:host([selected]) #item-label{color:highlighttext}}:host([vertical]){flex-direction:column;justify-content:center;align-items:center;height:auto;display:flex}:host([dir][vertical]) slot[name=icon]+#item-label{margin-inline-start:0;margin-block:calc(var(--luzmo-tabs-top-to-text,var(--tabs-top-to-text)) / 2) calc(var(--luzmo-tabs-bottom-to-text,var(--tabs-bottom-to-text)) / 2)}:host([vertical]) ::slotted([slot=icon]){margin-block-start:calc(var(--luzmo-tabs-top-to-icon,var(--tabs-top-to-icon)) / 2)}", T = class extends r(o(c(e, "[slot=\"icon\"]"), "")) {
 	constructor(...e) {
 		super(...e), this.disabled = !1, this.label = "", this.selected = !1, this.vertical = !1, this.value = "";
@@ -77,8 +77,7 @@ t([x({
 	type: String,
 	reflect: !0
 })], T.prototype, "value", void 0);
-//#endregion
-//#region src/components/tabs/tab-panel.module.scss?inline
+// src/components/tabs/tab-panel.module.scss?inline
 var E = ":host{font-family:var(--luzmo-tab-panel-font-family,var(--luzmo-font-family));display:inline-flex}:host(:not([selected])){display:none}:host(:focus-visible){outline:var(--luzmo-tab-panel-indicator-color,var(--luzmo-indicator-color)) solid var(--luzmo-tab-panel-indicator-width,var(--luzmo-indicator-width))}", D = class extends e {
 	constructor(...e) {
 		super(...e), this.selected = !1, this.value = "";
@@ -114,11 +113,9 @@ t([x({
 	type: String,
 	reflect: !0
 })], D.prototype, "value", void 0);
-//#endregion
-//#region src/components/tabs/tabs-sizes.module.scss?inline
+// src/components/tabs/tabs-sizes.module.scss?inline
 var O = "#list{--tabs-item-height:calc(var(--luzmo-component-height) + var(--luzmo-spacing-5));--tabs-item-horizontal-spacing:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-3));--tabs-item-vertical-spacing:var(--luzmo-spacing-2);--tabs-start-to-edge:var(--luzmo-spacing-4);--tabs-top-to-text:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--tabs-bottom-to-text:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--tabs-icon-size:var(--luzmo-icon-size-s);--tabs-icon-to-text:var(--luzmo-spacing-3);--tabs-top-to-icon:var(--luzmo-spacing-4);--tabs-focus-indicator-gap:var(--luzmo-spacing-3);--tabs-font-size:var(--luzmo-font-size)}:host([size=s]) #list{--tabs-item-height:calc(var(--luzmo-component-height-s) + var(--luzmo-spacing-4));--tabs-item-horizontal-spacing:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-2));--tabs-item-vertical-spacing:var(--luzmo-spacing-2);--tabs-start-to-edge:var(--luzmo-spacing-4);--tabs-top-to-text:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--tabs-bottom-to-text:var(--luzmo-spacing-4);--tabs-icon-size:var(--luzmo-icon-size-xs);--tabs-icon-to-text:var(--luzmo-spacing-3);--tabs-top-to-icon:var(--luzmo-spacing-4);--tabs-focus-indicator-gap:var(--luzmo-spacing-3);--tabs-font-size:var(--luzmo-font-size-s)}:host([size=l]) #list{--tabs-item-height:calc(var(--luzmo-component-height-l) + var(--luzmo-spacing-5));--tabs-item-horizontal-spacing:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-4));--tabs-item-vertical-spacing:var(--luzmo-spacing-2);--tabs-start-to-edge:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--tabs-top-to-text:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-1));--tabs-bottom-to-text:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-1));--tabs-icon-size:var(--luzmo-icon-size-m);--tabs-icon-to-text:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tabs-top-to-icon:var(--luzmo-spacing-5);--tabs-focus-indicator-gap:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tabs-font-size:var(--luzmo-font-size-l)}:host([size=xl]) #list{--tabs-item-height:calc(var(--luzmo-component-height-xl) + var(--luzmo-spacing-5));--tabs-item-horizontal-spacing:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-4));--tabs-item-vertical-spacing:var(--luzmo-spacing-2);--tabs-start-to-edge:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--tabs-top-to-text:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-1));--tabs-bottom-to-text:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-1));--tabs-icon-size:var(--luzmo-icon-size-l);--tabs-icon-to-text:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tabs-top-to-icon:var(--luzmo-spacing-5);--tabs-focus-indicator-gap:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tabs-font-size:var(--luzmo-font-size-xl)}:host([compact]) #list{--luzmo-tabs-item-height:var(--luzmo-tabs-item-height-compact,var(--luzmo-component-height));--luzmo-tabs-top-to-text:var(--luzmo-tabs-top-to-text-compact,calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1)));--luzmo-tabs-bottom-to-text:var(--luzmo-tabs-bottom-to-text-compact,calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1)));--luzmo-tabs-top-to-icon:var(--luzmo-tabs-top-to-icon-compact,var(--luzmo-spacing-2))}:host([size=s][compact]) #list{--luzmo-tabs-item-height:var(--luzmo-tabs-item-height-compact,var(--luzmo-component-height-s));--luzmo-tabs-top-to-text:var(--luzmo-tabs-top-to-text-compact,var(--luzmo-spacing-2));--luzmo-tabs-bottom-to-text:var(--luzmo-tabs-bottom-to-text-compact,var(--luzmo-spacing-2));--luzmo-tabs-top-to-icon:var(--luzmo-tabs-top-to-icon-compact,var(--luzmo-spacing-1))}:host([size=l][compact]) #list{--luzmo-tabs-item-height:var(--luzmo-tabs-item-height-compact,var(--luzmo-component-height-l));--luzmo-tabs-top-to-text:var(--luzmo-tabs-top-to-text-compact,calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1)));--luzmo-tabs-bottom-to-text:var(--luzmo-tabs-bottom-to-text-compact,calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1)));--luzmo-tabs-top-to-icon:var(--luzmo-tabs-top-to-icon-compact,calc(var(--luzmo-spacing-3)))}:host([size=xl][compact]) #list{--luzmo-tabs-item-height:var(--luzmo-tabs-item-height-compact,var(--luzmo-component-height-xl));--luzmo-tabs-top-to-text:var(--luzmo-tabs-top-to-text-compact,var(--luzmo-spacing-4));--luzmo-tabs-bottom-to-text:var(--luzmo-tabs-bottom-to-text-compact,var(--luzmo-spacing-4));--luzmo-tabs-top-to-icon:var(--luzmo-tabs-top-to-icon-compact,calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1)))}", k = "#list{--tabs-color:var(--luzmo-font-color);--tabs-color-selected:var(--luzmo-font-color-down);--tabs-color-hover:var(--luzmo-font-color-hover);--tabs-color-key-focus:var(--luzmo-font-color-focus);--tabs-color-disabled:var(--luzmo-disabled-color);--tabs-font-family:var(--luzmo-font-family);--tabs-font-style:var(--luzmo-font-style);--tabs-font-size:var(--luzmo-font-size);--tabs-line-height:var(--luzmo-line-height);--tabs-focus-indicator-width:var(--luzmo-indicator-width);--tabs-focus-indicator-border-radius:var(--luzmo-border-radius);--tabs-focus-indicator-color:var(--luzmo-indicator-color);--tabs-selection-indicator-color:var(--luzmo-font-color-down);--tabs-list-background-direction:top;--tabs-divider-size:2px;--tabs-divider-border-radius:1px;--tabs-animation-duration:var(--luzmo-animation-duration);--tabs-animation-ease:ease-in-out}:host([emphasized]) #list{--luzmo-tabs-color-selected:var(--luzmo-tabs-color-selected-emphasized,var(--luzmo-primary));--luzmo-tabs-color-hover:var(--luzmo-tabs-color-hover-emphasized,var(--luzmo-primary-hover));--luzmo-tabs-color-key-focus:var(--luzmo-tabs-color-key-focus-emphasized,var(--luzmo-primary-focus));--luzmo-tabs-selection-indicator-color:var(--luzmo-tabs-selection-indicator-color-emphasized,var(--luzmo-primary-down))}:host([direction^=vertical]) #list{--luzmo-tabs-list-background-direction:var(--luzmo-tabs-list-background-direction-vertical,right)}:host([direction^=vertical-right]) #list{--luzmo-tabs-list-background-direction:var(--luzmo-tabs-list-background-direction-vertical-right,left)}:is(:host([direction^=vertical]) #list:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)),:host([dir=rtl][direction^=vertical]) #list){--luzmo-tabs-list-background-direction:var(--luzmo-tabs-list-background-direction-vertical,left)}:is(:host([direction^=vertical-right]) #list:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)),:host([dir=rtl][direction^=vertical-right]) #list){--luzmo-tabs-list-background-direction:var(--luzmo-tabs-list-background-direction-vertical,right)}#list{z-index:0;vertical-align:top;background:linear-gradient(to var(--luzmo-tabs-list-background-direction,var(--tabs-list-background-direction)), var(--highcontrast-tabs-divider-background-color,var(--luzmo-tabs-divider-background-color,var(--tabs-divider-background-color))) 0 var(--luzmo-tabs-divider-size,var(--tabs-divider-size)), transparent var(--luzmo-tabs-divider-size,var(--tabs-divider-size)));margin:0;padding-block:0;display:flex;position:relative}::slotted([selected]:not([slot])){color:var(--highcontrast-tabs-color-selected,var(--luzmo-tabs-color-selected,var(--tabs-color-selected)))}::slotted([disabled]:not([slot])){cursor:default;color:var(--highcontrast-tabs-color-disabled,var(--luzmo-tabs-color-disabled,var(--tabs-color-disabled)))}#selection-indicator{background-color:var(--highcontrast-tabs-selection-indicator-color,var(--luzmo-tabs-selection-indicator-color,var(--tabs-selection-indicator-color)));z-index:0;transition:transform var(--luzmo-tabs-animation-duration,var(--tabs-animation-duration)) var(--luzmo-tabs-animation-ease,var(--tabs-animation-ease));transform-origin:0 0;border-radius:var(--luzmo-tabs-divider-border-radius,var(--tabs-divider-border-radius));position:absolute;inset-inline-start:0}:host([direction^=horizontal]) #list{align-items:center}:host([direction^=horizontal]) #list ::slotted(:not([slot])){vertical-align:top}:host([direction^=horizontal]) ::slotted(:not(:first-child)){margin-inline-start:var(--luzmo-tabs-item-horizontal-spacing,var(--tabs-item-horizontal-spacing))}:host([direction^=horizontal]) #list #selection-indicator{block-size:var(--luzmo-tabs-divider-size,var(--tabs-divider-size));position:absolute;inset-block-end:0}:host([direction^=horizontal][compact]) #list{box-sizing:initial;align-items:end}:host([quiet]) #list{background:0 0;border-color:#0000;display:inline-flex}:host([quiet]) #selection-indicator{padding-inline-start:var(--luzmo-tabs-start-to-item-quiet)}:host([direction^=vertical]) #list,:host([direction^=vertical-right]) #list{flex-direction:column;padding:0;display:inline-flex}:host([direction^=vertical-right][quiet]) #list,:host([direction^=vertical][quiet]) #list{border-color:#0000}:host([direction^=vertical]) #list ::slotted(:not([slot])),:host([direction^=vertical-right]) #list ::slotted(:not([slot])){block-size:var(--luzmo-tabs-item-height,var(--tabs-item-height));line-height:var(--luzmo-tabs-item-height,var(--tabs-item-height));margin-block-end:var(--luzmo-tabs-item-vertical-spacing,var(--tabs-item-vertical-spacing));margin-inline-start:var(--luzmo-tabs-start-to-edge,var(--tabs-start-to-edge));margin-inline-end:var(--luzmo-tabs-start-to-edge,var(--tabs-start-to-edge));padding-block:0}:host([direction^=vertical]) #list ::slotted(:not([slot])):before,:host([direction^=vertical-right]) #list ::slotted(:not([slot])):before{inset-inline-start:calc(var(--luzmo-tabs-focus-indicator-gap,var(--tabs-focus-indicator-gap)) * -1)}:host([direction^=vertical]) #list #selection-indicator,:host([direction^=vertical-right]) #list #selection-indicator{inline-size:var(--luzmo-tabs-divider-size,var(--tabs-divider-size));position:absolute;inset-block-start:0;inset-inline-start:0}:host([direction^=vertical-right]) #list #selection-indicator{inset-inline:auto 0}@media (forced-colors:active){#list{--highcontrast-tabs-divider-background-color:var(--luzmo-border-color);--highcontrast-tabs-selection-indicator-color:Highlight;--highcontrast-tabs-focus-indicator-color:CanvasText;--highcontrast-tabs-focus-indicator-background-color:Highlight;--highcontrast-tabs-color:ButtonText;--highcontrast-tabs-color-hover:ButtonText;--highcontrast-tabs-color-selected:HighlightText;--highcontrast-tabs-color-key-focus:ButtonText;--highcontrast-tabs-color-disabled:GrayText;forced-color-adjust:none}#list ::slotted([selected]:not([slot])):before{background-color:var(--highcontrast-tabs-focus-indicator-background-color)}:host([direction^=vertical][compact]) #list #list ::slotted(:not([slot])):before{block-size:100%;inset-block-start:0}:host([quiet]) #list{background:linear-gradient(to var(--luzmo-tabs-list-background-direction,var(--tabs-list-background-direction)), var(--highcontrast-tabs-divider-background-color,var(--luzmo-tabs-divider-background-color,var(--tabs-divider-background-color))) 0 var(--luzmo-tabs-divider-size,var(--tabs-divider-size)), transparent var(--luzmo-tabs-divider-size,var(--tabs-divider-size)))}}#list{--tabs-font-weight:var(--luzmo-font-weight);--tabs-divider-background-color:var(--luzmo-border-color)}:host{grid-template-columns:100%;display:grid;position:relative}:host(:not([direction^=vertical])){grid-template-rows:auto 1fr}:host([direction^=vertical]){grid-template-columns:auto 1fr}:host([dir=rtl]) #selection-indicator{left:0;right:auto}:host([direction=vertical-right]) #list #selection-indicator{inset-inline:auto 0}#list{justify-content:var(--luzmo-tabs-list-justify-content)}:host([disabled]) #list{pointer-events:none}:host([disabled]) #list #selection-indicator{background-color:var(--luzmo-tabs-color-disabled,var(--tabs-color-disabled))}:host([disabled]) ::slotted(sp-tab){color:var(--luzmo-tabs-color-disabled,var(--tabs-color-disabled))}:host([direction=vertical-right]) #list #selection-indicator,:host([direction=vertical]) #list #selection-indicator{inset-block-start:0}#selection-indicator.first-position{transition:none}:host([dir][direction=horizontal]) #list.scroll{scrollbar-width:none;overflow:auto hidden}:host([dir][direction=horizontal]) #list.scroll::-webkit-scrollbar{display:none}";
-//#endregion
-//#region src/components/tabs/tabs.ts
+// src/components/tabs/tabs.ts
 function A(e, t, n, r) {
 	let i = n[e + (t === "rtl" ? -1 : 1)], a = r.scrollLeft + r.offsetWidth;
 	return i ? i.offsetLeft - r.offsetWidth : a;
@@ -171,7 +168,7 @@ var M = class extends n(i, { noDefaultSize: !0 }) {
 		}, this.onClick = (e) => {
 			if (this.disabled) return;
 			let t = e.composedPath().find((e) => e.parentElement === this);
-			!t || t.disabled || (this.shouldAnimate = !0, this.selectTarget(t));
+			t && !t.disabled && (this.shouldAnimate = !0, this.selectTarget(t));
 		}, this.onKeyDown = (e) => {
 			if (e.code === "Enter" || e.code === "Space") {
 				e.preventDefault();
@@ -325,8 +322,7 @@ t([p({ type: Boolean })], M.prototype, "auto", void 0), t([p({
 	type: Boolean,
 	reflect: !0
 })], M.prototype, "quiet", void 0), t([p({ attribute: !1 })], M.prototype, "selectionIndicatorStyle", void 0), t([p({ attribute: !1 })], M.prototype, "shouldAnimate", void 0), t([m("slot")], M.prototype, "slotEl", void 0), t([m("#list")], M.prototype, "tabList", void 0), t([p({ reflect: !0 })], M.prototype, "selected", void 0);
-//#endregion
-//#region src/components/tabs/tabs-overflow.module.scss?inline
+// src/components/tabs/tabs-overflow.module.scss?inline
 var N = ":host{--tabs-divider-size:2px;--tab-item-height-m:calc(var(--luzmo-component-height) + var(--luzmo-spacing-5));--tabs-overflow-button-height:calc(var(--tab-item-height-m) - var(--luzmo-tabs-divider-size,var(--tabs-divider-size)));--tabs-overflow-button-size:var(--tab-item-height-m);--tabs-overflow-icon-color:var(--luzmo-font-color-focus);--tabs-overflow-shadow-color:var(--luzmo-background-color);--tabs-overflow-shadow-width:50px;--luzmo-action-button-icon-size:var(--luzmo-font-size);--tabs-overflow-next-button-right:calc(-1 * var(--luzmo-spacing-4));--tabs-overflow-previous-button-left:calc(-1 * var(--luzmo-spacing-4));width:100%;inset:0}:host([size=s]){--tab-item-height-s:calc(var(--luzmo-component-height-s) + var(--luzmo-spacing-4));--tabs-overflow-button-height:calc(var(--tab-item-height-s) - var(--luzmo-tabs-divider-size,var(--tabs-divider-size)));--tabs-overflow-button-size:var(--tab-item-height-s);--luzmo-action-button-icon-size:var(--luzmo-font-size-s);--tabs-overflow-next-button-right:calc(-1 * var(--luzmo-spacing-3));--tabs-overflow-previous-button-left:calc(-1 * var(--luzmo-spacing-3))}:host([size=l]){--tab-item-height-l:calc(var(--luzmo-component-height-l) + var(--luzmo-spacing-5));--tabs-overflow-button-height:calc(var(--tab-item-height-l) - var(--luzmo-tabs-divider-size,var(--tabs-divider-size)));--tabs-overflow-button-size:var(--tab-item-height-l);--luzmo-action-button-icon-size:var(--luzmo-font-size-l);--tabs-overflow-next-button-right:calc(-1 * calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1)));--tabs-overflow-previous-button-left:calc(-1 * calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1)))}:host([size=xl]){--tab-item-height-xl:calc(var(--luzmo-component-height-xl) + var(--luzmo-spacing-5));--tabs-overflow-button-height:calc(var(--tab-item-height-xl) - var(--luzmo-tabs-divider-size,var(--tabs-divider-size)));--tabs-overflow-button-size:var(--tab-item-height-xl);--luzmo-action-button-icon-size:var(--luzmo-font-size-xl);--tabs-overflow-next-button-right:calc(-1 * calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-2)));--tabs-overflow-previous-button-left:calc(-1 * calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-2)))}:host([compact]){--tabs-overflow-button-height:calc(var(--tab-item-compact-height-m) - var(--luzmo-tabs-divider-size,var(--tabs-divider-size)));--luzmo-action-button-icon-size:var(--luzmo-font-size-s)}luzmo-action-button{width:var(--luzmo-tabs-overflow-button-size,var(--tabs-overflow-button-size));height:var(--luzmo-tabs-overflow-button-height,var(--tabs-overflow-button-height));z-index:2;text-align:center;box-shadow:none;color:var(--luzmo-tabs-overflow-icon-color,var(--tabs-overflow-icon-color));background:0 0;border:none;position:absolute}luzmo-action-button.left-scroll{visibility:hidden;left:var(--luzmo-tabs-overflow-previous-button-left,var(--tabs-overflow-previous-button-left))}luzmo-action-button.right-scroll{visibility:hidden;right:var(--luzmo-tabs-overflow-next-button-right,var(--tabs-overflow-next-button-right))}luzmo-action-button.left-scroll.show,luzmo-action-button.right-scroll.show{visibility:visible}.tabs-overflow-container{position:relative}.tabs-overflow-container:before,.tabs-overflow-container:after{content:\"\";visibility:hidden;z-index:1;height:var(--luzmo-tabs-overflow-button-height,var(--tabs-overflow-button-height));width:var(--luzmo-tabs-overflow-shadow-width,var(--tabs-overflow-shadow-width));pointer-events:none;position:absolute;inset-block-start:0}.tabs-overflow-container:before{background:transparent linear-gradient(270deg, transparent, var(--luzmo-tabs-overflow-shadow-color,var(--tabs-overflow-shadow-color))) 0 0 no-repeat padding-box;left:0}.tabs-overflow-container:after{background:transparent linear-gradient(90deg, transparent, var(--luzmo-tabs-overflow-shadow-color,var(--tabs-overflow-shadow-color))) 0 0 no-repeat padding-box;right:0}.tabs-overflow-container.left-shadow:before,.tabs-overflow-container.right-shadow:after{visibility:visible}", P = class extends n(e) {
 	static get styles() {
 		return [f(N), f(O)];
@@ -431,5 +427,4 @@ t([p({
 	selector: "luzmo-tabs",
 	flatten: !0
 })], P.prototype, "tabs", void 0), t([m(".tabs-overflow-container")], P.prototype, "overflowContainer", void 0), customElements.get("luzmo-tab") || customElements.define("luzmo-tab", T), customElements.get("luzmo-tabs") || customElements.define("luzmo-tabs", M), customElements.get("luzmo-tab-panel") || customElements.define("luzmo-tab-panel", D), customElements.get("luzmo-tabs-overflow") || customElements.define("luzmo-tabs-overflow", P);
-//#endregion
 export { T as i, M as n, D as r, P as t };

package/components/tags/index.cjs

@@ -15,4 +15,4 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require("../tokens.cjs");const e=require("../tags-fLCGajv_.cjs");exports.LuzmoTag=e.n,exports.LuzmoTags=e.t;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require("../tokens.cjs");const e=require("../tags-CHDNXpxh.cjs");exports.LuzmoTag=e.n,exports.LuzmoTags=e.t;

package/components/tags/index.js

@@ -16,5 +16,4 @@
  * SOFTWARE.
  * */
 import "../tokens.js";
-import { n as e, t } from "../tags-BIpFgOYy.js";
-export { e as LuzmoTag, t as LuzmoTags };
+export { n as LuzmoTag, t as LuzmoTags } from "../tags-Be4yrNPw.js";

package/components/tags-Be4yrNPw.js

@@ -0,0 +1,206 @@
+/*! * Lucero - The design system for Luzmo.
+ * 
+ * Copyright © 2026 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 "./tokens.js";
+import { n as e, t } from "./decorate-CpKsOs9z.js";
+import { n } from "./sized-mixin-BmxIAuoH.js";
+import { t as r } from "./focus-visible-D6TRtUd7.js";
+import { t as i } from "./roving-tabindex-BKMkfzY0.js";
+import { n as a } from "./language-resolution-7rc0khIK.js";
+import "./tooltip-g2jd5Wsv.js";
+import "./button-CpaltgRZ.js";
+import { html as o, nothing as s, unsafeCSS as c } from "lit";
+import { property as l, queryAssignedNodes as u, state as d } from "lit/decorators.js";
+// src/components/tags/tag.module.scss?inline
+var f = ":host{font-family:var(--luzmo-font-family);background-color:var(--highcontrast-tag-background-color,var(--luzmo-tag-background-color,var(--tag-background-color)));color:var(--highcontrast-tag-content-color,var(--luzmo-tag-content-color,var(--tag-content-color)));border-radius:var(--luzmo-tag-border-radius,var(--tag-border-radius));block-size:var(--luzmo-tag-height,var(--tag-height));box-sizing:border-box;vertical-align:bottom;max-inline-size:var(--luzmo-tag-max-inline-size,var(--tag-max-inline-size));-webkit-user-select:none;user-select:none;transition:border-color var(--luzmo-tag-animation-duration,var(--tag-animation-duration)) ease-in-out, color var(--luzmo-tag-animation-duration,var(--tag-animation-duration)) ease-in-out, box-shadow var(--luzmo-tag-animation-duration,var(--tag-animation-duration)) ease-in-out, background-color var(--luzmo-tag-animation-duration,var(--tag-animation-duration)) ease-in-out;outline:none;justify-content:center;align-items:center;padding-inline-start:calc(var(--luzmo-tag-spacing-inline-start,var(--tag-spacing-inline-start)) - var(--luzmo-tag-border-width,var(--tag-border-width)));padding-inline-end:0;display:inline-flex;position:relative;border-color:var(--highcontrast-tag-border-color,var(--luzmo-tag-border-color,var(--tag-border-color)))!important;border-width:var(--luzmo-tag-border-width,var(--tag-border-width))!important;border-style:solid!important}::slotted([slot=icon]){block-size:var(--luzmo-tag-icon-size,var(--tag-icon-size));inline-size:var(--luzmo-tag-icon-size,var(--tag-icon-size));flex-shrink:0;margin-inline-end:var(--luzmo-tag-icon-spacing-inline-end,var(--tag-icon-spacing-inline-end))}::slotted([slot=avatar]){margin-inline-end:var(--luzmo-tag-avatar-spacing-inline-end,var(--tag-avatar-spacing-inline-end))}.clear-button{--luzmo-clear-button-width:fit-content;--clearbutton-fill-size:fit-content;--clearbutton-fill-background-color:transparent;box-sizing:border-box;color:currentColor;margin-inline-start:calc(var(--luzmo-tag-clear-button-spacing-inline-start,var(--tag-clear-button-spacing-inline-start)) + var(--luzmo-tag-label-spacing-inline-end,var(--tag-label-spacing-inline-end)) * -1);margin-inline-end:calc(var(--luzmo-tag-clear-button-spacing-inline-end,var(--tag-clear-button-spacing-inline-end)) - var(--luzmo-tag-border-width,var(--tag-border-width)))}.clear-button .luzmo-ClearButton-fill{background-color:var(--luzmo-clearbutton-fill-background-color,var(--clearbutton-fill-background-color));inline-size:var(--luzmo-clearbutton-fill-size,var(--clearbutton-fill-size));block-size:var(--luzmo-clearbutton-fill-size,var(--clearbutton-fill-size))}.label{box-sizing:border-box;block-size:100%;min-inline-size:0;line-height:var(--luzmo-tag-label-line-height,var(--tag-label-line-height));font-weight:var(--luzmo-tag-label-font-weight,var(--tag-label-font-weight));font-size:var(--luzmo-tag-font-size,var(--tag-font-size));cursor:default;white-space:nowrap;text-overflow:ellipsis;flex:auto;align-items:center;margin-inline-end:calc(var(--luzmo-tag-label-spacing-inline-end,var(--tag-label-spacing-inline-end)) - var(--luzmo-tag-border-width,var(--tag-border-width)));display:flex;overflow:hidden}.label-text{white-space:nowrap;text-overflow:ellipsis;flex:auto;min-inline-size:0;display:block;overflow:hidden}.label-text slot{white-space:nowrap;text-overflow:ellipsis;display:block;overflow:hidden}:host([data-luzmo-language-script=Latn]) .label-text{padding-block:var(--tag-label-glyph-overhang);margin-block:calc(var(--tag-label-glyph-overhang) * -1)}:host([data-luzmo-language-script=Latn]) .label-text slot{text-box:trim-both cap alphabetic;padding-block:var(--tag-label-glyph-overhang);margin-block:calc(var(--tag-label-glyph-overhang) * -1)}:host([data-luzmo-language-script=Latn]) .label-text slot::slotted(*){padding-block:var(--tag-label-glyph-overhang);margin-block:calc(var(--tag-label-glyph-overhang) * -1)}:host(:is(:active,[active])){background-color:var(--highcontrast-tag-background-color-active,var(--luzmo-tag-background-color-active,var(--tag-background-color-active)));color:var(--highcontrast-tag-content-color-active,var(--luzmo-tag-content-color-active,var(--tag-content-color-active)));border-color:var(--highcontrast-tag-border-color-active,var(--luzmo-tag-border-color-active,var(--tag-border-color-active)))!important}:host([focused]),:host(:focus-visible){background-color:var(--highcontrast-tag-background-color-focus,var(--luzmo-tag-background-color-focus,var(--tag-background-color-focus)));color:var(--highcontrast-tag-content-color-focus,var(--luzmo-tag-content-color-focus,var(--tag-content-color-focus)));border-color:var(--highcontrast-tag-border-color-focus,var(--luzmo-tag-border-color-focus,var(--tag-border-color-focus)))!important}:host([focused]):after,:host(:focus-visible):after{content:\"\";border-radius:calc(var(--luzmo-tag-border-radius,var(--tag-border-radius)) + var(--luzmo-tag-focus-ring-gap,var(--tag-focus-ring-gap)) + var(--luzmo-tag-border-width,var(--tag-border-width)));pointer-events:none;display:inline-block;position:absolute;inset-block-start:calc(var(--luzmo-tag-focus-ring-gap,var(--tag-focus-ring-gap)) * -1 - var(--luzmo-tag-border-width,var(--tag-border-width)) - var(--luzmo-tag-focus-ring-thickness,var(--tag-focus-ring-thickness)));inset-block-end:calc(var(--luzmo-tag-focus-ring-gap,var(--tag-focus-ring-gap)) * -1 - var(--luzmo-tag-border-width,var(--tag-border-width)) - var(--luzmo-tag-focus-ring-thickness,var(--tag-focus-ring-thickness)));inset-inline-start:calc(var(--luzmo-tag-focus-ring-gap,var(--tag-focus-ring-gap)) * -1 - var(--luzmo-tag-border-width,var(--tag-border-width)) - var(--luzmo-tag-focus-ring-thickness,var(--tag-focus-ring-thickness)));inset-inline-end:calc(var(--luzmo-tag-focus-ring-gap,var(--tag-focus-ring-gap)) * -1 - var(--luzmo-tag-border-width,var(--tag-border-width)) - var(--luzmo-tag-focus-ring-thickness,var(--tag-focus-ring-thickness)));border-color:var(--highcontrast-tag-focus-ring-color,var(--luzmo-tag-focus-ring-color,var(--tag-focus-ring-color)))!important;border-width:var(--luzmo-tag-focus-ring-thickness,var(--tag-focus-ring-thickness))!important;border-style:solid!important}:host([selected]){background-color:var(--highcontrast-tag-background-color-selected,var(--luzmo-tag-background-color-selected,var(--tag-background-color-selected)));color:var(--highcontrast-tag-content-color-selected,var(--luzmo-tag-content-color-selected,var(--tag-content-color-selected)));border-color:var(--highcontrast-tag-border-color-selected,var(--luzmo-tag-border-color-selected,var(--tag-border-color-selected)))!important}:host([selected]:is(:active,[active])){background-color:var(--highcontrast-tag-background-color-selected-active,var(--luzmo-tag-background-color-selected-active,var(--tag-background-color-selected-active)));border-color:var(--highcontrast-tag-border-color-selected-active,var(--luzmo-tag-border-color-selected-active,var(--tag-border-color-selected-active)))!important}:host([selected][focused]),:host([selected]:focus-visible){background-color:var(--highcontrast-tag-background-color-selected-focus,var(--luzmo-tag-background-color-selected-focus,var(--tag-background-color-selected-focus)));border-color:var(--highcontrast-tag-border-color-selected-focus,var(--luzmo-tag-border-color-selected-focus,var(--tag-border-color-selected-focus)))!important}:host([invalid]){color:var(--highcontrast-tag-content-color-invalid,var(--luzmo-tag-content-color-invalid,var(--tag-content-color-invalid)));border-color:var(--highcontrast-tag-border-color-invalid,var(--luzmo-tag-border-color-invalid,var(--tag-border-color-invalid)))!important}:host([invalid]:is(:active,[active])){color:var(--highcontrast-tag-content-color-invalid-active,var(--luzmo-tag-content-color-invalid-active,var(--tag-content-color-invalid-active)));border-color:var(--highcontrast-tag-border-color-invalid-active,var(--luzmo-tag-border-color-invalid-active,var(--tag-border-color-invalid-active)))!important}:host([invalid][focused]),:host([invalid]:focus-visible){color:var(--highcontrast-tag-content-color-invalid-focus,var(--luzmo-tag-content-color-invalid-focus,var(--tag-content-color-invalid-focus)));border-color:var(--highcontrast-tag-border-color-invalid-focus,var(--luzmo-tag-border-color-invalid-focus,var(--tag-border-color-invalid-focus)))!important}:host([invalid][selected]){background-color:var(--highcontrast-tag-background-color-invalid-selected,var(--luzmo-tag-background-color-invalid-selected,var(--tag-background-color-invalid-selected)));color:var(--highcontrast-tag-content-color-invalid-selected,var(--luzmo-tag-content-color-invalid-selected,var(--tag-content-color-invalid-selected)));border-color:var(--highcontrast-tag-border-color-invalid-selected,var(--luzmo-tag-border-color-invalid-selected,var(--tag-border-color-invalid-selected)))!important}:host([invalid][selected]:is(:active,[active])){background-color:var(--highcontrast-tag-background-color-invalid-selected-active,var(--luzmo-tag-background-color-invalid-selected-active,var(--tag-background-color-invalid-selected-active)));border-color:var(--highcontrast-tag-border-color-invalid-selected-active,var(--luzmo-tag-border-color-invalid-selected-active,var(--tag-border-color-invalid-selected-active)))!important}:host([invalid][selected][focused]),:host([invalid][selected]:focus-visible){background-color:var(--highcontrast-tag-background-color-invalid-selected-focus,var(--luzmo-tag-background-color-invalid-selected-focus,var(--tag-background-color-invalid-selected-focus)));border-color:var(--highcontrast-tag-border-color-invalid-selected-focus,var(--luzmo-tag-border-color-invalid-selected-focus,var(--tag-border-color-invalid-selected-focus)))!important}:host([emphasized]){background-color:var(--highcontrast-tag-background-color-emphasized,var(--luzmo-tag-background-color-emphasized,var(--tag-background-color-emphasized)));color:var(--highcontrast-tag-content-color-emphasized,var(--luzmo-tag-content-color-emphasized,var(--tag-content-color-emphasized)));--luzmo-clear-button-background-color-hover:var(--luzmo-tag-background-color-emphasized,var(--tag-background-color-emphasized));--luzmo-clear-button-background-color-focus:var(--luzmo-tag-background-color-emphasized,var(--tag-background-color-emphasized));--luzmo-clear-button-background-color-down:var(--luzmo-tag-background-color-emphasized,var(--tag-background-color-emphasized));border-color:var(--highcontrast-tag-border-color-emphasized,var(--luzmo-tag-border-color-emphasized,var(--tag-border-color-emphasized)))!important}@media (hover:hover){:host(:hover){background-color:var(--highcontrast-tag-background-color-hover,var(--luzmo-tag-background-color-hover,var(--tag-background-color-hover)));color:var(--highcontrast-tag-content-color-hover,var(--luzmo-tag-content-color-hover,var(--tag-content-color-hover)));border-color:var(--highcontrast-tag-border-color-hover,var(--luzmo-tag-border-color-hover,var(--tag-border-color-hover)))!important}:host([selected]:hover){background-color:var(--highcontrast-tag-background-color-selected-hover,var(--luzmo-tag-background-color-selected-hover,var(--tag-background-color-selected-hover)));color:var(--highcontrast-tag-content-color-selected,var(--luzmo-tag-content-color-selected,var(--tag-content-color-selected)));border-color:var(--highcontrast-tag-border-color-selected-hover,var(--luzmo-tag-border-color-selected-hover,var(--tag-border-color-selected-hover)))!important}:host([invalid]:hover){color:var(--highcontrast-tag-content-color-invalid-hover,var(--luzmo-tag-content-color-invalid-hover,var(--tag-content-color-invalid-hover)));border-color:var(--highcontrast-tag-border-color-invalid-hover,var(--luzmo-tag-border-color-invalid-hover,var(--tag-border-color-invalid-hover)))!important}:host([invalid][selected]:hover){background-color:var(--highcontrast-tag-background-color-invalid-selected-hover,var(--luzmo-tag-background-color-invalid-selected-hover,var(--tag-background-color-invalid-selected-hover)));color:var(--highcontrast-tag-content-color-invalid-selected,var(--luzmo-tag-content-color-invalid-selected,var(--tag-content-color-invalid-selected)));border-color:var(--highcontrast-tag-border-color-invalid-selected-hover,var(--luzmo-tag-border-color-invalid-selected-hover,var(--tag-border-color-invalid-selected-hover)))!important}:host([emphasized]:hover){background-color:var(--highcontrast-tag-background-color-emphasized-hover,var(--luzmo-tag-background-color-emphasized-hover,var(--tag-background-color-emphasized-hover)));color:var(--highcontrast-tag-content-color-emphasized,var(--luzmo-tag-content-color-emphasized,var(--tag-content-color-emphasized)));border-color:var(--highcontrast-tag-border-color-emphasized-hover,var(--luzmo-tag-border-color-emphasized-hover,var(--tag-border-color-emphasized-hover)))!important}}:host([emphasized]:is(:active,[active])){background-color:var(--highcontrast-tag-background-color-emphasized-active,var(--luzmo-tag-background-color-emphasized-active,var(--tag-background-color-emphasized-active)));border-color:var(--highcontrast-tag-border-color-emphasized-active,var(--luzmo-tag-border-color-emphasized-active,var(--tag-border-color-emphasized-active)))!important}:host([emphasized][focused]),:host([emphasized]:focus-visible){background-color:var(--highcontrast-tag-background-color-emphasized-focus,var(--luzmo-tag-background-color-emphasized-focus,var(--tag-background-color-emphasized-focus)));border-color:var(--highcontrast-tag-border-color-emphasized-focus,var(--luzmo-tag-border-color-emphasized-focus,var(--tag-border-color-emphasized-focus)))!important}:host([disabled]){background-color:var(--highcontrast-tag-background-color-disabled,var(--luzmo-tag-background-color-disabled,var(--tag-background-color-disabled)));color:var(--highcontrast-tag-content-color-disabled,var(--luzmo-tag-content-color-disabled,var(--tag-content-color-disabled)));pointer-events:none;border-color:var(--highcontrast-tag-border-color-disabled,var(--luzmo-tag-border-color-disabled,var(--tag-border-color-disabled)))!important}:host([disabled]) ::slotted([slot=avatar]){opacity:var(--luzmo-avatar-opacity-disabled,var(--avatar-opacity-disabled))}@media (forced-colors:active){:host{--highcontrast-tag-border-color:ButtonText;--highcontrast-tag-border-color-hover:ButtonText;--highcontrast-tag-border-color-active:ButtonText;--highcontrast-tag-border-color-focus:Highlight;--highcontrast-tag-background-color:ButtonFace;--highcontrast-tag-background-color-hover:ButtonFace;--highcontrast-tag-background-color-active:ButtonFace;--highcontrast-tag-background-color-focus:ButtonFace;--highcontrast-tag-content-color:ButtonText;--highcontrast-tag-content-color-hover:ButtonText;--highcontrast-tag-content-color-active:ButtonText;--highcontrast-tag-content-color-focus:ButtonText;--highcontrast-tag-focus-ring-color:Highlight;forced-color-adjust:none}:host([selected]){--highcontrast-tag-border-color-selected:Highlight;--highcontrast-tag-border-color-selected-hover:Highlight;--highcontrast-tag-border-color-selected-active:Highlight;--highcontrast-tag-border-color-selected-focus:Highlight;--highcontrast-tag-background-color-selected:Highlight;--highcontrast-tag-background-color-selected-hover:Highlight;--highcontrast-tag-background-color-selected-active:Highlight;--highcontrast-tag-background-color-selected-focus:Highlight;--highcontrast-tag-content-color-selected:HighlightText}:host([disabled]){--highcontrast-tag-border-color-disabled:GrayText;--highcontrast-tag-background-color-disabled:ButtonFace;--highcontrast-tag-content-color-disabled:GrayText}:host([invalid]){--highcontrast-tag-border-color-invalid:Highlight;--highcontrast-tag-border-color-invalid-hover:Highlight;--highcontrast-tag-border-color-invalid-active:Highlight;--highcontrast-tag-border-color-invalid-focus:Highlight;--highcontrast-tag-content-color-invalid:CanvasText;--highcontrast-tag-content-color-invalid-hover:CanvasText;--highcontrast-tag-content-color-invalid-active:CanvasText;--highcontrast-tag-content-color-invalid-focus:CanvasText}:host([invalid][selected]){--highcontrast-tag-border-color-invalid-selected:Highlight;--highcontrast-tag-border-color-invalid-selected-hover:Highlight;--highcontrast-tag-border-color-invalid-selected-focus:Highlight;--highcontrast-tag-border-color-invalid-selected-active:Highlight;--highcontrast-tag-background-color-invalid-selected:Highlight;--highcontrast-tag-background-color-invalid-selected-hover:Highlight;--highcontrast-tag-background-color-invalid-selected-active:Highlight;--highcontrast-tag-background-color-invalid-selected-focus:Highlight;--highcontrast-tag-content-color-invalid-selected:HighlightText}:host([emphasized]){--highcontrast-tag-border-color-emphasized:Highlight;--highcontrast-tag-border-color-emphasized-hover:Highlight;--highcontrast-tag-border-color-emphasized-active:Highlight;--highcontrast-tag-border-color-emphasized-focus:Highlight;--highcontrast-tag-background-color-emphasized:ButtonFace;--highcontrast-tag-background-color-emphasized-hover:ButtonFace;--highcontrast-tag-background-color-emphasized-active:ButtonFace;--highcontrast-tag-background-color-emphasized-focus:ButtonFace;--highcontrast-tag-content-color-emphasized:CanvasText}:host([variant][treatment=fill]){--highcontrast-tag-border-color:Highlight;--highcontrast-tag-border-color-hover:Highlight;--highcontrast-tag-border-color-active:Highlight;--highcontrast-tag-border-color-focus:Highlight;--highcontrast-tag-background-color:Highlight;--highcontrast-tag-background-color-hover:Highlight;--highcontrast-tag-background-color-active:Highlight;--highcontrast-tag-background-color-focus:Highlight;--highcontrast-tag-content-color:HighlightText;--highcontrast-tag-content-color-hover:HighlightText;--highcontrast-tag-content-color-active:HighlightText;--highcontrast-tag-content-color-focus:HighlightText}}:host{--tag-border-color:var(--luzmo-border-color);--tag-border-color-hover:var(--luzmo-border-color-hover);--tag-border-color-active:var(--luzmo-border-color-active);--tag-border-color-focus:var(--luzmo-border-color-focus);--tag-size-small-border-radius:var(--luzmo-border-radius-s);--tag-size-medium-border-radius:var(--luzmo-border-radius);--tag-size-large-border-radius:var(--luzmo-border-radius);--tag-background-color:var(--luzmo-background-color);--tag-background-color-hover:var(--luzmo-background-color-hover);--tag-background-color-active:var(--luzmo-background-color-active);--tag-background-color-focus:var(--luzmo-background-color-focus);--tag-content-color:var(--luzmo-font-color);--tag-content-color-hover:var(--luzmo-font-color-hover);--tag-content-color-active:var(--luzmo-font-color-active);--tag-content-color-focus:var(--luzmo-font-color-focus);--tag-border-color-selected:var(--luzmo-border-color-down);--tag-border-color-selected-hover:var(--luzmo-border-color-down);--tag-border-color-selected-active:var(--luzmo-border-color-down);--tag-border-color-selected-focus:var(--luzmo-border-color-down);--tag-border-color-disabled:var(--luzmo-border-color-disabled);--tag-background-color-disabled:var(--luzmo-background-color-disabled);--avatar-opacity-disabled:.3;--tag-animation-duration:var(--luzmo-animation-duration);--tag-border-width:var(--luzmo-border-width);--tag-focus-ring-thickness:var(--luzmo-indicator-width);--tag-focus-ring-gap:var(--luzmo-indicator-gap);--tag-focus-ring-color:var(--luzmo-indicator-color);--tag-label-line-height:var(--luzmo-line-height);--tag-label-font-weight:var(--luzmo-font-weight);--tag-label-glyph-overhang:.35em;--tag-variant-color-hover:color-mix(in oklch, var(--tag-variant-color), black 8%);--tag-variant-color-down:color-mix(in oklch, var(--tag-variant-color), black 20%);--tag-variant-color-focus:var(--tag-variant-color-hover);--tag-variant-fill-color-hover:var(--tag-variant-color-hover);--tag-variant-fill-color-down:var(--tag-variant-color-down);--tag-variant-fill-color-focus:var(--tag-variant-color-focus);--tag-content-color-selected:var(--luzmo-font-color-down);--tag-background-color-selected:var(--luzmo-background-color-down);--tag-background-color-selected-hover:var(--luzmo-background-color-down);--tag-background-color-selected-active:var(--luzmo-background-color-down);--tag-background-color-selected-focus:var(--luzmo-background-color-down);--tag-border-color-invalid:var(--luzmo-negative-color);--tag-border-color-invalid-hover:var(--luzmo-negative-color-hover);--tag-border-color-invalid-active:var(--luzmo-negative-color-down);--tag-border-color-invalid-focus:var(--luzmo-negative-color-focus);--tag-content-color-invalid:var(--luzmo-negative-color);--tag-content-color-invalid-hover:var(--luzmo-negative-color-hover);--tag-content-color-invalid-active:var(--luzmo-negative-color-down);--tag-content-color-invalid-focus:var(--luzmo-negative-color-focus);--tag-border-color-invalid-selected:var(--luzmo-negative-color-down);--tag-border-color-invalid-selected-hover:var(--luzmo-negative-color-down);--tag-border-color-invalid-selected-focus:var(--luzmo-negative-color-down);--tag-border-color-invalid-selected-active:var(--luzmo-negative-color-down);--tag-background-color-invalid-selected:var(--luzmo-background-color-down);--tag-background-color-invalid-selected-hover:var(--luzmo-background-color-down);--tag-background-color-invalid-selected-active:var(--luzmo-background-color-down);--tag-background-color-invalid-selected-focus:var(--luzmo-background-color-down);--tag-content-color-invalid-selected:var(--luzmo-negative-color-down);--tag-border-color-emphasized:var(--luzmo-primary);--tag-border-color-emphasized-hover:var(--luzmo-primary-hover);--tag-border-color-emphasized-active:var(--luzmo-primary-down);--tag-border-color-emphasized-focus:var(--luzmo-primary-focus);--tag-background-color-emphasized:var(--luzmo-primary);--tag-background-color-emphasized-hover:var(--luzmo-primary-hover);--tag-background-color-emphasized-active:var(--luzmo-primary-down);--tag-background-color-emphasized-focus:var(--luzmo-primary-focus);--tag-content-color-emphasized:white;--tag-content-color-disabled:var(--luzmo-disabled-color);--tag-icon-spacing-inline-end:var(--luzmo-spacing-3);--tag-icon-size:var(--luzmo-font-icon-size-s);--tag-avatar-spacing-inline-end:var(--luzmo-spacing-3);--tag-font-size:var(--luzmo-font-size);--tag-max-inline-size:100%;--tag-subtle-background-opacity:10%;--tag-subtle-interaction-background-opacity:20%;--tag-subtle-content-mix:57%}:host([size=s]){--tag-height:var(--luzmo-component-height-xs);--tag-font-size:var(--luzmo-font-size-s);--tag-icon-size:var(--luzmo-icon-size-s);--tag-icon-spacing-inline-end:var(--luzmo-spacing-2);--tag-clear-button-spacing-inline-start:var(--luzmo-spacing-2);--tag-border-radius:var(--luzmo-border-radius);--tag-spacing-inline-start:var(--luzmo-spacing-3);--tag-label-spacing-inline-end:var(--luzmo-spacing-3);--tag-clear-button-spacing-inline-end:calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1))}:host{--tag-height:var(--luzmo-component-height-s);--tag-font-size:var(--luzmo-font-size);--tag-icon-size:var(--luzmo-icon-size-m);--tag-clear-button-spacing-inline-start:calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1));--tag-border-radius:var(--luzmo-border-radius);--tag-spacing-inline-start:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tag-label-spacing-inline-end:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tag-clear-button-spacing-inline-end:var(--luzmo-spacing-3)}:host([size=l]){--tag-height:var(--luzmo-component-height);--tag-font-size:var(--luzmo-font-size);--tag-icon-size:var(--luzmo-icon-size-l);--tag-icon-spacing-inline-end:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tag-clear-button-spacing-inline-start:var(--luzmo-spacing-3);--tag-border-radius:var(--luzmo-border-radius);--tag-spacing-inline-start:var(--luzmo-spacing-4);--tag-label-spacing-inline-end:var(--luzmo-spacing-4);--tag-clear-button-spacing-inline-end:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1))}:host([size=xl]){--tag-height:var(--luzmo-component-height-l);--tag-font-size:var(--luzmo-font-size-l);--tag-icon-size:var(--luzmo-icon-size-xl);--tag-icon-spacing-inline-end:var(--luzmo-spacing-4);--tag-clear-button-spacing-inline-start:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tag-border-radius:var(--luzmo-border-radius-l);--tag-spacing-inline-start:var(--luzmo-spacing-5);--tag-label-spacing-inline-end:var(--luzmo-spacing-5);--tag-clear-button-spacing-inline-end:var(--luzmo-spacing-4)}:host([variant=accent]){--tag-variant-color:var(--luzmo-primary);--tag-variant-color-hover:var(--luzmo-primary-hover);--tag-variant-color-down:var(--luzmo-primary-down);--tag-variant-color-focus:var(--luzmo-primary-focus);--tag-variant-fill-content-color:var(--luzmo-primary-inverse-color);--tag-variant-subtle-content-color:var(--luzmo-accent-on-subtle-color)}:host([variant=neutral]){--tag-variant-color:var(--luzmo-selected-color-hard);--tag-variant-color-hover:var(--luzmo-selected-color-hard-hover);--tag-variant-color-down:var(--luzmo-selected-color-hard-down);--tag-variant-color-focus:var(--luzmo-selected-color-hard-focus);--tag-variant-fill-content-color:var(--luzmo-background-color);--tag-variant-subtle-content-color:var(--luzmo-neutral-on-subtle-color)}:host([variant=informative]){--tag-variant-color:var(--luzmo-informative-color);--tag-variant-color-hover:var(--luzmo-informative-color-hover);--tag-variant-color-down:var(--luzmo-informative-color-down);--tag-variant-color-focus:var(--luzmo-informative-color-focus);--tag-variant-fill-content-color:var(--luzmo-informative-inverse-color);--tag-variant-subtle-content-color:var(--luzmo-informative-on-subtle-color)}:host([variant=positive]){--tag-variant-color:var(--luzmo-positive-color);--tag-variant-color-hover:var(--luzmo-positive-color-hover);--tag-variant-color-down:var(--luzmo-positive-color-down);--tag-variant-color-focus:var(--luzmo-positive-color-focus);--tag-variant-fill-content-color:var(--luzmo-positive-inverse-color);--tag-variant-subtle-content-color:var(--luzmo-positive-on-subtle-color)}:host([variant=negative]){--tag-variant-color:var(--luzmo-negative-color);--tag-variant-color-hover:var(--luzmo-negative-color-hover);--tag-variant-color-down:var(--luzmo-negative-color-down);--tag-variant-color-focus:var(--luzmo-negative-color-focus);--tag-variant-fill-content-color:var(--luzmo-negative-inverse-color);--tag-variant-subtle-content-color:var(--luzmo-negative-on-subtle-color)}:host([variant=notice]){--tag-variant-color:var(--luzmo-notice-color);--tag-variant-color-hover:var(--luzmo-notice-color-hover);--tag-variant-color-down:var(--luzmo-notice-color-down);--tag-variant-color-focus:var(--luzmo-notice-color-focus);--tag-variant-fill-color-hover:color-mix(in oklch, var(--luzmo-notice-color), white 12%);--tag-variant-fill-color-down:color-mix(in oklch, var(--luzmo-notice-color), white 24%);--tag-variant-fill-color-focus:var(--tag-variant-fill-color-hover);--tag-variant-fill-content-color:var(--luzmo-notice-inverse-color);--tag-variant-subtle-content-color:var(--luzmo-notice-on-subtle-color)}:host([variant=seafoam]){--tag-variant-color:var(--luzmo-seafoam-color);--tag-variant-fill-content-color:white}:host([variant=indigo]){--tag-variant-color:var(--luzmo-indigo-color);--tag-variant-fill-content-color:white}:host([variant=purple]){--tag-variant-color:var(--luzmo-purple-color);--tag-variant-fill-content-color:white}:host([variant=fuchsia]){--tag-variant-color:var(--luzmo-fuchsia-color);--tag-variant-fill-content-color:white}:host([variant=magenta]){--tag-variant-color:var(--luzmo-magenta-color);--tag-variant-fill-content-color:white}:host([variant=yellow]){--tag-variant-color:var(--luzmo-yellow-color);--tag-variant-fill-content-color:black}:host([variant=gray]){--tag-variant-color:var(--luzmo-gray-color);--tag-variant-fill-content-color:white}:host([variant=red]){--tag-variant-color:var(--luzmo-red-color);--tag-variant-fill-content-color:white}:host([variant=orange]){--tag-variant-color:var(--luzmo-orange-color);--tag-variant-fill-content-color:black}:host([variant=chartreuse]){--tag-variant-color:var(--luzmo-chartreuse-color);--tag-variant-fill-content-color:white}:host([variant=celery]){--tag-variant-color:var(--luzmo-celery-color);--tag-variant-fill-content-color:black}:host([variant=green]){--tag-variant-color:var(--luzmo-green-color);--tag-variant-fill-content-color:white}:host([variant=cyan]){--tag-variant-color:var(--luzmo-cyan-color);--tag-variant-fill-content-color:white}:host([variant=blue]){--tag-variant-color:var(--luzmo-blue-color);--tag-variant-fill-content-color:white}:host([variant]:not([treatment=fill])){--tag-border-color:var(--tag-variant-color);--tag-border-color-hover:var(--tag-variant-color-hover);--tag-border-color-active:var(--tag-variant-color-down);--tag-border-color-focus:var(--tag-variant-color-focus);--tag-content-color:var(--tag-variant-color);--tag-content-color-hover:var(--tag-variant-color-hover);--tag-content-color-active:var(--tag-variant-color-down);--tag-content-color-focus:var(--tag-variant-color-focus);--tag-background-color:transparent;--tag-background-color-hover:color-mix(in oklch, var(--tag-variant-color), transparent 90%);--tag-background-color-active:color-mix(in oklch, var(--tag-variant-color), transparent 82%);--tag-background-color-focus:color-mix(in oklch, var(--tag-variant-color), transparent 90%);--tag-border-color-selected:var(--tag-variant-color-down);--tag-border-color-selected-hover:var(--tag-variant-color-down);--tag-border-color-selected-active:var(--tag-variant-color-down);--tag-border-color-selected-focus:var(--tag-variant-color-down);--tag-content-color-selected:var(--tag-variant-color-down);--tag-background-color-selected:color-mix(in oklch, var(--tag-variant-color), transparent 80%);--tag-background-color-selected-hover:color-mix(in oklch, var(--tag-variant-color), transparent 72%);--tag-background-color-selected-active:color-mix(in oklch, var(--tag-variant-color), transparent 72%);--tag-background-color-selected-focus:color-mix(in oklch, var(--tag-variant-color), transparent 72%)}:host([variant][treatment=subtle]){--tag-subtle-background-color:color-mix(in srgb, var(--tag-variant-color) var(--tag-subtle-background-opacity), var(--luzmo-background-color));--tag-subtle-interaction-background-color:color-mix(in srgb, var(--tag-variant-color) var(--tag-subtle-interaction-background-opacity), var(--luzmo-background-color));--tag-subtle-content-color:var(--tag-variant-subtle-content-color,color-mix(in oklch, var(--tag-variant-color), var(--luzmo-font-color) var(--tag-subtle-content-mix)));--tag-subtle-interaction-content-color:color-mix(in oklch, var(--tag-variant-color), var(--luzmo-font-color) var(--tag-subtle-content-mix));--tag-background-color:var(--tag-subtle-background-color);--tag-background-color-hover:var(--tag-subtle-interaction-background-color);--tag-background-color-active:var(--tag-subtle-background-color);--tag-background-color-focus:var(--tag-subtle-interaction-background-color);--tag-background-color-selected:var(--tag-subtle-background-color);--tag-background-color-selected-hover:var(--tag-subtle-background-color);--tag-background-color-selected-active:var(--tag-subtle-background-color);--tag-background-color-selected-focus:var(--tag-subtle-background-color);--tag-content-color:var(--tag-subtle-content-color);--tag-content-color-hover:var(--tag-subtle-interaction-content-color);--tag-content-color-active:var(--tag-subtle-content-color);--tag-content-color-focus:var(--tag-subtle-interaction-content-color);--tag-content-color-selected:var(--tag-subtle-content-color);--luzmo-clear-button-background-color-hover:var(--tag-subtle-interaction-background-color);--luzmo-clear-button-background-color-focus:var(--tag-subtle-interaction-background-color);--luzmo-clear-button-background-color-down:var(--tag-subtle-background-color)}:host([variant][treatment=fill]){--tag-background-color:var(--tag-variant-color);--tag-background-color-hover:var(--tag-variant-fill-color-hover);--tag-background-color-active:var(--tag-variant-fill-color-down);--tag-background-color-focus:var(--tag-variant-fill-color-focus);--tag-content-color:var(--tag-variant-fill-content-color);--tag-content-color-hover:var(--tag-variant-fill-content-color);--tag-content-color-active:var(--tag-variant-fill-content-color);--tag-content-color-focus:var(--tag-variant-fill-content-color);--tag-border-color:transparent;--tag-border-color-hover:transparent;--tag-border-color-active:transparent;--tag-border-color-focus:transparent;--tag-background-color-selected:var(--tag-variant-fill-color-down);--tag-background-color-selected-hover:var(--tag-variant-fill-color-down);--tag-background-color-selected-active:var(--tag-variant-fill-color-down);--tag-background-color-selected-focus:var(--tag-variant-fill-color-down);--tag-content-color-selected:var(--tag-variant-fill-content-color);--tag-border-color-selected:transparent;--tag-border-color-selected-hover:transparent;--tag-border-color-selected-active:transparent;--tag-border-color-selected-focus:transparent;--luzmo-clear-button-background-color-hover:var(--tag-variant-fill-color-hover);--luzmo-clear-button-background-color-focus:var(--tag-variant-fill-color-focus);--luzmo-clear-button-background-color-down:var(--tag-variant-fill-color-down)}:host([variant]:is([treatment=subtle],[treatment=fill])[invalid]){--tag-background-color:var(--luzmo-background-color);--tag-background-color-hover:var(--luzmo-background-color-hover);--tag-background-color-active:var(--luzmo-background-color-down);--tag-background-color-focus:var(--luzmo-background-color-focus);--tag-content-color:var(--luzmo-negative-color);--tag-content-color-hover:var(--luzmo-negative-color-hover);--tag-content-color-active:var(--luzmo-negative-color-down);--tag-content-color-focus:var(--luzmo-negative-color-focus)}:host([invalid]) .clear-button{--clearbutton-medium-icon-color:var(--tag-icon-color-error-key-focus,var(--red-600));--clearbutton-medium-icon-color-hover:var(--clearbutton-medium-icon-color);--clearbutton-medium-icon-color-down:var(--tag-deletable-icon-color-error-down,var(--red-700))}:host([invalid]):hover .clear-button,:host([invalid]:is(:active,[active])) .clear-button{--clearbutton-medium-icon-color:var(--tag-icon-color-error-hover,var(--red-600));--clearbutton-medium-icon-color-hover:var(--clearbutton-medium-icon-color);--clearbutton-medium-icon-color-down:var(--tag-deletable-icon-color-error-down,var(--red-700))}:host([size=xs]){--icon-size:var(--workflow-icon-size-50)}:host([size=s]){--icon-size:var(--workflow-icon-size-75)}:host([size=m]){--icon-size:var(--workflow-icon-size)}:host([size=l]){--icon-size:var(--workflow-icon-size-200)}:host([size=xl]){--icon-size:var(--workflow-icon-size-300)}:host([size=xxl]){--icon-size:var(--workflow-icon-size-400)}", p = [
+	"accent",
+	"neutral",
+	"informative",
+	"positive",
+	"negative",
+	"notice",
+	"seafoam",
+	"indigo",
+	"purple",
+	"fuchsia",
+	"magenta",
+	"yellow",
+	"gray",
+	"red",
+	"orange",
+	"chartreuse",
+	"celery",
+	"green",
+	"cyan",
+	"blue"
+], m = class extends n(e, {
+	validSizes: [
+		"s",
+		"m",
+		"l",
+		"xl"
+	],
+	noDefaultSize: !0
+}) {
+	static get styles() {
+		return [c(f)];
+	}
+	get variant() {
+		return this._variant;
+	}
+	set variant(e) {
+		if (e === this._variant) return;
+		let t = this._variant;
+		e && p.includes(e) ? (this._variant = e, this.setAttribute("variant", e)) : (this._variant = void 0, this.removeAttribute("variant")), this.requestUpdate("variant", t);
+	}
+	constructor() {
+		super(), this._languageScript = new a(this), this.treatment = "outline", this.deletable = !1, this.disabled = !1, this.readonly = !1, this._labelText = "", this.handleFocusin = () => {
+			this.addEventListener("focusout", this.handleFocusout), this.addEventListener("keydown", this.handleKeydown);
+		}, this.handleFocusout = () => {
+			this.removeEventListener("keydown", this.handleKeydown), this.removeEventListener("focusout", this.handleFocusout);
+		}, this.handleKeydown = (e) => {
+			if (!this.deletable || this.disabled) return;
+			let { code: t } = e;
+			switch (t) {
+				case "Backspace":
+				case "Space":
+				case "Delete":
+					e.preventDefault(), e.stopPropagation(), this.delete();
+					break;
+				default: return;
+			}
+		}, this.addEventListener("focusin", this.handleFocusin);
+	}
+	handleIconSlotChange(e) {
+		e.target.assignedElements().forEach((e) => {
+			e.tagName.toLowerCase() === "luzmo-icon" && e.setAttribute("block", "");
+		});
+	}
+	handleLabelSlotChange(e) {
+		let t = e.target.assignedNodes({ flatten: !0 });
+		this._labelText = t.map((e) => e.textContent).join("").trim();
+	}
+	delete() {
+		this.readonly || this.dispatchEvent(new Event("delete", {
+			bubbles: !0,
+			cancelable: !0,
+			composed: !0
+		})) && (this.blur(), this.remove());
+	}
+	render() {
+		return o`
+      <slot name="avatar"></slot>
+      <slot name="icon" @slotchange=${this.handleIconSlotChange}></slot>
+      <span class="label" focusable>
+        <span class="label-text">
+          <slot @slotchange=${this.handleLabelSlotChange}></slot>
+        </span>
+        ${this._labelText ? o`
+                <luzmo-tooltip
+                  self-managed
+                  show-only-if-truncated
+                  truncated-element-selector="slot"
+                  placement="top"
+                >
+                  ${this._labelText}
+                </luzmo-tooltip>
+              ` : s}
+      </span>
+      ${this.deletable ? o`
+              <luzmo-clear-button
+                class="clear-button"
+                ?disabled=${this.disabled}
+                label="Remove"
+                .size=${this.size}
+                tabindex="-1"
+                aria-hidden="true"
+                @click=${this.delete}
+              ></luzmo-clear-button>
+            ` : s}
+    `;
+	}
+	firstUpdated(e) {
+		super.firstUpdated(e), this.hasAttribute("role") || this.setAttribute("role", "listitem"), this.hasAttribute("treatment") || this.setAttribute("treatment", this.treatment), this.deletable && this.setAttribute("tabindex", "0");
+	}
+	updated(e) {
+		super.updated(e), e.has("disabled") && (this.disabled ? this.setAttribute("aria-disabled", "true") : this.removeAttribute("aria-disabled"));
+	}
+};
+t([l({ reflect: !0 })], m.prototype, "variant", null), t([l({ reflect: !0 })], m.prototype, "treatment", void 0), t([l({
+	type: Boolean,
+	reflect: !0
+})], m.prototype, "deletable", void 0), t([l({
+	type: Boolean,
+	reflect: !0
+})], m.prototype, "disabled", void 0), t([l({
+	type: Boolean,
+	reflect: !0
+})], m.prototype, "readonly", void 0), t([d()], m.prototype, "_labelText", void 0);
+// src/components/tags/tags.module.scss?inline
+var h = ":host{flex-wrap:wrap;margin:0;padding:0;list-style:none;display:inline-flex}::slotted(*){margin-block:var(--luzmo-tag-group-item-margin-block,var(--tag-group-item-margin-block));margin-inline:var(--luzmo-tag-group-item-margin-inline,var(--tag-group-item-margin-inline))}::slotted(:first-child){margin-inline-start:0}::slotted(:last-child){margin-inline-end:0}:host{--luzmo-tag-group-item-margin-block:var(--luzmo-spacing-2);--luzmo-tag-group-item-margin-inline:var(--luzmo-spacing-2);--luzmo-clear-button-width:fit-content;margin:0;padding:0;list-style:none;display:inline-flex}:host([size=s]){--luzmo-tag-group-item-margin-block:var(--luzmo-spacing-2);--luzmo-tag-group-item-margin-inline:var(--luzmo-spacing-2)}:host([size=l]){--luzmo-tag-group-item-margin-block:calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1));--luzmo-tag-group-item-margin-inline:calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1))}:host([size=xl]){--luzmo-tag-group-item-margin-block:var(--luzmo-spacing-3);--luzmo-tag-group-item-margin-inline:var(--luzmo-spacing-3)}:host{--clear-button-width:fit-content;margin:0;padding:0;list-style:none;display:inline-flex}", g = class extends r(n(e)) {
+	static get styles() {
+		return [c(h)];
+	}
+	get tags() {
+		return this.defaultNodes.filter((e) => e instanceof m);
+	}
+	constructor() {
+		super(), this.rovingTabindexController = new i(this, {
+			focusInIndex: (e) => e.findIndex((e) => !e.disabled && e.deletable),
+			elements: () => this.tags,
+			isFocusableElement: (e) => !e.disabled && e.deletable
+		}), this.handleFocusin = () => {
+			this.addEventListener("focusout", this.handleFocusout), this.addEventListener("keydown", this.handleKeydown);
+		}, this.handleKeydown = (e) => {
+			let { code: t } = e;
+			if (t !== "PageUp" && t !== "PageDown") return;
+			let n = (e, t) => e[(e.length + t) % e.length], r = [...this.getRootNode().querySelectorAll("luzmo-tags")];
+			if (r.length < 2) return;
+			e.preventDefault();
+			let i = r.indexOf(this), a = t === "PageUp" ? -1 : 1, o = i + a, s = n(r, o), c = 0;
+			for (; s.tags.length === 0;) {
+				if (++c >= r.length) return;
+				o += a, s = n(r, o);
+			}
+			s.focus();
+		}, this.handleFocusout = () => {
+			this.removeEventListener("keydown", this.handleKeydown), this.removeEventListener("focusout", this.handleFocusout);
+		}, this.addEventListener("focusin", this.handleFocusin);
+	}
+	focus() {
+		this.rovingTabindexController.focus();
+	}
+	handleSlotchange() {
+		this.rovingTabindexController.clearElementCache(), this.updateTagSizes();
+	}
+	updateTagSizes() {
+		this.tags.forEach((e) => {
+			e.size = this.size;
+		});
+	}
+	render() {
+		return o` <slot @slotchange=${this.handleSlotchange}></slot> `;
+	}
+	firstUpdated() {
+		this.hasAttribute("role") || this.setAttribute("role", "list"), this.hasAttribute("aria-label") || this.setAttribute("aria-label", "Tags");
+	}
+	updated(e) {
+		super.updated(e), e.has("size") && this.updateTagSizes();
+	}
+};
+t([u()], g.prototype, "defaultNodes", void 0), customElements.get("luzmo-tag") || customElements.define("luzmo-tag", m), customElements.get("luzmo-tags") || customElements.define("luzmo-tags", g);
+export { m as n, g as t };