@luzmo/lucero 1.0.1-alpha.1 → 1.0.1-alpha.3

package/components/select/index.cjs

@@ -15,24 +15,24 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T=require("../options/index.cjs"),h=require("../luzmo-icons-D47EGj-3.cjs"),o=require("../base-CBCg3yyw.cjs"),y=require("../state-D8JEtYqe.cjs"),m=require("../query-BL-TJj7K.cjs"),D=require("../class-map-Di1D_rCm.cjs"),z=require("../if-defined-C9YGdo33.cjs"),f=require("../strategies-BACP6MhR.cjs"),F=require("../focusable-EbipgXRh.cjs"),V=require("../dependency-manger-C5HCkMMB.cjs"),A=require("../pending-state-CaH1si5b.cjs"),R=require("../sized-mixin-CPxE5C96.cjs");require("../icon/index.cjs");require("../overlay/index.cjs");require("../popover/index.cjs");require("../progress-circle/index.cjs");require("../tooltip/index.cjs");const K=(d,e)=>{let t=getComputedStyle(d).getPropertyValue(e);for(;!t&&d.parentElement;)d=d.parentElement,t=getComputedStyle(d).getPropertyValue(e);return t.trim()},N=':host{font-family:var(--luzmo-select-font-family, var(--select-font-family));font-size:var(--luzmo-select-font-size, var(--select-font-size))}#button{cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--luzmo-button-font-family, var(--luzmo-font-family));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:var(--luzmo-button-line-height, var(--luzmo-line-height, 1.3));text-transform:none;vertical-align:top;-webkit-appearance:button;transition:background var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,border-color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,box-shadow var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out;justify-content:center;align-items:center;margin:0;-webkit-text-decoration:none;text-decoration:none;display:inline-flex;position:relative;overflow:visible}#button::-moz-focus-inner{border-style:none;padding:0}#button:focus{outline:none}#icon{margin-inline-end:var(--luzmo-select-spacing-text-to-icon, var(--select-spacing-text-to-icon));font-size:var(--luzmo-select-font-size, var(--select-font-size))}@media (forced-colors: active){:host{--highcontrast-select-focus-indicator-color: Highlight;--highcontrast-select-border-color-default: ButtonBorder;--highcontrast-select-border-color-hover: Highlight;--highcontrast-select-border-color-disabled: GrayText;--highcontrast-select-content-color-default: ButtonText;--highcontrast-select-content-color-disabled: GrayText;--highcontrast-select-background-color: ButtonFace}#button:focus-visible{--highcontrast-select-border-color-hover: ButtonText}#button .label,#button:after{forced-color-adjust:none}}#button{box-sizing:border-box;max-inline-size:100%;min-inline-size:calc(var(--select-minimum-width-multiplier) * var(--luzmo-select-button-block-size, var(--select-button-block-size)));block-size:var(--luzmo-select-button-block-size, var(--select-button-block-size));border-width:var(--luzmo-select-button-border-width, var(--select-button-border-width));border-radius:var(--luzmo-select-button-border-radius, var(--select-button-border-radius));box-shadow:var(--luzmo-select-button-box-shadow, var(--select-button-box-shadow));transition:background-color var(--luzmo-select-animation-duration, var(--select-animation-duration)),box-shadow var(--luzmo-select-animation-duration, var(--select-animation-duration)),border-color var(--luzmo-select-animation-duration, var(--select-animation-duration)) ease-in-out;color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-default, var(--select-font-color-default)));background-color:var(--highcontrast-select-background-color, var(--luzmo-select-background-color-default, var(--select-background-color-default)));border-style:solid;border-color:var(--highcontrast-select-border-color-default, var(--luzmo-select-border-color-default, var(--select-border-color-default)));margin-block-start:var(--luzmo-select-spacing-label-to-select, var(--select-spacing-label-to-select));padding-block:0;padding-inline-start:var(--luzmo-select-spacing-edge-to-text, var(--select-spacing-edge-to-text));padding-inline-end:var(--luzmo-select-spacing-edge-to-disclosure-icon, var(--select-spacing-edge-to-disclosure-icon));display:flex}#button:after{pointer-events:none;content:"";block-size:calc(100% + var(--luzmo-select-focus-indicator-gap, var(--select-focus-indicator-gap)) * 2 + var(--luzmo-select-button-border-width, var(--select-button-border-width)) * 2);inline-size:calc(100% + var(--luzmo-select-focus-indicator-gap, var(--select-focus-indicator-gap)) * 2 + var(--luzmo-select-button-border-width, var(--select-button-border-width)) * 2);border-style:solid;border-width:var(--luzmo-select-focus-indicator-width, var(--select-focus-indicator-width));border-radius:calc(var(--luzmo-select-button-border-radius, var(--select-button-border-radius)) + var(--luzmo-select-focus-indicator-gap, var(--select-focus-indicator-gap)) + var(--luzmo-select-button-border-width, var(--select-button-border-width)));border-color:#0000;margin-block-start:calc((var(--luzmo-select-focus-indicator-gap, var(--select-focus-indicator-gap)) + var(--luzmo-select-focus-indicator-width, var(--select-focus-indicator-width)) + var(--luzmo-select-button-border-width, var(--select-button-border-width))) * -1);margin-inline-start:calc((var(--luzmo-select-focus-indicator-gap, var(--select-focus-indicator-gap)) + var(--luzmo-select-focus-indicator-width, var(--select-focus-indicator-width)) + var(--luzmo-select-button-border-width, var(--select-button-border-width))) * -1);position:absolute;inset-block:0;inset-inline:0}#button:active{background-color:var(--highcontrast-select-background-color, var(--luzmo-select-background-color-active, var(--select-background-color-active)));border-color:var(--highcontrast-select-border-color-default, var(--luzmo-select-border-active, var(--select-border-color-active)))}#button:active:after{border-color:#0000}#button.placeholder:active .label{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-active, var(--select-font-color-active)))}#button:focus-visible{background-color:var(--highcontrast-select-background-color, var(--luzmo-select-background-color-key-focus, var(--select-background-color-key-focus)));border-color:var(--highcontrast-select-border-color-default, var(--luzmo-select-border-color-key-focus, var(--select-border-color-key-focus)));color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-key-focus, var(--select-font-color-key-focus)));outline:none}#button:focus-visible:after{border-color:var(--highcontrast-select-focus-indicator-color, var(--luzmo-select-focus-indicator-color, var(--select-focus-indicator-color)))}#button.placeholder:focus-visible{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-key-focus, var(--select-font-color-key-focus)))}#button:focus-visible .disclosure-icon,#button:focus-visible .clear-icon{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-icon-color-key-focus, var(--select-icon-color-key-focus)))}:host([open]) #button:not(:disabled,.is-disabled){color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-default-open, var(--select-font-color-default-open)));background-color:var(--highcontrast-select-background-color, var(--luzmo-select-background-color-default-open, var(--select-background-color-default-open)));border-color:var(--highcontrast-select-border-color-default, var(--luzmo-select-border-default-open, var(--select-border-color-default-open)))}:host([open]) #button:not(:disabled,.is-disabled) .disclosure-icon,:host([open]) #button:not(:disabled,.is-disabled) .clear-icon{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-icon-color-default-open, var(--select-icon-color-default-open)))}:host([invalid]) #button:not(:disabled,.is-disabled){border-color:var(--highcontrast-select-border-color-default, var(--luzmo-select-border-color-error-default, var(--select-border-color-error-default)))}:host([invalid]) #button:not(:disabled,.is-disabled) .validation-icon{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-icon-color-error, var(--select-icon-color-error)))}:host([invalid]) #button:not(:disabled,.is-disabled):active{border-color:var(--highcontrast-select-border-color-default, var(--luzmo-select-border-color-error-active, var(--select-border-color-error-active)))}:host([invalid][open]) #button:not(:disabled,.is-disabled){border-color:var(--highcontrast-select-border-color-default, var(--luzmo-select-border-color-error-default-open, var(--select-border-color-error-default-open)))}:host([invalid]) #button:not(:disabled,.is-disabled):focus-visible{border-color:var(--highcontrast-select-border-color-default, var(--luzmo-select-border-color-error-key-focus, var(--select-border-color-error-key-focus)))}:host([pending]) #button .disclosure-icon,:host([pending]) #button .clear-icon{color:var(--highcontrast-select-content-color-disabled, var(--luzmo-select-icon-color-disabled, var(--select-icon-color-disabled)))}.icon{flex-shrink:0}.label{white-space:nowrap;font-size:var(--luzmo-select-font-size, var(--select-font-size));line-height:var(--luzmo-select-button-line-height, var(--select-button-line-height));font-weight:var(--luzmo-select-font-weight, var(--select-font-weight));text-overflow:ellipsis;text-align:start;flex:auto;overflow:hidden}.label.placeholder{font-weight:var(--luzmo-select-placeholder-font-weight, var(--select-font-weight));font-style:var(--luzmo-select-placeholder-font-style, var(--select-placeholder-font-style));transition:color var(--luzmo-select-animation-duration, var(--select-animation-duration)) ease-in-out;color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-default, var(--select-font-color-default)))}.label.placeholder:active{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-active, var(--select-font-color-active)))}.clear-icon,.disclosure-icon{vertical-align:top;transition:color var(--luzmo-select-animation-duration, var(--select-animation-duration)) ease-out;color:var(--highcontrast-select-content-color-default, var(--luzmo-select-icon-color-default, var(--select-icon-color-default)));flex-shrink:0;display:inline-block;position:relative}.disclosure-icon{margin-inline-start:var(--luzmo-select-spacing-icon-to-disclosure-icon, var(--select-spacing-icon-to-disclosure-icon))}.clear-icon{margin-inline-start:var(--luzmo-select-spacing-icon-to-clear-icon, var(--select-spacing-icon-to-clear-icon))}.disclosure-icon:active{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-icon-color-active, var(--select-icon-color-active)))}luzmo-progress-circle,.validation-icon{margin-inline-start:var(--luzmo-select-spacing-text-to-icon, var(--select-spacing-text-to-icon))}.icon-container{display:flex;position:relative;height:100%;align-items:center;font-size:var(--luzmo-select-disclosure-icon-size, var(--select-disclosure-icon-size))}.icon-container.disclosure-icon{margin-inline-end:0}.label~.disclosure-icon,.label~.clear-icon{margin-inline-start:var(--luzmo-select-spacing-text-to-icon, var(--select-spacing-text-to-icon))}:host([quiet]) #button{inline-size:auto;min-inline-size:0;padding-inline:var(--luzmo-select-spacing-edge-to-text-quiet, var(--select-spacing-edge-to-text-quiet));color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-default, var(--select-font-color-default)));background-color:initial;background-color:var(--highcontrast-select-background-color, transparent);border:none;border-radius:0;box-shadow:none;margin-block-start:calc(var(--luzmo-select-spacing-label-to-select-quiet, var(--select-spacing-label-to-select-quiet)) + 1px)}:host([quiet]) #button.label-inline{margin-block-start:0}:host([quiet]) #button .disclosure-icon{margin-inline-end:var(--luzmo-select-spacing-edge-to-disclosure-icon-quiet, var(--select-spacing-edge-to-disclosure-icon-quiet))}:host([quiet]) #button:after{block-size:auto;inline-size:auto;border:none}@media (hover: hover){#button:hover{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-hover, var(--select-font-color-hover)));background-color:var(--highcontrast-select-background-color, var(--luzmo-select-background-color-hover, var(--select-background-color-hover)));border-color:var(--highcontrast-select-border-color-hover, var(--luzmo-select-border-color-hover, var(--select-border-color-hover)))}#button:hover .disclosure-icon,#button:hover .clear-icon{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-icon-color-hover, var(--select-icon-color-hover)))}#button:hover .clear-icon:hover{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-clear-icon-color-hover, var(--select-icon-color-focus)))}:host([open]):not([quiet]) #button:not(:disabled,.is-disabled):hover{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-hover-open, var(--select-font-color-hover-open)));background-color:var(--highcontrast-select-background-color, var(--luzmo-select-background-color-hover-open, var(--select-background-color-hover-open)));border-color:var(--highcontrast-select-border-color-hover, var(--luzmo-select-border-color-hover-open, var(--select-border-color-hover-open)))}:host([open]) #button:not(:disabled,.is-disabled):hover .disclosure-icon,:host([open]) #button:not(:disabled,.is-disabled):hover .clear-icon{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-icon-color-hover-open, var(--select-icon-color-hover-open)))}:host([invalid]) #button:not(:disabled,.is-disabled):hover{border-color:var(--highcontrast-select-border-color-hover, var(--luzmo-select-border-color-error-hover, var(--select-border-color-error-hover)))}:host([invalid][open]) #button:not(:disabled,.is-disabled):hover{border-color:var(--highcontrast-select-border-color-hover, var(--luzmo-select-border-color-error-hover-open, var(--select-border-color-error-hover-open)))}.label.placeholder:hover{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-hover, var(--select-font-color-hover)))}:host([quiet]) #button:hover{background-color:initial;background-color:var(--highcontrast-select-background-color, transparent)!important}}:host([quiet]) #button:focus-visible{background-color:initial;background-color:var(--highcontrast-select-background-color, transparent)}:host([quiet]) #button:focus-visible:after{box-shadow:0 var(--luzmo-select-focus-indicator-width, var(--select-focus-indicator-width)) 0 0 var(--highcontrast-select-focus-indicator-color, var(--luzmo-select-focus-indicator-color, var(--select-focus-indicator-color)));margin:calc((var(--luzmo-select-focus-indicator-gap, var(--select-focus-indicator-gap)) + var(--luzmo-select-button-border-width, var(--select-button-border-width))) * -1) 0;border:none;border-radius:0}:host([quiet][open]) #button,:host([quiet][disabled]) #button#button,:host([quiet]) #button#button:disabled,:host([quiet]) #button:active{background-color:initial;background-color:var(--highcontrast-select-background-color, transparent)}.label-inline{vertical-align:top;display:inline-flex}:host([disabled]) #button,#button:disabled{cursor:default;background-color:var(--highcontrast-select-background-color, var(--luzmo-select-background-color-disabled, var(--select-background-color-disabled)));border-color:#0000;border-color:var(--highcontrast-select-border-color-disabled, transparent);color:var(--highcontrast-select-content-color-disabled, var(--luzmo-select-font-color-disabled, var(--select-font-color-disabled)))}:host([disabled]) #button .icon,:host([disabled]) #button .disclosure-icon,:host([disabled]) #button .clear-icon,:host([disabled]) #button .validation-icon,#button:disabled .icon,#button:disabled .disclosure-icon,#button:disabled .clear-icon,#button:disabled .validation-icon{color:var(--highcontrast-select-content-color-disabled, var(--luzmo-select-icon-color-disabled, var(--select-icon-color-disabled)))}:host([disabled]) #button .label.placeholder,#button:disabled .label.placeholder{color:var(--highcontrast-select-content-color-disabled, var(--luzmo-select-font-color-disabled, var(--select-font-color-disabled)))}#popover{max-width:var(--luzmo-select-popover-max-width, var(--select-popover-max-width));min-width:var(--luzmo-select-popover-min-width, var(--select-popover-min-width));width:var(--luzmo-select-popover-width, var(--select-popover-width))}#search-container{flex:0 0 auto;display:flex;position:relative;border-bottom:var(--luzmo-select-search-container-border-bottom-width, var(--select-search-container-border-bottom-width)) solid var(--luzmo-select-search-container-border-bottom-color, var(--select-search-container-border-bottom-color))}#search-icon{position:absolute;left:var(--luzmo-select-spacing-edge-to-text, var(--select-spacing-edge-to-text));color:var(--luzmo-select-search-icon-color, var(--select-search-icon-color));top:0;bottom:0;pointer-events:none}#search:focus-within+#search-icon,#search:focus+#search-icon{color:var(--luzmo-select-search-icon-color-focus, var(--select-search-icon-color-focus))}#search{width:100%;box-sizing:border-box;color:var(--luzmo-select-search-color, var(--select-search-color));height:var(--luzmo-select-button-block-size, var(--select-button-block-size));padding-left:calc(var(--luzmo-select-spacing-edge-to-text, var(--select-spacing-edge-to-text)) + var(--luzmo-select-spacing-search-icon-to-text, var(--select-spacing-search-icon-to-text)) + var(--luzmo-select-font-size, var(--select-font-size)));padding-right:var(--luzmo-select-spacing-edge-to-text, var(--select-spacing-edge-to-text));font-size:var(--luzmo-select-font-size, var(--select-font-size));line-height:var(--luzmo-select-button-line-height, var(--select-button-line-height));font-weight:var(--luzmo-select-font-weight, var(--select-font-weight));border:var(--luzmo-select-search-input-border-bottom-width, var(--select-search-input-border-bottom-width)) solid var(--luzmo-select-search-input-border-bottom-color, var(--select-search-input-border-bottom-color));outline:none}#no-results{color:var(--luzmo-select-no-results-color, var(--select-no-results-color));font-style:var(--luzmo-select-no-results-font-style, var(--select-no-results-font-style));height:var(--luzmo-select-no-results-height, var(--select-no-results-height));padding-inline:var(--luzmo-select-no-results-spacing-edge-to-text, var(--select-no-results-spacing-edge-to-text));display:flex;align-items:center}:host{--select-popover-max-width: 300px;--select-popover-min-width: 160px;--select-font-family: var(--luzmo-font-family);--select-font-size: var(--luzmo-font-size);--select-spacing-search-icon-to-text: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--select-search-icon-color: var(--luzmo-disabled-color);--select-search-icon-color-focus: var(--luzmo-font-color);--select-search-color: var(--luzmo-font-color);--select-search-container-border-bottom-width: var(--luzmo-border-width);--select-search-container-border-bottom-color: var(--luzmo-border-color);--select-search-input-border-bottom-width: var(--luzmo-border-width);--select-search-input-border-bottom-color: transparent;--select-background-color-default: var(--luzmo-background-color);--select-background-color-default-open: var(--luzmo-background-color-hover);--select-background-color-active: var(--luzmo-background-color-down);--select-background-color-hover: var(--luzmo-background-color-hover);--select-background-color-hover-open: var(--luzmo-background-color-down);--select-background-color-key-focus: var(--luzmo-background-color-down);--select-border-color-default: var(--luzmo-border-color);--select-border-color-default-open: var(--luzmo-border-color-hover);--select-border-color-hover: var(--luzmo-border-color);--select-border-color-hover-open: var(--luzmo-border-color-hover);--select-border-color-active: var(--luzmo-border-color);--select-border-color-key-focus: var(--luzmo-border-color);--select-button-border-width: var(--luzmo-border-width);--select-font-weight: var(--luzmo-font-weight);--select-placeholder-font-style: var(--luzmo-font-style);--select-button-line-height: var(--luzmo-line-height);--select-button-box-shadow: 0px 1px 3px 0px rgba(var(--luzmo-border-color-rgb), .06);--select-button-block-size: var(--luzmo-component-height);--select-button-border-radius: var(--luzmo-border-radius);--select-button-border-radius-reset: 0;--select-spacing-edge-to-text: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--select-spacing-text-to-icon: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--select-spacing-text-to-icon-inline-end: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--select-spacing-icon-to-disclosure-icon: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--select-spacing-icon-to-clear-icon: var( --select-spacing-icon-to-disclosure-icon );--select-spacing-edge-to-text-quiet: 0px;--select-spacing-label-to-select: 0px;--select-spacing-label-to-select-quiet: calc( -1 * var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--select-spacing-edge-to-disclosure-icon: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--select-spacing-edge-to-disclosure-icon-quiet: 0px;--select-animation-duration: var(--luzmo-animation-duration);--select-font-color-default: var(--luzmo-font-color);--select-font-color-default-open: var(--luzmo-font-color-hover);--select-font-color-hover: var(--luzmo-font-color-hover);--select-font-color-hover-open: var(--luzmo-font-color-down);--select-font-color-active: var(--luzmo-font-color-focus);--select-font-color-key-focus: var(--luzmo-font-color-focus);--select-icon-color-default: var(--luzmo-font-color);--select-icon-color-default-open: var(--luzmo-font-color-hover);--select-icon-color-hover: var(--luzmo-font-color-hover);--select-icon-color-hover-open: var(--luzmo-font-color-hover);--select-icon-color-active: var(--luzmo-font-color-focus);--select-icon-color-key-focus: var(--luzmo-font-color-focus);--select-border-color-error-default: var(--luzmo-negative-color);--select-border-color-error-default-open: var(--luzmo-negative-color-down);--select-border-color-error-hover: var(--luzmo-negative-color-hover);--select-border-color-error-hover-open: var(--luzmo-negative-color-down);--select-border-color-error-active: var(--luzmo-negative-color-down);--select-border-color-error-key-focus: var(--luzmo-negative-color-focus);--select-icon-color-error: var(--luzmo-negative-color);--select-background-color-disabled: var(--luzmo-background-color-disabled);--select-font-color-disabled: var(--luzmo-disabled-color);--select-icon-color-disabled: var(--luzmo-disabled-color);--select-focus-indicator-gap: var(--luzmo-indicator-gap);--select-focus-indicator-width: var(--luzmo-indicator-width);--select-focus-indicator-color: var(--luzmo-indicator-color);--select-disclosure-icon-size: var(--luzmo-font-size-s);--select-no-results-height: var(--select-button-block-size);--select-no-results-color: var(--select-font-color-disabled);--select-no-results-font-style: italic;--select-no-results-spacing-edge-to-text: var(--select-spacing-edge-to-text)}:host([size=s]){--select-button-block-size: var(--luzmo-component-height-s);--select-font-size: var(--luzmo-font-size-s);--select-popover-max-width: 280px;--select-popover-min-width: 140px;--select-spacing-search-icon-to-text: var(--luzmo-spacing-3);--select-spacing-edge-to-text: var(--luzmo-spacing-3);--select-spacing-text-to-icon: var(--luzmo-spacing-3);--select-spacing-text-to-icon-inline-end: var(--luzmo-spacing-3);--select-spacing-icon-to-disclosure-icon: var(--luzmo-spacing-3);--select-spacing-label-to-select-quiet: calc(-1 * var(--luzmo-spacing-3));--select-spacing-edge-to-disclosure-icon: var(--luzmo-spacing-3);--select-disclosure-icon-size: var(--luzmo-font-size-s)}:host([size=l]){--select-button-block-size: var(--luzmo-component-height-l);--select-font-size: var(--luzmo-font-size-l);--select-popover-max-width: 360px;--select-popover-min-width: 220px;--select-spacing-search-icon-to-text: var(--luzmo-spacing-4);--select-spacing-edge-to-text: var(--luzmo-spacing-4);--select-spacing-text-to-icon: var(--luzmo-spacing-4);--select-spacing-text-to-icon-inline-end: var(--luzmo-spacing-4);--select-spacing-icon-to-disclosure-icon: var(--luzmo-spacing-4);--select-spacing-label-to-select-quiet: calc(-1 * var(--luzmo-spacing-4));--select-spacing-edge-to-disclosure-icon: var(--luzmo-spacing-4);--select-disclosure-icon-size: var(--luzmo-font-size)}:host([size=xl]){--select-button-block-size: var(--luzmo-component-height-xl);--select-font-size: var(--luzmo-font-size-xl);--select-popover-max-width: 400px;--select-popover-min-width: 260px;--select-spacing-search-icon-to-text: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--select-spacing-edge-to-text: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--select-spacing-text-to-icon: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--select-spacing-text-to-icon-inline-end: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--select-spacing-icon-to-disclosure-icon: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--select-spacing-label-to-select-quiet: calc( -1 * var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--select-spacing-edge-to-disclosure-icon: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--select-disclosure-icon-size: var(--luzmo-font-size-l)}:host([variant=highlight]) ::slotted(luzmo-option[selected]){--option-highlight-label-content-color: var(--luzmo-primary-inverse-color);--option-label-icon-color-default: var(--luzmo-primary-inverse-color);--menu-checkmark-display: var(--menu-checkmark-display-hidden);padding-inline-start:var(--luzmo-option-label-inline-edge-to-content, var(--option-label-inline-edge-to-content));background-color:var(--luzmo-option-highlight-label-background-color, var(--option-highlight-label-background-color, var(--luzmo-border-color)))}:host{display:inline-flex;vertical-align:top;max-inline-size:100%;inline-size:var(--luzmo-select-inline-size, var(--select-inline-size));min-inline-size:calc(var(--select-minimum-width-multiplier) * var(--luzmo-select-block-size, var(--select-block-size)))}:host([quiet]){width:auto;min-width:0}:host([disabled]){pointer-events:none}#button{width:100%;min-width:100%;max-width:100%}#icon:not([hidden]){display:inline-flex}:host([readonly]) #button{-webkit-user-select:inherit;user-select:inherit}.validation-icon{flex-shrink:0}luzmo-overlay{pointer-events:none}luzmo-options{pointer-events:initial}:host>#no-results,:host>luzmo-options{display:none}:host([focused]:not([quiet])) #button #label.placeholder{color:var(--select-placeholder-text-color-key-focus, var(--alias-placeholder-text-color-hover))}.visually-hidden{border:0;clip:rect(0,0,0,0);clip-path:inset(50%);height:1px;margin:0 -1px -1px 0;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}luzmo-overlay:not(:defined){display:none}#button.remove-focus-ring-safari-hack:focus-visible{background-color:var(--highcontrast-select-background-color, var(--luzmo-select-background-color-default, var(--select-background-color-default)));border-color:var(--highcontrast-select-border-color-default, var(--luzmo-select-border-color-default, var(--select-border-color-default)));color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-default, var(--select-font-color-default)))}#button.remove-focus-ring-safari-hack:after{border:none}#button.remove-focus-ring-safari-hack:focus-visible:after{box-shadow:none}#button.remove-focus-ring-safari-hack:active{background-color:var(--highcontrast-select-background-color, var(--luzmo-select-background-color-default, var(--select-background-color-default)));border-color:var(--highcontrast-select-border-color-default, var(--luzmo-select-border-color-default, var(--select-border-color-default)));color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-default, var(--select-font-color-default)))}';var W=Object.defineProperty,i=(d,e,t,s)=>{for(var a=void 0,r=d.length-1,c;r>=0;r--)(c=d[r])&&(a=c(e,t,a)||a);return a&&W(e,t,a),a};const U=()=>o.x`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T=require("../options/index.cjs"),h=require("../luzmo-icons-DletXGWU.cjs"),o=require("../base-CBCg3yyw.cjs"),y=require("../state-D8JEtYqe.cjs"),m=require("../query-BL-TJj7K.cjs"),D=require("../class-map-Di1D_rCm.cjs"),z=require("../if-defined-C9YGdo33.cjs"),f=require("../strategies-BACP6MhR.cjs"),F=require("../focusable-EbipgXRh.cjs"),V=require("../dependency-manger-C5HCkMMB.cjs"),A=require("../pending-state-CaH1si5b.cjs"),R=require("../sized-mixin-CPxE5C96.cjs");require("../icon/index.cjs");require("../overlay/index.cjs");require("../popover/index.cjs");require("../progress-circle/index.cjs");require("../tooltip/index.cjs");const K=(d,e)=>{let t=getComputedStyle(d).getPropertyValue(e);for(;!t&&d.parentElement;)d=d.parentElement,t=getComputedStyle(d).getPropertyValue(e);return t.trim()},N=':host{font-family:var(--luzmo-select-font-family, var(--select-font-family));font-size:var(--luzmo-select-font-size, var(--select-font-size))}#button{cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--luzmo-button-font-family, var(--luzmo-font-family));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:var(--luzmo-button-line-height, var(--luzmo-line-height, 1.3));text-transform:none;vertical-align:top;-webkit-appearance:button;transition:background var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,border-color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,box-shadow var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out;justify-content:center;align-items:center;margin:0;-webkit-text-decoration:none;text-decoration:none;display:inline-flex;position:relative;overflow:visible}#button::-moz-focus-inner{border-style:none;padding:0}#button:focus{outline:none}#icon{margin-inline-end:var(--luzmo-select-spacing-text-to-icon, var(--select-spacing-text-to-icon));font-size:var(--luzmo-select-font-size, var(--select-font-size))}@media (forced-colors: active){:host{--highcontrast-select-focus-indicator-color: Highlight;--highcontrast-select-border-color-default: ButtonBorder;--highcontrast-select-border-color-hover: Highlight;--highcontrast-select-border-color-disabled: GrayText;--highcontrast-select-content-color-default: ButtonText;--highcontrast-select-content-color-disabled: GrayText;--highcontrast-select-background-color: ButtonFace}#button:focus-visible{--highcontrast-select-border-color-hover: ButtonText}#button .label,#button:after{forced-color-adjust:none}}#button{box-sizing:border-box;max-inline-size:100%;min-inline-size:calc(var(--select-minimum-width-multiplier) * var(--luzmo-select-button-block-size, var(--select-button-block-size)));block-size:var(--luzmo-select-button-block-size, var(--select-button-block-size));border-width:var(--luzmo-select-button-border-width, var(--select-button-border-width));border-radius:var(--luzmo-select-button-border-radius, var(--select-button-border-radius));box-shadow:var(--luzmo-select-button-box-shadow, var(--select-button-box-shadow));transition:background-color var(--luzmo-select-animation-duration, var(--select-animation-duration)),box-shadow var(--luzmo-select-animation-duration, var(--select-animation-duration)),border-color var(--luzmo-select-animation-duration, var(--select-animation-duration)) ease-in-out;color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-default, var(--select-font-color-default)));background-color:var(--highcontrast-select-background-color, var(--luzmo-select-background-color-default, var(--select-background-color-default)));border-style:solid;border-color:var(--highcontrast-select-border-color-default, var(--luzmo-select-border-color-default, var(--select-border-color-default)));margin-block-start:var(--luzmo-select-spacing-label-to-select, var(--select-spacing-label-to-select));padding-block:0;padding-inline-start:var(--luzmo-select-spacing-edge-to-text, var(--select-spacing-edge-to-text));padding-inline-end:var(--luzmo-select-spacing-edge-to-disclosure-icon, var(--select-spacing-edge-to-disclosure-icon));display:flex}#button:after{pointer-events:none;content:"";block-size:calc(100% + var(--luzmo-select-focus-indicator-gap, var(--select-focus-indicator-gap)) * 2 + var(--luzmo-select-button-border-width, var(--select-button-border-width)) * 2);inline-size:calc(100% + var(--luzmo-select-focus-indicator-gap, var(--select-focus-indicator-gap)) * 2 + var(--luzmo-select-button-border-width, var(--select-button-border-width)) * 2);border-style:solid;border-width:var(--luzmo-select-focus-indicator-width, var(--select-focus-indicator-width));border-radius:calc(var(--luzmo-select-button-border-radius, var(--select-button-border-radius)) + var(--luzmo-select-focus-indicator-gap, var(--select-focus-indicator-gap)) + var(--luzmo-select-button-border-width, var(--select-button-border-width)));border-color:#0000;margin-block-start:calc((var(--luzmo-select-focus-indicator-gap, var(--select-focus-indicator-gap)) + var(--luzmo-select-focus-indicator-width, var(--select-focus-indicator-width)) + var(--luzmo-select-button-border-width, var(--select-button-border-width))) * -1);margin-inline-start:calc((var(--luzmo-select-focus-indicator-gap, var(--select-focus-indicator-gap)) + var(--luzmo-select-focus-indicator-width, var(--select-focus-indicator-width)) + var(--luzmo-select-button-border-width, var(--select-button-border-width))) * -1);position:absolute;inset-block:0;inset-inline:0}#button:active{background-color:var(--highcontrast-select-background-color, var(--luzmo-select-background-color-active, var(--select-background-color-active)));border-color:var(--highcontrast-select-border-color-default, var(--luzmo-select-border-active, var(--select-border-color-active)))}#button:active:after{border-color:#0000}#button.placeholder:active .label{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-active, var(--select-font-color-active)))}#button:focus-visible{background-color:var(--highcontrast-select-background-color, var(--luzmo-select-background-color-key-focus, var(--select-background-color-key-focus)));border-color:var(--highcontrast-select-border-color-default, var(--luzmo-select-border-color-key-focus, var(--select-border-color-key-focus)));color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-key-focus, var(--select-font-color-key-focus)));outline:none}#button:focus-visible:after{border-color:var(--highcontrast-select-focus-indicator-color, var(--luzmo-select-focus-indicator-color, var(--select-focus-indicator-color)))}#button.placeholder:focus-visible{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-key-focus, var(--select-font-color-key-focus)))}#button:focus-visible .disclosure-icon,#button:focus-visible .clear-icon{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-icon-color-key-focus, var(--select-icon-color-key-focus)))}:host([open]) #button:not(:disabled,.is-disabled){color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-default-open, var(--select-font-color-default-open)));background-color:var(--highcontrast-select-background-color, var(--luzmo-select-background-color-default-open, var(--select-background-color-default-open)));border-color:var(--highcontrast-select-border-color-default, var(--luzmo-select-border-default-open, var(--select-border-color-default-open)))}:host([open]) #button:not(:disabled,.is-disabled) .disclosure-icon,:host([open]) #button:not(:disabled,.is-disabled) .clear-icon{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-icon-color-default-open, var(--select-icon-color-default-open)))}:host([invalid]) #button:not(:disabled,.is-disabled){border-color:var(--highcontrast-select-border-color-default, var(--luzmo-select-border-color-error-default, var(--select-border-color-error-default)))}:host([invalid]) #button:not(:disabled,.is-disabled) .validation-icon{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-icon-color-error, var(--select-icon-color-error)))}:host([invalid]) #button:not(:disabled,.is-disabled):active{border-color:var(--highcontrast-select-border-color-default, var(--luzmo-select-border-color-error-active, var(--select-border-color-error-active)))}:host([invalid][open]) #button:not(:disabled,.is-disabled){border-color:var(--highcontrast-select-border-color-default, var(--luzmo-select-border-color-error-default-open, var(--select-border-color-error-default-open)))}:host([invalid]) #button:not(:disabled,.is-disabled):focus-visible{border-color:var(--highcontrast-select-border-color-default, var(--luzmo-select-border-color-error-key-focus, var(--select-border-color-error-key-focus)))}:host([pending]) #button .disclosure-icon,:host([pending]) #button .clear-icon{color:var(--highcontrast-select-content-color-disabled, var(--luzmo-select-icon-color-disabled, var(--select-icon-color-disabled)))}.icon{flex-shrink:0}.label{white-space:nowrap;font-size:var(--luzmo-select-font-size, var(--select-font-size));line-height:var(--luzmo-select-button-line-height, var(--select-button-line-height));font-weight:var(--luzmo-select-font-weight, var(--select-font-weight));text-overflow:ellipsis;text-align:start;flex:auto;overflow:hidden}.label.placeholder{font-weight:var(--luzmo-select-placeholder-font-weight, var(--select-font-weight));font-style:var(--luzmo-select-placeholder-font-style, var(--select-placeholder-font-style));transition:color var(--luzmo-select-animation-duration, var(--select-animation-duration)) ease-in-out;color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-default, var(--select-font-color-default)))}.label.placeholder:active{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-active, var(--select-font-color-active)))}.clear-icon,.disclosure-icon{vertical-align:top;transition:color var(--luzmo-select-animation-duration, var(--select-animation-duration)) ease-out;color:var(--highcontrast-select-content-color-default, var(--luzmo-select-icon-color-default, var(--select-icon-color-default)));flex-shrink:0;display:inline-block;position:relative}.disclosure-icon{margin-inline-start:var(--luzmo-select-spacing-icon-to-disclosure-icon, var(--select-spacing-icon-to-disclosure-icon))}.clear-icon{margin-inline-start:var(--luzmo-select-spacing-icon-to-clear-icon, var(--select-spacing-icon-to-clear-icon))}.disclosure-icon:active{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-icon-color-active, var(--select-icon-color-active)))}luzmo-progress-circle,.validation-icon{margin-inline-start:var(--luzmo-select-spacing-text-to-icon, var(--select-spacing-text-to-icon))}.icon-container{display:flex;position:relative;height:100%;align-items:center;font-size:var(--luzmo-select-disclosure-icon-size, var(--select-disclosure-icon-size))}.icon-container.disclosure-icon{margin-inline-end:0}.label~.disclosure-icon,.label~.clear-icon{margin-inline-start:var(--luzmo-select-spacing-text-to-icon, var(--select-spacing-text-to-icon))}:host([quiet]) #button{inline-size:auto;min-inline-size:0;padding-inline:var(--luzmo-select-spacing-edge-to-text-quiet, var(--select-spacing-edge-to-text-quiet));color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-default, var(--select-font-color-default)));background-color:initial;background-color:var(--highcontrast-select-background-color, transparent);border:none;border-radius:0;box-shadow:none;margin-block-start:calc(var(--luzmo-select-spacing-label-to-select-quiet, var(--select-spacing-label-to-select-quiet)) + 1px)}:host([quiet]) #button.label-inline{margin-block-start:0}:host([quiet]) #button .disclosure-icon{margin-inline-end:var(--luzmo-select-spacing-edge-to-disclosure-icon-quiet, var(--select-spacing-edge-to-disclosure-icon-quiet))}:host([quiet]) #button:after{block-size:auto;inline-size:auto;border:none}@media (hover: hover){#button:hover{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-hover, var(--select-font-color-hover)));background-color:var(--highcontrast-select-background-color, var(--luzmo-select-background-color-hover, var(--select-background-color-hover)));border-color:var(--highcontrast-select-border-color-hover, var(--luzmo-select-border-color-hover, var(--select-border-color-hover)))}#button:hover .disclosure-icon,#button:hover .clear-icon{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-icon-color-hover, var(--select-icon-color-hover)))}#button:hover .clear-icon:hover{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-clear-icon-color-hover, var(--select-icon-color-focus)))}:host([open]):not([quiet]) #button:not(:disabled,.is-disabled):hover{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-hover-open, var(--select-font-color-hover-open)));background-color:var(--highcontrast-select-background-color, var(--luzmo-select-background-color-hover-open, var(--select-background-color-hover-open)));border-color:var(--highcontrast-select-border-color-hover, var(--luzmo-select-border-color-hover-open, var(--select-border-color-hover-open)))}:host([open]) #button:not(:disabled,.is-disabled):hover .disclosure-icon,:host([open]) #button:not(:disabled,.is-disabled):hover .clear-icon{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-icon-color-hover-open, var(--select-icon-color-hover-open)))}:host([invalid]) #button:not(:disabled,.is-disabled):hover{border-color:var(--highcontrast-select-border-color-hover, var(--luzmo-select-border-color-error-hover, var(--select-border-color-error-hover)))}:host([invalid][open]) #button:not(:disabled,.is-disabled):hover{border-color:var(--highcontrast-select-border-color-hover, var(--luzmo-select-border-color-error-hover-open, var(--select-border-color-error-hover-open)))}.label.placeholder:hover{color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-hover, var(--select-font-color-hover)))}:host([quiet]) #button:hover{background-color:initial;background-color:var(--highcontrast-select-background-color, transparent)!important}}:host([quiet]) #button:focus-visible{background-color:initial;background-color:var(--highcontrast-select-background-color, transparent)}:host([quiet]) #button:focus-visible:after{box-shadow:0 var(--luzmo-select-focus-indicator-width, var(--select-focus-indicator-width)) 0 0 var(--highcontrast-select-focus-indicator-color, var(--luzmo-select-focus-indicator-color, var(--select-focus-indicator-color)));margin:calc((var(--luzmo-select-focus-indicator-gap, var(--select-focus-indicator-gap)) + var(--luzmo-select-button-border-width, var(--select-button-border-width))) * -1) 0;border:none;border-radius:0}:host([quiet][open]) #button,:host([quiet][disabled]) #button#button,:host([quiet]) #button#button:disabled,:host([quiet]) #button:active{background-color:initial;background-color:var(--highcontrast-select-background-color, transparent)}.label-inline{vertical-align:top;display:inline-flex}:host([disabled]) #button,#button:disabled{cursor:default;background-color:var(--highcontrast-select-background-color, var(--luzmo-select-background-color-disabled, var(--select-background-color-disabled)));border-color:#0000;border-color:var(--highcontrast-select-border-color-disabled, transparent);color:var(--highcontrast-select-content-color-disabled, var(--luzmo-select-font-color-disabled, var(--select-font-color-disabled)))}:host([disabled]) #button .icon,:host([disabled]) #button .disclosure-icon,:host([disabled]) #button .clear-icon,:host([disabled]) #button .validation-icon,#button:disabled .icon,#button:disabled .disclosure-icon,#button:disabled .clear-icon,#button:disabled .validation-icon{color:var(--highcontrast-select-content-color-disabled, var(--luzmo-select-icon-color-disabled, var(--select-icon-color-disabled)))}:host([disabled]) #button .label.placeholder,#button:disabled .label.placeholder{color:var(--highcontrast-select-content-color-disabled, var(--luzmo-select-font-color-disabled, var(--select-font-color-disabled)))}#popover{max-width:var(--luzmo-select-popover-max-width, var(--select-popover-max-width));min-width:var(--luzmo-select-popover-min-width, var(--select-popover-min-width));width:var(--luzmo-select-popover-width, var(--select-popover-width))}#search-container{flex:0 0 auto;display:flex;position:relative;border-bottom:var(--luzmo-select-search-container-border-bottom-width, var(--select-search-container-border-bottom-width)) solid var(--luzmo-select-search-container-border-bottom-color, var(--select-search-container-border-bottom-color))}#search-icon{position:absolute;left:var(--luzmo-select-spacing-edge-to-text, var(--select-spacing-edge-to-text));color:var(--luzmo-select-search-icon-color, var(--select-search-icon-color));top:0;bottom:0;pointer-events:none}#search:focus-within+#search-icon,#search:focus+#search-icon{color:var(--luzmo-select-search-icon-color-focus, var(--select-search-icon-color-focus))}#search{width:100%;box-sizing:border-box;color:var(--luzmo-select-search-color, var(--select-search-color));height:var(--luzmo-select-button-block-size, var(--select-button-block-size));padding-left:calc(var(--luzmo-select-spacing-edge-to-text, var(--select-spacing-edge-to-text)) + var(--luzmo-select-spacing-search-icon-to-text, var(--select-spacing-search-icon-to-text)) + var(--luzmo-select-font-size, var(--select-font-size)));padding-right:var(--luzmo-select-spacing-edge-to-text, var(--select-spacing-edge-to-text));font-size:var(--luzmo-select-font-size, var(--select-font-size));line-height:var(--luzmo-select-button-line-height, var(--select-button-line-height));font-weight:var(--luzmo-select-font-weight, var(--select-font-weight));border:var(--luzmo-select-search-input-border-bottom-width, var(--select-search-input-border-bottom-width)) solid var(--luzmo-select-search-input-border-bottom-color, var(--select-search-input-border-bottom-color));outline:none}#no-results{color:var(--luzmo-select-no-results-color, var(--select-no-results-color));font-style:var(--luzmo-select-no-results-font-style, var(--select-no-results-font-style));height:var(--luzmo-select-no-results-height, var(--select-no-results-height));padding-inline:var(--luzmo-select-no-results-spacing-edge-to-text, var(--select-no-results-spacing-edge-to-text));display:flex;align-items:center}:host{--select-popover-max-width: 300px;--select-popover-min-width: 160px;--select-font-family: var(--luzmo-font-family);--select-font-size: var(--luzmo-font-size);--select-spacing-search-icon-to-text: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--select-search-icon-color: var(--luzmo-disabled-color);--select-search-icon-color-focus: var(--luzmo-font-color);--select-search-color: var(--luzmo-font-color);--select-search-container-border-bottom-width: var(--luzmo-border-width);--select-search-container-border-bottom-color: var(--luzmo-border-color);--select-search-input-border-bottom-width: var(--luzmo-border-width);--select-search-input-border-bottom-color: transparent;--select-background-color-default: var(--luzmo-background-color);--select-background-color-default-open: var(--luzmo-background-color-hover);--select-background-color-active: var(--luzmo-background-color-down);--select-background-color-hover: var(--luzmo-background-color-hover);--select-background-color-hover-open: var(--luzmo-background-color-down);--select-background-color-key-focus: var(--luzmo-background-color-down);--select-border-color-default: var(--luzmo-border-color);--select-border-color-default-open: var(--luzmo-border-color-hover);--select-border-color-hover: var(--luzmo-border-color);--select-border-color-hover-open: var(--luzmo-border-color-hover);--select-border-color-active: var(--luzmo-border-color);--select-border-color-key-focus: var(--luzmo-border-color);--select-button-border-width: var(--luzmo-border-width);--select-font-weight: var(--luzmo-font-weight);--select-placeholder-font-style: var(--luzmo-font-style);--select-button-line-height: var(--luzmo-line-height);--select-button-box-shadow: 0px 1px 3px 0px rgba(var(--luzmo-border-color-rgb), .06);--select-button-block-size: var(--luzmo-component-height);--select-button-border-radius: var(--luzmo-border-radius);--select-button-border-radius-reset: 0;--select-spacing-edge-to-text: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--select-spacing-text-to-icon: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--select-spacing-text-to-icon-inline-end: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--select-spacing-icon-to-disclosure-icon: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--select-spacing-icon-to-clear-icon: var( --select-spacing-icon-to-disclosure-icon );--select-spacing-edge-to-text-quiet: 0px;--select-spacing-label-to-select: 0px;--select-spacing-label-to-select-quiet: calc( -1 * var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--select-spacing-edge-to-disclosure-icon: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--select-spacing-edge-to-disclosure-icon-quiet: 0px;--select-animation-duration: var(--luzmo-animation-duration);--select-font-color-default: var(--luzmo-font-color);--select-font-color-default-open: var(--luzmo-font-color-hover);--select-font-color-hover: var(--luzmo-font-color-hover);--select-font-color-hover-open: var(--luzmo-font-color-down);--select-font-color-active: var(--luzmo-font-color-focus);--select-font-color-key-focus: var(--luzmo-font-color-focus);--select-icon-color-default: var(--luzmo-font-color);--select-icon-color-default-open: var(--luzmo-font-color-hover);--select-icon-color-hover: var(--luzmo-font-color-hover);--select-icon-color-hover-open: var(--luzmo-font-color-hover);--select-icon-color-active: var(--luzmo-font-color-focus);--select-icon-color-key-focus: var(--luzmo-font-color-focus);--select-border-color-error-default: var(--luzmo-negative-color);--select-border-color-error-default-open: var(--luzmo-negative-color-down);--select-border-color-error-hover: var(--luzmo-negative-color-hover);--select-border-color-error-hover-open: var(--luzmo-negative-color-down);--select-border-color-error-active: var(--luzmo-negative-color-down);--select-border-color-error-key-focus: var(--luzmo-negative-color-focus);--select-icon-color-error: var(--luzmo-negative-color);--select-background-color-disabled: var(--luzmo-background-color-disabled);--select-font-color-disabled: var(--luzmo-disabled-color);--select-icon-color-disabled: var(--luzmo-disabled-color);--select-focus-indicator-gap: var(--luzmo-indicator-gap);--select-focus-indicator-width: var(--luzmo-indicator-width);--select-focus-indicator-color: var(--luzmo-indicator-color);--select-disclosure-icon-size: var(--luzmo-font-size-s);--select-no-results-height: var(--select-button-block-size);--select-no-results-color: var(--select-font-color-disabled);--select-no-results-font-style: italic;--select-no-results-spacing-edge-to-text: var(--select-spacing-edge-to-text)}:host([size=s]){--select-button-block-size: var(--luzmo-component-height-s);--select-font-size: var(--luzmo-font-size-s);--select-popover-max-width: 280px;--select-popover-min-width: 140px;--select-spacing-search-icon-to-text: var(--luzmo-spacing-3);--select-spacing-edge-to-text: var(--luzmo-spacing-3);--select-spacing-text-to-icon: var(--luzmo-spacing-3);--select-spacing-text-to-icon-inline-end: var(--luzmo-spacing-3);--select-spacing-icon-to-disclosure-icon: var(--luzmo-spacing-3);--select-spacing-label-to-select-quiet: calc(-1 * var(--luzmo-spacing-3));--select-spacing-edge-to-disclosure-icon: var(--luzmo-spacing-3);--select-disclosure-icon-size: var(--luzmo-font-size-s)}:host([size=l]){--select-button-block-size: var(--luzmo-component-height-l);--select-font-size: var(--luzmo-font-size-l);--select-popover-max-width: 360px;--select-popover-min-width: 220px;--select-spacing-search-icon-to-text: var(--luzmo-spacing-4);--select-spacing-edge-to-text: var(--luzmo-spacing-4);--select-spacing-text-to-icon: var(--luzmo-spacing-4);--select-spacing-text-to-icon-inline-end: var(--luzmo-spacing-4);--select-spacing-icon-to-disclosure-icon: var(--luzmo-spacing-4);--select-spacing-label-to-select-quiet: calc(-1 * var(--luzmo-spacing-4));--select-spacing-edge-to-disclosure-icon: var(--luzmo-spacing-4);--select-disclosure-icon-size: var(--luzmo-font-size)}:host([size=xl]){--select-button-block-size: var(--luzmo-component-height-xl);--select-font-size: var(--luzmo-font-size-xl);--select-popover-max-width: 400px;--select-popover-min-width: 260px;--select-spacing-search-icon-to-text: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--select-spacing-edge-to-text: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--select-spacing-text-to-icon: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--select-spacing-text-to-icon-inline-end: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--select-spacing-icon-to-disclosure-icon: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--select-spacing-label-to-select-quiet: calc( -1 * var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--select-spacing-edge-to-disclosure-icon: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--select-disclosure-icon-size: var(--luzmo-font-size-l)}:host([variant=highlight]) ::slotted(luzmo-option[selected]){--option-highlight-label-content-color: var(--luzmo-primary-inverse-color);--option-label-icon-color-default: var(--luzmo-primary-inverse-color);--menu-checkmark-display: var(--menu-checkmark-display-hidden);padding-inline-start:var(--luzmo-option-label-inline-edge-to-content, var(--option-label-inline-edge-to-content));background-color:var(--luzmo-option-highlight-label-background-color, var(--option-highlight-label-background-color, var(--luzmo-border-color)))}:host{display:inline-flex;vertical-align:top;max-inline-size:100%;inline-size:var(--luzmo-select-inline-size, var(--select-inline-size));min-inline-size:calc(var(--select-minimum-width-multiplier) * var(--luzmo-select-block-size, var(--select-block-size)))}:host([quiet]){width:auto;min-width:0}:host([disabled]){pointer-events:none}#button{width:100%;min-width:100%;max-width:100%}#icon:not([hidden]){display:inline-flex}:host([readonly]) #button{-webkit-user-select:inherit;user-select:inherit}.validation-icon{flex-shrink:0}luzmo-overlay{pointer-events:none}luzmo-options{pointer-events:initial}:host>#no-results,:host>luzmo-options{display:none}:host([focused]:not([quiet])) #button #label.placeholder{color:var(--select-placeholder-text-color-key-focus, var(--alias-placeholder-text-color-hover))}.visually-hidden{border:0;clip:rect(0,0,0,0);clip-path:inset(50%);height:1px;margin:0 -1px -1px 0;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}luzmo-overlay:not(:defined){display:none}#button.remove-focus-ring-safari-hack:focus-visible{background-color:var(--highcontrast-select-background-color, var(--luzmo-select-background-color-default, var(--select-background-color-default)));border-color:var(--highcontrast-select-border-color-default, var(--luzmo-select-border-color-default, var(--select-border-color-default)));color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-default, var(--select-font-color-default)))}#button.remove-focus-ring-safari-hack:after{border:none}#button.remove-focus-ring-safari-hack:focus-visible:after{box-shadow:none}#button.remove-focus-ring-safari-hack:active{background-color:var(--highcontrast-select-background-color, var(--luzmo-select-background-color-default, var(--select-background-color-default)));border-color:var(--highcontrast-select-border-color-default, var(--luzmo-select-border-color-default, var(--select-border-color-default)));color:var(--highcontrast-select-content-color-default, var(--luzmo-select-font-color-default, var(--select-font-color-default)))}';var W=Object.defineProperty,i=(d,e,t,s)=>{for(var a=void 0,r=d.length-1,c;r>=0;r--)(c=d[r])&&(a=c(e,t,a)||a);return a&&W(e,t,a),a};const U=()=>o.x`
   <div class="disclosure-icon icon">
-    ${h.p3(h.T,{className:"indicator"})}
+    ${h.O2(h.T,{className:"indicator"})}
   </div>
 `,H=()=>o.x`
   <div class="icon-container validation-icon icon">
-    ${h.p3(h.$)}
+    ${h.O2(h.I)}
   </div>
 `,j=()=>o.x`
   <div class="icon-container search-icon icon" id="search-icon">
-    ${h.p3(h.h2)}
+    ${h.O2(h.z2)}
   </div>
-`,M="select-option-menu",G=20;class l extends R.SizedMixin(F.Focusable,{noDefaultSize:!0}){constructor(){super(),this.disabled=!1,this.focused=!1,this.variant="checkmarks",this.emphasized=!1,this.invalid=!1,this.search="auto",this.noWrap=!1,this.retrieving=!1,this.pending=!1,this.clearable=!1,this.pendingLabel="Pending",this.searchLabel="Search",this.noResultsLabel="No results",this.noDataLabel="No data",this.multipleLabelTemplate="Selected {count} items",this.open=!1,this.readonly=!1,this.placement="bottom-end",this.quiet=!1,this.value=[],this.options=[],this.selects="multiple",this.dependencyManager=new V.DependencyManagerController(this),this.isMobile=new f.MatchMediaController(this,f.IS_MOBILE),this.listRole="listbox",this.itemRole="option",this.hasRenderedOverlay=!1,this._selfManageFocusElement=!1,this.selectionPromise=Promise.resolve(),this.enterKeydownOn=null,this._selectedOptions=[],this.handleSlottableRequest=e=>{},this.renderAngleIcon=()=>U(),this.renderAlertIcon=()=>H(),this.handleEnterKeydown=e=>{if(e.code==="Enter"){if(this.enterKeydownOn){e.preventDefault();return}this.enterKeydownOn=e.target,this.addEventListener("keyup",t=>{t.code==="Enter"&&(this.enterKeydownOn=null)},{once:!0})}},this.clearValue=e=>{e.preventDefault(),e.stopPropagation(),this.value=[],this.strategy&&(this.strategy.preventNextToggle="no"),this.open=!1,this.strategy&&(this.strategy.open=!1),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,cancelable:!0,composed:!0,detail:{value:this.value??[]}}))},this.handleKeydown=e=>{var s,a;const{code:t}=e;if(["Delete","Backspace"].includes(t)){this.clearValue(e);return}if(this.focused=!0,!(!t.startsWith("Arrow")||this.readonly||this.pending)){if(t==="ArrowUp"||t==="ArrowDown"){this.toggle(!0),e.preventDefault();return}if(e.preventDefault(),this.selects==="single"){const r=t==="ArrowRight"?1:-1,c=this.options.findIndex(u=>{var p,b,g;return((p=u==null?void 0:u.value)==null?void 0:p.toString())===((g=(b=this.value)==null?void 0:b[0])==null?void 0:g.toString())});let n=(this.options.length+c+r)%this.options.length,v=this.options.length;for(;(a=(s=this.options)==null?void 0:s[n])!=null&&a.disabled&&v;)v-=1,n=(this.options.length+n+r)%this.options.length;this.value=[this.options[n].value],this.dispatchEvent(new CustomEvent("change",{bubbles:!0,cancelable:!0,composed:!0,detail:{value:this.value??[]}}))}}},this.pendingStateController=new A.PendingStateController(this)}static get styles(){return[o.r(N)]}get selfManageFocusElement(){return this._selfManageFocusElement}get focusElement(){var e;return this.open?this.search==="on"||this.search==="auto"&&((e=this.options)==null?void 0:e.length)>G?this.searchInput:this.optionsMenu:this.button}forceFocusVisible(){this.disabled||(this.focused=!0)}click(){this.disabled||this.toggle()}handleButtonBlur(){this.focused=!1}focus(e){super.focus(e),!this.disabled&&this.focusElement&&(this.focused=this.hasVisibleFocusInTree())}handleHelperFocus(){this.focused=!0,this.button.focus()}handleChange(e){var t;this.value=((t=e==null?void 0:e.detail)==null?void 0:t.value)??[],this.strategy&&(this.strategy.preventNextToggle="no"),e.stopPropagation(),(!e.cancelable||this.selects==="single")&&(this.open=!1,this.strategy&&(this.strategy.open=!1)),e.preventDefault(),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,cancelable:!0,composed:!0,detail:{value:this.value??[]}}))}handleButtonFocus(e){var t;(t=this.strategy)==null||t.handleButtonFocus(e)}toggle(e){this.readonly||this.pending||(this.open=e===void 0?!this.open:e,this.strategy&&(this.strategy.open=this.open),this._selfManageFocusElement=this.open)}close(){this.readonly||this.strategy&&(this.open=!1,this.strategy.open=!1)}bindEvents(){var e;(e=this.strategy)==null||e.abort(),this.strategy=this.isMobile.matches?new f.strategies.mobile(this.button,this):new f.strategies.desktop(this.button,this)}connectedCallback(){super.connectedCallback()}disconnectedCallback(){var e;this.close(),(e=this.strategy)==null||e.releaseDescription(),super.disconnectedCallback()}handleTooltipSlotchange(e){this.tooltipEl=e.target.assignedElements()[0]}get labelTemplate(){var v,u,p,b,g,x,w,k,S,$,E,q,I,C,_;const e=((v=this._selectedOptions)==null?void 0:v.length)===1&&((u=this._selectedOptions[0])==null?void 0:u.icon),t=o.x`<div
+`,M="select-option-menu",G=20;class l extends R.SizedMixin(F.Focusable,{noDefaultSize:!0}){constructor(){super(),this.disabled=!1,this.focused=!1,this.variant="checkmarks",this.emphasized=!1,this.invalid=!1,this.search="auto",this.noWrap=!1,this.retrieving=!1,this.pending=!1,this.clearable=!1,this.pendingLabel="Pending",this.searchLabel="Search",this.noResultsLabel="No results",this.noDataLabel="No data",this.multipleLabelTemplate="Selected {count} items",this.open=!1,this.readonly=!1,this.placement="bottom-end",this.quiet=!1,this.value=[],this.options=[],this.selects="multiple",this.dependencyManager=new V.DependencyManagerController(this),this.isMobile=new f.MatchMediaController(this,f.IS_MOBILE),this.listRole="listbox",this.itemRole="option",this.hasRenderedOverlay=!1,this._selfManageFocusElement=!1,this.selectionPromise=Promise.resolve(),this.enterKeydownOn=null,this._selectedOptions=[],this.handleSlottableRequest=e=>{},this.renderAngleIcon=()=>U(),this.renderAlertIcon=()=>H(),this.handleEnterKeydown=e=>{if(e.code==="Enter"){if(this.enterKeydownOn){e.preventDefault();return}this.enterKeydownOn=e.target,this.addEventListener("keyup",t=>{t.code==="Enter"&&(this.enterKeydownOn=null)},{once:!0})}},this.clearValue=e=>{e.preventDefault(),e.stopPropagation(),this.value=[],this.strategy&&(this.strategy.preventNextToggle="no"),this.open=!1,this.strategy&&(this.strategy.open=!1),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,cancelable:!0,composed:!0,detail:{value:this.value??[]}}))},this.handleKeydown=e=>{var s,a;const{code:t}=e;if(["Delete","Backspace"].includes(t)){this.clearValue(e);return}if(this.focused=!0,!(!t.startsWith("Arrow")||this.readonly||this.pending)){if(t==="ArrowUp"||t==="ArrowDown"){this.toggle(!0),e.preventDefault();return}if(e.preventDefault(),this.selects==="single"){const r=t==="ArrowRight"?1:-1,c=this.options.findIndex(u=>{var p,b,g;return((p=u==null?void 0:u.value)==null?void 0:p.toString())===((g=(b=this.value)==null?void 0:b[0])==null?void 0:g.toString())});let n=(this.options.length+c+r)%this.options.length,v=this.options.length;for(;(a=(s=this.options)==null?void 0:s[n])!=null&&a.disabled&&v;)v-=1,n=(this.options.length+n+r)%this.options.length;this.value=[this.options[n].value],this.dispatchEvent(new CustomEvent("change",{bubbles:!0,cancelable:!0,composed:!0,detail:{value:this.value??[]}}))}}},this.pendingStateController=new A.PendingStateController(this)}static get styles(){return[o.r(N)]}get selfManageFocusElement(){return this._selfManageFocusElement}get focusElement(){var e;return this.open?this.search==="on"||this.search==="auto"&&((e=this.options)==null?void 0:e.length)>G?this.searchInput:this.optionsMenu:this.button}forceFocusVisible(){this.disabled||(this.focused=!0)}click(){this.disabled||this.toggle()}handleButtonBlur(){this.focused=!1}focus(e){super.focus(e),!this.disabled&&this.focusElement&&(this.focused=this.hasVisibleFocusInTree())}handleHelperFocus(){this.focused=!0,this.button.focus()}handleChange(e){var t;this.value=((t=e==null?void 0:e.detail)==null?void 0:t.value)??[],this.strategy&&(this.strategy.preventNextToggle="no"),e.stopPropagation(),(!e.cancelable||this.selects==="single")&&(this.open=!1,this.strategy&&(this.strategy.open=!1)),e.preventDefault(),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,cancelable:!0,composed:!0,detail:{value:this.value??[]}}))}handleButtonFocus(e){var t;(t=this.strategy)==null||t.handleButtonFocus(e)}toggle(e){this.readonly||this.pending||(this.open=e===void 0?!this.open:e,this.strategy&&(this.strategy.open=this.open),this._selfManageFocusElement=this.open)}close(){this.readonly||this.strategy&&(this.open=!1,this.strategy.open=!1)}bindEvents(){var e;(e=this.strategy)==null||e.abort(),this.strategy=this.isMobile.matches?new f.strategies.mobile(this.button,this):new f.strategies.desktop(this.button,this)}connectedCallback(){super.connectedCallback()}disconnectedCallback(){var e;this.close(),(e=this.strategy)==null||e.releaseDescription(),super.disconnectedCallback()}handleTooltipSlotchange(e){this.tooltipEl=e.target.assignedElements()[0]}get labelTemplate(){var v,u,p,b,g,x,w,k,S,$,E,q,I,C,O;const e=((v=this._selectedOptions)==null?void 0:v.length)===1&&((u=this._selectedOptions[0])==null?void 0:u.icon),t=o.x`<div
       id="icon"
       ?hidden=${typeof this.icons=="string"||((p=this.value)==null?void 0:p.length)>1||!e}
     >
-      ${e?h.p3(this._selectedOptions[0].icon):o.E}
-    </div>`,s=L=>L.replaceAll(/{([^}]+)}/g,(P,B)=>{var O;return B==="count"?String((O=this.value)==null?void 0:O.length):P}),a={"visually-hidden":this.icons==="only"&&((b=this.value)==null?void 0:b.length)>0,placeholder:!((g=this.value)!=null&&g.length),label:!0};let r;(x=this.value)!=null&&x.length?r=this.value.length===1?o.x`<span
+      ${e?h.O2(this._selectedOptions[0].icon):o.E}
+    </div>`,s=L=>L.replaceAll(/{([^}]+)}/g,(P,B)=>{var _;return B==="count"?String((_=this.value)==null?void 0:_.length):P}),a={"visually-hidden":this.icons==="only"&&((b=this.value)==null?void 0:b.length)>0,placeholder:!((g=this.value)!=null&&g.length),label:!0};let r;(x=this.value)!=null&&x.length?r=this.value.length===1?o.x`<span
               >${((k=(w=this._selectedOptions)==null?void 0:w[0])==null?void 0:k.shortLabel)??(($=(S=this._selectedOptions)==null?void 0:S[0])==null?void 0:$.label)??((E=this.value)==null?void 0:E[0])}</span
             >`:o.x`<span
               >${s(this.multipleLabelTemplate)}</span
@@ -47,7 +47,7 @@
           </div>
         `:o.x` <span hidden id="applied-label">${this.label}</span> `,n=()=>o.x`
       <div class="icon-container clear-icon icon" @click=${this.clearValue}>
-        ${h.p3(h.x)}
+        ${h.O2(h.x)}
       </div>
     `;return[o.x`
         ${((I=this.value)==null?void 0:I.length)===1?t:o.E}
@@ -60,7 +60,7 @@
         ${c}
         ${this.invalid&&!this.pending?o.x` ${this.renderAlertIcon()} `:o.E}
         ${this.pendingStateController.renderPendingState()}
-        ${this.clearable&&!this.readonly&&((_=this.value)==null?void 0:_.length)>0?n():o.E}
+        ${this.clearable&&!this.readonly&&((O=this.value)==null?void 0:O.length)>0?n():o.E}
         ${this.readonly?o.E:this.renderAngleIcon()}
         <slot
           aria-hidden="true"

package/components/select/index.js

@@ -16,7 +16,7 @@
  * SOFTWARE.
  * */
 import { VIRTUALIZE_AS_OF_NUM_ITEMS as A } from "../options/index.js";
-import { p as f, x as V, T as R, $ as N, h as K } from "../luzmo-icons-NEyaMpEM.js";
+import { O as f, x as V, T as R, I as N, z as K } from "../luzmo-icons-DbwDQtuO.js";
 import { r as U, E as v, x as n, B as W, n as c } from "../base-WsynuqaS.js";
 import { r as x } from "../state-Deh-vKYE.js";
 import { e as z } from "../query-D_KR_GUc.js";

package/components/swatch/index.cjs

@@ -15,7 +15,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("../luzmo-icons-D47EGj-3.cjs"),r=require("../base-CBCg3yyw.cjs"),w=require("../if-defined-C9YGdo33.cjs"),b=require("../when-CDZyJPvd.cjs"),g=require("../focusable-EbipgXRh.cjs"),p=require("../sized-mixin-CPxE5C96.cjs"),v=require("../mutation-controller-DkOMCW-c.cjs"),m=require("../query-assigned-elements-DsKsfk7G.cjs"),z=require("../roving-tabindex-By_fCy_e.cjs"),x='@media (forced-colors: active){:host{--highcontrast-swatch-disabled-icon-color: GrayText;--highcontrast-swatch-focus-indicator-color: ButtonText;--highcontrast-swatch-background-color-selected: Background;--highcontrast-swatch-border-color-selected: Highlight;--highcontrast-swatch-border-color: ButtonText;--highcontrast-swatch-fill-foreground-color: ButtonText}.fill{forced-color-adjust:none}:host([disabled]){--highcontrast-swatch-border-color: GrayText}}:host{box-sizing:border-box;inline-size:var(--luzmo-swatch-size, var(--swatch-size));block-size:var(--luzmo-swatch-size, var(--swatch-size));-webkit-user-select:none;user-select:none;outline:none;justify-content:center;align-items:center;display:flex;position:relative}.disabled-icon{inline-size:var(--luzmo-swatch-disabled-icon-size, var(--swatch-disabled-icon-size));block-size:var(--luzmo-swatch-disabled-icon-size, var(--swatch-disabled-icon-size))}:host,:host:before{border-radius:var(--luzmo-swatch-border-radius, var(--swatch-border-radius))}:host([selected]){background-color:var(--highcontrast-swatch-background-color-selected, var(--luzmo-swatch-inner-border-color-selected, var(--swatch-inner-border-color-selected)))}:host([selected]) .fill:before{box-shadow:none;border-radius:0}:host([selected]):before{opacity:1}:host .is-image .fill:before{background-color:initial}:host([mixed-value]) .fill{background:none;background:var(--picked-color, transparent)}:host([mixed-value]) .mixed-value-icon{color:var(--swatch-dash-icon-color);display:block}:host([nothing]) .fill{background-color:initial;background-color:var(--picked-color, transparent);background-image:none}:host([nothing]) .fill:after{inline-size:var(--luzmo-swatch-slash-thickness, var(--swatch-slash-thickness));content:"";block-size:200%;background:var(--highcontrast-swatch-fill-foreground-color, var(--luzmo-swatch-slash-icon-color, var(--swatch-slash-icon-color)));position:absolute;transform:rotate(-45deg)}:host([nothing][shape=rectangle]) .fill:after{transform:rotate(-25deg)}:host([disabled]) .disabled-icon{display:block}:host:before{content:"";border-width:var(--luzmo-swatch-border-thickness-selected, var(--swatch-border-thickness-selected));border-style:solid;border-color:var(--highcontrast-swatch-border-color-selected, var(--luzmo-swatch-border-color-selected, var(--swatch-border-color-selected)));opacity:0;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0}:host:after{content:"";inset:calc(var(--luzmo-swatch-focus-indicator-gap, var(--swatch-focus-indicator-gap)) * -2);opacity:0;border-width:var(--luzmo-swatch-focus-indicator-width, var(--swatch-focus-indicator-width));border-style:solid;border-color:var(--highcontrast-swatch-focus-indicator-color, var(--luzmo-swatch-focus-indicator-color, var(--swatch-focus-indicator-color)));border-radius:var(--luzmo-swatch-focus-indicator-border-radius, var(--swatch-focus-indicator-border-radius));transition:opacity var(--luzmo-animation-duration) ease-in-out;position:absolute}:host(:focus-visible):after{opacity:1}.fill{inline-size:100%;block-size:100%;box-sizing:border-box;border-radius:var(--luzmo-swatch-border-radius, var(--swatch-border-radius));justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.fill:before{content:"";z-index:0;box-sizing:border-box;box-shadow:inset 0 0 0 var(--luzmo-swatch-border-thickness, var(--swatch-border-thickness)) var(--highcontrast-swatch-border-color, var(--luzmo-swatch-border-color, var(--swatch-border-color)));border-radius:var(--luzmo-swatch-border-radius, var(--swatch-border-radius));position:absolute;top:0;right:0;bottom:0;left:0}:host([border=none]) .fill:before,.fill:before{background-color:initial;background-color:var(--picked-color, transparent)}:host([border=none]) .fill:before{box-shadow:none}.mixed-value-icon{pointer-events:none;color:#0000;color:var(--picked-color, transparent);display:none}.disabled-icon{z-index:1;pointer-events:none;color:var(--highcontrast-swatch-disabled-icon-color, var(--luzmo-swatch-disabled-icon-color, var(--swatch-disabled-icon-color)));stroke:var(--highcontrast-swatch-disabled-icon-color, var(--luzmo-swatch-disabled-icon-color, var(--swatch-disabled-icon-color)));display:none;position:relative}.disabled-icon path:first-child{fill:var(--highcontrast-swatch-disabled-icon-color, var(--luzmo-swatch-disabled-icon-color, var(--swatch-disabled-icon-color)))}.disabled-icon path:last-child{fill:var(--luzmo-swatch-icon-border-color, var(--swatch-icon-border-color))}:host([shape=rectangle]){inline-size:calc(var(--luzmo-swatch-size, var(--swatch-size)) * 2)}:host([rounding=none]),:host([rounding=none]) .fill,:host([rounding=none]) .fill:before,:host([rounding=none][selected]) .fill,:host([rounding=none][selected]) .fill:before,:host([rounding=none]):after,:host([rounding=none]):before{border-radius:0}:host([rounding=full][selected]:not([shape=rectangle])) .fill,:host([rounding=full][selected]:not([shape=rectangle])) .fill:before,:host([rounding=full]:not([shape=rectangle])),:host([rounding=full]:not([shape=rectangle])) .fill,:host([rounding=full]:not([shape=rectangle])) .fill:before,:host([rounding=full]:not([shape=rectangle])):after,:host([rounding=full]:not([shape=rectangle])):before{border-radius:100%}:host([selected]) .fill{width:calc(var(--luzmo-swatch-size, var(--swatch-size)) - 2 * var(--luzmo-swatch-border-thickness-selected, var(--swatch-border-thickness-selected)) + -2 * var(--luzmo-swatch-focus-indicator-gap, var(--swatch-focus-indicator-gap)));height:calc(var(--luzmo-swatch-size, var(--swatch-size)) - 2 * var(--luzmo-swatch-border-thickness-selected, var(--swatch-border-thickness-selected)) + -2 * var(--luzmo-swatch-focus-indicator-gap, var(--swatch-focus-indicator-gap)))}:host([selected][shape=rectangle]) .fill{width:calc(var(--luzmo-swatch-size, var(--swatch-size)) * 2 - 2 * var(--luzmo-swatch-border-thickness-selected, var(--swatch-border-thickness-selected)) + -2 * var(--luzmo-swatch-focus-indicator-gap, var(--swatch-focus-indicator-gap)))}::slotted([slot=image]){object-fit:contain;inline-size:100%;block-size:100%;transition:width var(--luzmo-animation-duration) ease-in-out,height var(--luzmo-animation-duration) ease-in-out}:host([size=xl]){--swatch-size: var(--luzmo-component-height-xl);--swatch-disabled-icon-size: 24px;--swatch-slash-thickness: 6px}:host([size=l]){--swatch-size: var(--luzmo-component-height-l);--swatch-disabled-icon-size: 20px;--swatch-slash-thickness: 5px}:host([size=s]){--swatch-size: var(--luzmo-component-height-s);--swatch-disabled-icon-size: 16px;--swatch-slash-thickness: 3px}:host([size=xs]){--swatch-size: var(--luzmo-component-height-xs);--swatch-disabled-icon-size: 16px;--swatch-slash-thickness: 2px}:host([size=xxs]){--swatch-size: var(--luzmo-component-height-xxs);--swatch-disabled-icon-size: 14px;--swatch-slash-thickness: 2px}:host{--swatch-size: var(--luzmo-component-height);--swatch-disabled-icon-size: 18px;--swatch-slash-thickness: 4px}:host{--swatch-border-radius: var(--luzmo-border-radius-s);--swatch-focus-indicator-border-radius: var(--luzmo-border-radius-s);--swatch-border-thickness: var(--luzmo-border-width);--swatch-border-thickness-selected: var(--luzmo-border-width);--swatch-focus-indicator-width: var(--luzmo-indicator-width);--swatch-focus-indicator-gap: var(--luzmo-indicator-gap);--swatch-border-color: var(--luzmo-border-color-down);--swatch-icon-border-color: var(--luzmo-border-color);--swatch-border-color-selected: var(--luzmo-border-color-full-down);--swatch-inner-border-color-selected: var(--luzmo-background-color);--swatch-disabled-icon-color: rgb(255, 255, 255);--swatch-dash-icon-color: var(--luzmo-font-color);--swatch-slash-icon-color: var(--luzmo-negative-color);--swatch-focus-indicator-color: var(--luzmo-primary)}.fill:before{background:var(--picked-color, transparent)}:host([border=none]) .fill:before{background:var(--picked-color, transparent)}:host .is-image .fill:before{background:#0000}:host .opacity-checkerboard{background:repeating-conic-gradient(var(--luzmo-swatch-checkerboard-light, rgb(255, 255, 255)) 0 25%,var(--luzmo-swatch-checkerboard-dark, rgb(230, 230, 230)) 0 50%) var(--luzmo-swatch-checkerboard-position, left top)/calc(var(--luzmo-swatch-checkerboard-size, 8px) * 2) calc(var(--luzmo-swatch-checkerboard-size, 8px) * 2)}';var y=Object.defineProperty,k=Object.getOwnPropertyDescriptor,c=(h,e,t,o)=>{for(var s=o>1?void 0:o?k(e,t):e,i=h.length-1,a;i>=0;i--)(a=h[i])&&(s=(o?a(e,t,s):a(s))||s);return o&&s&&y(e,t,s),s};class l extends p.SizedMixin(g.Focusable,{validSizes:["xxs","xs","s","m","l","xl"],noDefaultSize:!0}){constructor(){super(...arguments),this.color="",this.label="",this.mixedValue=!1,this.nothing=!1,this.role="button",this.selected=!1,this.readonly=!1,this.renderDisabled=()=>r.x`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("../luzmo-icons-DletXGWU.cjs"),r=require("../base-CBCg3yyw.cjs"),w=require("../if-defined-C9YGdo33.cjs"),b=require("../when-CDZyJPvd.cjs"),g=require("../focusable-EbipgXRh.cjs"),p=require("../sized-mixin-CPxE5C96.cjs"),v=require("../mutation-controller-DkOMCW-c.cjs"),m=require("../query-assigned-elements-DsKsfk7G.cjs"),z=require("../roving-tabindex-By_fCy_e.cjs"),x='@media (forced-colors: active){:host{--highcontrast-swatch-disabled-icon-color: GrayText;--highcontrast-swatch-focus-indicator-color: ButtonText;--highcontrast-swatch-background-color-selected: Background;--highcontrast-swatch-border-color-selected: Highlight;--highcontrast-swatch-border-color: ButtonText;--highcontrast-swatch-fill-foreground-color: ButtonText}.fill{forced-color-adjust:none}:host([disabled]){--highcontrast-swatch-border-color: GrayText}}:host{box-sizing:border-box;inline-size:var(--luzmo-swatch-size, var(--swatch-size));block-size:var(--luzmo-swatch-size, var(--swatch-size));-webkit-user-select:none;user-select:none;outline:none;justify-content:center;align-items:center;display:flex;position:relative}.disabled-icon{inline-size:var(--luzmo-swatch-disabled-icon-size, var(--swatch-disabled-icon-size));block-size:var(--luzmo-swatch-disabled-icon-size, var(--swatch-disabled-icon-size))}:host,:host:before{border-radius:var(--luzmo-swatch-border-radius, var(--swatch-border-radius))}:host([selected]){background-color:var(--highcontrast-swatch-background-color-selected, var(--luzmo-swatch-inner-border-color-selected, var(--swatch-inner-border-color-selected)))}:host([selected]) .fill:before{box-shadow:none;border-radius:0}:host([selected]):before{opacity:1}:host .is-image .fill:before{background-color:initial}:host([mixed-value]) .fill{background:none;background:var(--picked-color, transparent)}:host([mixed-value]) .mixed-value-icon{color:var(--swatch-dash-icon-color);display:block}:host([nothing]) .fill{background-color:initial;background-color:var(--picked-color, transparent);background-image:none}:host([nothing]) .fill:after{inline-size:var(--luzmo-swatch-slash-thickness, var(--swatch-slash-thickness));content:"";block-size:200%;background:var(--highcontrast-swatch-fill-foreground-color, var(--luzmo-swatch-slash-icon-color, var(--swatch-slash-icon-color)));position:absolute;transform:rotate(-45deg)}:host([nothing][shape=rectangle]) .fill:after{transform:rotate(-25deg)}:host([disabled]) .disabled-icon{display:block}:host:before{content:"";border-width:var(--luzmo-swatch-border-thickness-selected, var(--swatch-border-thickness-selected));border-style:solid;border-color:var(--highcontrast-swatch-border-color-selected, var(--luzmo-swatch-border-color-selected, var(--swatch-border-color-selected)));opacity:0;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0}:host:after{content:"";inset:calc(var(--luzmo-swatch-focus-indicator-gap, var(--swatch-focus-indicator-gap)) * -2);opacity:0;border-width:var(--luzmo-swatch-focus-indicator-width, var(--swatch-focus-indicator-width));border-style:solid;border-color:var(--highcontrast-swatch-focus-indicator-color, var(--luzmo-swatch-focus-indicator-color, var(--swatch-focus-indicator-color)));border-radius:var(--luzmo-swatch-focus-indicator-border-radius, var(--swatch-focus-indicator-border-radius));transition:opacity var(--luzmo-animation-duration) ease-in-out;position:absolute}:host(:focus-visible):after{opacity:1}.fill{inline-size:100%;block-size:100%;box-sizing:border-box;border-radius:var(--luzmo-swatch-border-radius, var(--swatch-border-radius));justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.fill:before{content:"";z-index:0;box-sizing:border-box;box-shadow:inset 0 0 0 var(--luzmo-swatch-border-thickness, var(--swatch-border-thickness)) var(--highcontrast-swatch-border-color, var(--luzmo-swatch-border-color, var(--swatch-border-color)));border-radius:var(--luzmo-swatch-border-radius, var(--swatch-border-radius));position:absolute;top:0;right:0;bottom:0;left:0}:host([border=none]) .fill:before,.fill:before{background-color:initial;background-color:var(--picked-color, transparent)}:host([border=none]) .fill:before{box-shadow:none}.mixed-value-icon{pointer-events:none;color:#0000;color:var(--picked-color, transparent);display:none}.disabled-icon{z-index:1;pointer-events:none;color:var(--highcontrast-swatch-disabled-icon-color, var(--luzmo-swatch-disabled-icon-color, var(--swatch-disabled-icon-color)));stroke:var(--highcontrast-swatch-disabled-icon-color, var(--luzmo-swatch-disabled-icon-color, var(--swatch-disabled-icon-color)));display:none;position:relative}.disabled-icon path:first-child{fill:var(--highcontrast-swatch-disabled-icon-color, var(--luzmo-swatch-disabled-icon-color, var(--swatch-disabled-icon-color)))}.disabled-icon path:last-child{fill:var(--luzmo-swatch-icon-border-color, var(--swatch-icon-border-color))}:host([shape=rectangle]){inline-size:calc(var(--luzmo-swatch-size, var(--swatch-size)) * 2)}:host([rounding=none]),:host([rounding=none]) .fill,:host([rounding=none]) .fill:before,:host([rounding=none][selected]) .fill,:host([rounding=none][selected]) .fill:before,:host([rounding=none]):after,:host([rounding=none]):before{border-radius:0}:host([rounding=full][selected]:not([shape=rectangle])) .fill,:host([rounding=full][selected]:not([shape=rectangle])) .fill:before,:host([rounding=full]:not([shape=rectangle])),:host([rounding=full]:not([shape=rectangle])) .fill,:host([rounding=full]:not([shape=rectangle])) .fill:before,:host([rounding=full]:not([shape=rectangle])):after,:host([rounding=full]:not([shape=rectangle])):before{border-radius:100%}:host([selected]) .fill{width:calc(var(--luzmo-swatch-size, var(--swatch-size)) - 2 * var(--luzmo-swatch-border-thickness-selected, var(--swatch-border-thickness-selected)) + -2 * var(--luzmo-swatch-focus-indicator-gap, var(--swatch-focus-indicator-gap)));height:calc(var(--luzmo-swatch-size, var(--swatch-size)) - 2 * var(--luzmo-swatch-border-thickness-selected, var(--swatch-border-thickness-selected)) + -2 * var(--luzmo-swatch-focus-indicator-gap, var(--swatch-focus-indicator-gap)))}:host([selected][shape=rectangle]) .fill{width:calc(var(--luzmo-swatch-size, var(--swatch-size)) * 2 - 2 * var(--luzmo-swatch-border-thickness-selected, var(--swatch-border-thickness-selected)) + -2 * var(--luzmo-swatch-focus-indicator-gap, var(--swatch-focus-indicator-gap)))}::slotted([slot=image]){object-fit:contain;inline-size:100%;block-size:100%;transition:width var(--luzmo-animation-duration) ease-in-out,height var(--luzmo-animation-duration) ease-in-out}:host([size=xl]){--swatch-size: var(--luzmo-component-height-xl);--swatch-disabled-icon-size: 24px;--swatch-slash-thickness: 6px}:host([size=l]){--swatch-size: var(--luzmo-component-height-l);--swatch-disabled-icon-size: 20px;--swatch-slash-thickness: 5px}:host([size=s]){--swatch-size: var(--luzmo-component-height-s);--swatch-disabled-icon-size: 16px;--swatch-slash-thickness: 3px}:host([size=xs]){--swatch-size: var(--luzmo-component-height-xs);--swatch-disabled-icon-size: 16px;--swatch-slash-thickness: 2px}:host([size=xxs]){--swatch-size: var(--luzmo-component-height-xxs);--swatch-disabled-icon-size: 14px;--swatch-slash-thickness: 2px}:host{--swatch-size: var(--luzmo-component-height);--swatch-disabled-icon-size: 18px;--swatch-slash-thickness: 4px}:host{--swatch-border-radius: var(--luzmo-border-radius-s);--swatch-focus-indicator-border-radius: var(--luzmo-border-radius-s);--swatch-border-thickness: var(--luzmo-border-width);--swatch-border-thickness-selected: var(--luzmo-border-width);--swatch-focus-indicator-width: var(--luzmo-indicator-width);--swatch-focus-indicator-gap: var(--luzmo-indicator-gap);--swatch-border-color: var(--luzmo-border-color-down);--swatch-icon-border-color: var(--luzmo-border-color);--swatch-border-color-selected: var(--luzmo-border-color-full-down);--swatch-inner-border-color-selected: var(--luzmo-background-color);--swatch-disabled-icon-color: rgb(255, 255, 255);--swatch-dash-icon-color: var(--luzmo-font-color);--swatch-slash-icon-color: var(--luzmo-negative-color);--swatch-focus-indicator-color: var(--luzmo-primary)}.fill:before{background:var(--picked-color, transparent)}:host([border=none]) .fill:before{background:var(--picked-color, transparent)}:host .is-image .fill:before{background:#0000}:host .opacity-checkerboard{background:repeating-conic-gradient(var(--luzmo-swatch-checkerboard-light, rgb(255, 255, 255)) 0 25%,var(--luzmo-swatch-checkerboard-dark, rgb(230, 230, 230)) 0 50%) var(--luzmo-swatch-checkerboard-position, left top)/calc(var(--luzmo-swatch-checkerboard-size, 8px) * 2) calc(var(--luzmo-swatch-checkerboard-size, 8px) * 2)}';var y=Object.defineProperty,k=Object.getOwnPropertyDescriptor,c=(h,e,t,o)=>{for(var s=o>1?void 0:o?k(e,t):e,i=h.length-1,a;i>=0;i--)(a=h[i])&&(s=(o?a(e,t,s):a(s))||s);return o&&s&&y(e,t,s),s};class l extends p.SizedMixin(g.Focusable,{validSizes:["xxs","xs","s","m","l","xl"],noDefaultSize:!0}){constructor(){super(...arguments),this.color="",this.label="",this.mixedValue=!1,this.nothing=!1,this.role="button",this.selected=!1,this.readonly=!1,this.renderDisabled=()=>r.x`
     <svg
       xmlns="http://www.w3.org/2000/svg"
       class="disabled-icon"
@@ -32,7 +32,7 @@
         fill="var(--swatch-disabled-icon-stroke-color)"
       />
     </svg>
-  `,this.renderMixedValue=()=>u.p3(u.R)}static get styles(){return[r.r(x)]}get value(){return this._value||this.color||this.label}set value(e){if(e===this._value)return;const t=this.value;this._value=e,this.requestUpdate("value",t)}get focusElement(){return this}toggle(e){this.readonly||(this.selected=e??!this.selected)}handleClick(){if(this.disabled||this.mixedValue)return;this.toggle(),this.dispatchEvent(new Event("change",{cancelable:!0,bubbles:!0}))||this.toggle()}handleKeydown(e){const{code:t}=e;switch(t){case"Space":{e.preventDefault(),this.addEventListener("keyup",this.handleKeyup);break}}}handleKeypress(e){const{code:t}=e;switch(t){case"Enter":case"NumpadEnter":{this.click();break}}}handleKeyup(e){const{code:t}=e;switch(t){case"Space":{this.removeEventListener("keyup",this.handleKeyup),this.click();break}}}render(){return r.x`
+  `,this.renderMixedValue=()=>u.O2(u.$)}static get styles(){return[r.r(x)]}get value(){return this._value||this.color||this.label}set value(e){if(e===this._value)return;const t=this.value;this._value=e,this.requestUpdate("value",t)}get focusElement(){return this}toggle(e){this.readonly||(this.selected=e??!this.selected)}handleClick(){if(this.disabled||this.mixedValue)return;this.toggle(),this.dispatchEvent(new Event("change",{cancelable:!0,bubbles:!0}))||this.toggle()}handleKeydown(e){const{code:t}=e;switch(t){case"Space":{e.preventDefault(),this.addEventListener("keyup",this.handleKeyup);break}}}handleKeypress(e){const{code:t}=e;switch(t){case"Enter":case"NumpadEnter":{this.click();break}}}handleKeyup(e){const{code:t}=e;switch(t){case"Space":{this.removeEventListener("keyup",this.handleKeyup),this.click();break}}}render(){return r.x`
       <div
         class="opacity-checkerboard fill"
         style=${w.o(this.color?`--picked-color: ${this.color}`:void 0)}

package/components/swatch/index.js

@@ -15,7 +15,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-import { p as z, R as v } from "../luzmo-icons-NEyaMpEM.js";
+import { O as z, $ as v } from "../luzmo-icons-DbwDQtuO.js";
 import { x as u, r as p, n as l, a as w } from "../base-WsynuqaS.js";
 import { o as x } from "../if-defined-DOaE2coe.js";
 import { n as b } from "../when-CDK1Tt5Y.js";
@@ -177,8 +177,8 @@ n([
   l()
 ], a.prototype, "value", 1);
 const D = ":host{justify-content:flex-start;align-items:flex-start;gap:var(--luzmo-swatch-group-spacing-regular, var(--swatch-group-spacing-regular));flex-flow:wrap;display:inline-flex}:host([density=compact]){gap:var(--luzmo-swatch-group-spacing-compact, var(--swatch-group-spacing-compact))}:host([density=spacious]){gap:var(--luzmo-swatch-group-spacing-spacious, var(--swatch-group-spacing-spacious))}:host{--swatch-group-spacing-compact: 2px;--swatch-group-spacing-regular: 4px;--swatch-group-spacing-spacious: 8px}";
-var L = Object.defineProperty, M = Object.getOwnPropertyDescriptor, h = (c, e, o, r) => {
-  for (var t = r > 1 ? void 0 : r ? M(e, o) : e, s = c.length - 1, i; s >= 0; s--)
+var L = Object.defineProperty, $ = Object.getOwnPropertyDescriptor, h = (c, e, o, r) => {
+  for (var t = r > 1 ? void 0 : r ? $(e, o) : e, s = c.length - 1, i; s >= 0; s--)
     (i = c[s]) && (t = (r ? i(e, o, t) : i(t)) || t);
   return r && t && L(e, o, t), t;
 };

package/components/tabs/index.cjs

@@ -15,7 +15,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("../base-CBCg3yyw.cjs"),L=require("../focus-visible-B0P9aY_G.cjs"),I=require("../observe-slot-presence-bc9chhsi.cjs"),E=require("../observe-slot-text-Ceb7SvYT.cjs"),y=require("../random-id-CqvckpWe.cjs"),f=require("../query-BL-TJj7K.cjs"),m=require("../class-map-Di1D_rCm.cjs"),x=require("../if-defined-C9YGdo33.cjs"),S=require("../sized-mixin-CPxE5C96.cjs"),$=require("../focusable-EbipgXRh.cjs"),q=require("../roving-tabindex-By_fCy_e.cjs"),w=require("../luzmo-icons-D47EGj-3.cjs"),A=require("../state-D8JEtYqe.cjs"),_=require("../query-assigned-elements-DsKsfk7G.cjs");require("../action-button/index.cjs");require("../icon/index.cjs");const P=':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:var(--luzmo-tabs-focus-indicator-width, var(--tabs-focus-indicator-width)) solid transparent;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)}@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)))}#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;position:relative;color:inherit}#item-label{position:relative;z-index:1}:host([selected]){color:HighlightText}:host([selected]) ::slotted([slot=icon]){color:HighlightText}:host([selected]) #item-label{color:HighlightText}}:host([vertical]){display:flex;flex-direction:column;justify-content:center;align-items:center;height:auto}: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)}';var B=Object.defineProperty,v=(l,t,o,i)=>{for(var e=void 0,a=l.length-1,r;a>=0;a--)(r=l[a])&&(e=r(t,o,e)||e);return e&&B(t,o,e),e};class u extends L.FocusVisiblePolyfillMixin(E.ObserveSlotText(I.ObserveSlotPresence(s.LuzmoElement,'[slot="icon"]'),"")){constructor(){super(...arguments),this.disabled=!1,this.label="",this.selected=!1,this.vertical=!1,this.value=""}static get styles(){return[s.r(P)]}get hasIcon(){return this.slotContentIsPresent}get hasLabel(){return!!this.label||this.slotHasContent}render(){return s.x`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("../base-CBCg3yyw.cjs"),L=require("../focus-visible-B0P9aY_G.cjs"),I=require("../observe-slot-presence-bc9chhsi.cjs"),E=require("../observe-slot-text-Ceb7SvYT.cjs"),y=require("../random-id-CqvckpWe.cjs"),f=require("../query-BL-TJj7K.cjs"),m=require("../class-map-Di1D_rCm.cjs"),x=require("../if-defined-C9YGdo33.cjs"),S=require("../sized-mixin-CPxE5C96.cjs"),$=require("../focusable-EbipgXRh.cjs"),q=require("../roving-tabindex-By_fCy_e.cjs"),w=require("../luzmo-icons-DletXGWU.cjs"),A=require("../state-D8JEtYqe.cjs"),_=require("../query-assigned-elements-DsKsfk7G.cjs");require("../action-button/index.cjs");require("../icon/index.cjs");const P=':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:var(--luzmo-tabs-focus-indicator-width, var(--tabs-focus-indicator-width)) solid transparent;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)}@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)))}#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;position:relative;color:inherit}#item-label{position:relative;z-index:1}:host([selected]){color:HighlightText}:host([selected]) ::slotted([slot=icon]){color:HighlightText}:host([selected]) #item-label{color:HighlightText}}:host([vertical]){display:flex;flex-direction:column;justify-content:center;align-items:center;height:auto}: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)}';var B=Object.defineProperty,v=(l,t,o,i)=>{for(var e=void 0,a=l.length-1,r;a>=0;a--)(r=l[a])&&(e=r(t,o,e)||e);return e&&B(t,o,e),e};class u extends L.FocusVisiblePolyfillMixin(E.ObserveSlotText(I.ObserveSlotPresence(s.LuzmoElement,'[slot="icon"]'),"")){constructor(){super(...arguments),this.disabled=!1,this.label="",this.selected=!1,this.vertical=!1,this.value=""}static get styles(){return[s.r(P)]}get hasIcon(){return this.slotContentIsPresent}get hasLabel(){return!!this.label||this.slotHasContent}render(){return s.x`
       ${this.hasIcon?s.x` <slot name="icon"></slot> `:s.E}
       <label id="item-label" ?hidden=${!this.hasLabel}>
         ${this.slotHasContent?s.E:this.label}
@@ -74,7 +74,7 @@
           tabindex="-1"
           @click=${this._handleScrollClick}
         >
-          <luzmo-icon slot="icon" .icon=${w.k}></luzmo-icon>
+          <luzmo-icon slot="icon" .icon=${w.S}></luzmo-icon>
         </luzmo-action-button>
         <luzmo-action-button
           class=${m.e({"right-scroll":!0,show:t})}
@@ -83,7 +83,7 @@
           tabindex="-1"
           @click=${this._handleScrollClick}
         >
-          <luzmo-icon slot="icon" .icon=${w.S}></luzmo-icon>
+          <luzmo-icon slot="icon" .icon=${w.k}></luzmo-icon>
         </luzmo-action-button>
         <slot
           @slotchange=${this._handleSlotChange}

package/components/tabs/index.js

@@ -26,7 +26,7 @@ import { o as k } from "../if-defined-DOaE2coe.js";
 import { S as T } from "../sized-mixin-D4ACoVUr.js";
 import { F as U } from "../focusable-BxtpnzWp.js";
 import { R as B } from "../roving-tabindex-DOg4z6ZU.js";
-import { k as F, S as O } from "../luzmo-icons-NEyaMpEM.js";
+import { S as F, k as O } from "../luzmo-icons-DbwDQtuO.js";
 import { r as R } from "../state-Deh-vKYE.js";
 import { o as D } from "../query-assigned-elements-DjfhL1cl.js";
 import "../action-button/index.js";

package/components/tags/index.cjs

@@ -15,7 +15,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../base-CBCg3yyw.cjs"),h=require("../sized-mixin-CPxE5C96.cjs");require("../clear-button-DYdeFsS8.cjs");const m=require("../query-assigned-nodes-BcKWmGzy.cjs"),z=require("../focus-visible-B0P9aY_G.cjs"),f=require("../roving-tabindex-By_fCy_e.cjs"),p=':host{border-color:var(--highcontrast-tag-border-color, var(--luzmo-tag-border-color, var(--tag-border-color)));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-corner-radius, var(--tag-corner-radius));border-width:var(--luzmo-tag-border-width, var(--tag-border-width));block-size:var(--luzmo-tag-height, var(--tag-height));box-sizing:border-box;vertical-align:bottom;max-inline-size:100%;-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;border-style:solid;outline:none;align-items:center;justify-content: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}::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{block-size:100%;box-sizing:border-box;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;display:flex;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)));overflow:hidden}:host(:is(:active,[active])){border-color:var(--highcontrast-tag-border-color-active, var(--luzmo-tag-border-color-active, var(--tag-border-color-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)))}:host([focused]),:host(:focus-visible){border-color:var(--highcontrast-tag-border-color-focus, var(--luzmo-tag-border-color-focus, var(--tag-border-color-focus)));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)))}:host([focused]):after,:host(:focus-visible):after{content:"";border-color:var(--highcontrast-tag-focus-ring-color, var(--luzmo-tag-focus-ring-color, var(--tag-focus-ring-color)));border-radius:calc(var(--luzmo-tag-corner-radius, var(--tag-corner-radius)) + var(--luzmo-tag-focus-ring-gap, var(--tag-focus-ring-gap)) + var(--luzmo-tag-border-width, var(--tag-border-width)));border-width:var(--luzmo-tag-focus-ring-thickness, var(--tag-focus-ring-thickness));pointer-events:none;border-style:solid;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)))}:host([selected]){border-color:var(--highcontrast-tag-border-color-selected, var(--luzmo-tag-border-color-selected, var(--tag-border-color-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)))}:host([selected]:is(:active,[active])){border-color:var(--highcontrast-tag-border-color-selected-active, var(--luzmo-tag-border-color-selected-active, var(--tag-border-color-selected-active)));background-color:var(--highcontrast-tag-background-color-selected-active, var(--luzmo-tag-background-color-selected-active, var(--tag-background-color-selected-active)))}:host([selected][focused]),:host([selected]:focus-visible){border-color:var(--highcontrast-tag-border-color-selected-focus, var(--luzmo-tag-border-color-selected-focus, var(--tag-border-color-selected-focus)));background-color:var(--highcontrast-tag-background-color-selected-focus, var(--luzmo-tag-background-color-selected-focus, var(--tag-background-color-selected-focus)))}:host([invalid]){border-color:var(--highcontrast-tag-border-color-invalid, var(--luzmo-tag-border-color-invalid, var(--tag-border-color-invalid)));color:var(--highcontrast-tag-content-color-invalid, var(--luzmo-tag-content-color-invalid, var(--tag-content-color-invalid)))}:host([invalid]:is(:active,[active])){border-color:var(--highcontrast-tag-border-color-invalid-active, var(--luzmo-tag-border-color-invalid-active, var(--tag-border-color-invalid-active)));color:var(--highcontrast-tag-content-color-invalid-active, var(--luzmo-tag-content-color-invalid-active, var(--tag-content-color-invalid-active)))}:host([invalid][focused]),:host([invalid]:focus-visible){border-color:var(--highcontrast-tag-border-color-invalid-focus, var(--luzmo-tag-border-color-invalid-focus, var(--tag-border-color-invalid-focus)));color:var(--highcontrast-tag-content-color-invalid-focus, var(--luzmo-tag-content-color-invalid-focus, var(--tag-content-color-invalid-focus)))}:host([invalid][selected]){border-color:var(--highcontrast-tag-border-color-invalid-selected, var(--luzmo-tag-border-color-invalid-selected, var(--tag-border-color-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)))}:host([invalid][selected]:is(:active,[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)));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)))}:host([invalid][selected][focused]),:host([invalid][selected]:focus-visible){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)));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)))}:host([emphasized]){border-color:var(--highcontrast-tag-border-color-emphasized, var(--luzmo-tag-border-color-emphasized, var(--tag-border-color-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) )}@media (hover: hover){:host(:hover){border-color:var(--highcontrast-tag-border-color-hover, var(--luzmo-tag-border-color-hover, var(--tag-border-color-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)))}:host([selected]:hover){border-color:var(--highcontrast-tag-border-color-selected-hover, var(--luzmo-tag-border-color-selected-hover, var(--tag-border-color-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)))}:host([invalid]:hover){border-color:var(--highcontrast-tag-border-color-invalid-hover, var(--luzmo-tag-border-color-invalid-hover, var(--tag-border-color-invalid-hover)));color:var(--highcontrast-tag-content-color-invalid-hover, var(--luzmo-tag-content-color-invalid-hover, var(--tag-content-color-invalid-hover)))}:host([invalid][selected]:hover){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)));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)))}:host([emphasized]:hover){border-color:var(--highcontrast-tag-border-color-emphasized-hover, var(--luzmo-tag-border-color-emphasized-hover, var(--tag-border-color-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)))}}:host([emphasized]:is(:active,[active])){border-color:var(--highcontrast-tag-border-color-emphasized-active, var(--luzmo-tag-border-color-emphasized-active, var(--tag-border-color-emphasized-active)));background-color:var(--highcontrast-tag-background-color-emphasized-active, var(--luzmo-tag-background-color-emphasized-active, var(--tag-background-color-emphasized-active)))}:host([emphasized][focused]),:host([emphasized]:focus-visible){border-color:var(--highcontrast-tag-border-color-emphasized-focus, var(--luzmo-tag-border-color-emphasized-focus, var(--tag-border-color-emphasized-focus)));background-color:var(--highcontrast-tag-background-color-emphasized-focus, var(--luzmo-tag-background-color-emphasized-focus, var(--tag-background-color-emphasized-focus)))}:host([disabled]){border-color:var(--highcontrast-tag-border-color-disabled, var(--luzmo-tag-border-color-disabled, var(--tag-border-color-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}: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{--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-corner-radius: var(--luzmo-border-radius-s);--tag-size-medium-corner-radius: var(--luzmo-border-radius);--tag-size-large-corner-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-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)}:host([size=s]){--tag-height: var(--luzmo-component-height-xs);--tag-font-size: var(--luzmo-font-size-s);--tag-icon-size: var(--luzmo-font-size-s);--tag-clear-button-spacing-inline-start: var(--luzmo-spacing-2);--tag-corner-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-font-size);--tag-clear-button-spacing-inline-start: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--tag-corner-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-font-size);--tag-clear-button-spacing-inline-start: var(--luzmo-spacing-3);--tag-corner-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-font-size-l);--tag-clear-button-spacing-inline-start: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--tag-corner-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([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{--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([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)}';var k=Object.defineProperty,v=(l,o,a,n)=>{for(var r=void 0,e=l.length-1,c;e>=0;e--)(c=l[e])&&(r=c(o,a,r)||r);return r&&k(o,a,r),r};class i extends h.SizedMixin(t.LuzmoElement,{validSizes:["s","m","l","xl"],noDefaultSize:!0}){constructor(){super(),this.deletable=!1,this.disabled=!1,this.readonly=!1,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=o=>{if(!this.deletable||this.disabled)return;const{code:a}=o;switch(a){case"Backspace":case"Space":case"Delete":{this.delete();break}default:return}},this.addEventListener("focusin",this.handleFocusin)}static get styles(){return[t.r(p)]}delete(){this.readonly||!this.dispatchEvent(new Event("delete",{bubbles:!0,cancelable:!0,composed:!0}))||this.remove()}render(){return t.x`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../base-CBCg3yyw.cjs"),h=require("../sized-mixin-CPxE5C96.cjs");require("../clear-button-Qi1pMA5S.cjs");const m=require("../query-assigned-nodes-BcKWmGzy.cjs"),z=require("../focus-visible-B0P9aY_G.cjs"),f=require("../roving-tabindex-By_fCy_e.cjs"),p=':host{border-color:var(--highcontrast-tag-border-color, var(--luzmo-tag-border-color, var(--tag-border-color)));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-corner-radius, var(--tag-corner-radius));border-width:var(--luzmo-tag-border-width, var(--tag-border-width));block-size:var(--luzmo-tag-height, var(--tag-height));box-sizing:border-box;vertical-align:bottom;max-inline-size:100%;-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;border-style:solid;outline:none;align-items:center;justify-content: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}::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{block-size:100%;box-sizing:border-box;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;display:flex;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)));overflow:hidden}:host(:is(:active,[active])){border-color:var(--highcontrast-tag-border-color-active, var(--luzmo-tag-border-color-active, var(--tag-border-color-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)))}:host([focused]),:host(:focus-visible){border-color:var(--highcontrast-tag-border-color-focus, var(--luzmo-tag-border-color-focus, var(--tag-border-color-focus)));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)))}:host([focused]):after,:host(:focus-visible):after{content:"";border-color:var(--highcontrast-tag-focus-ring-color, var(--luzmo-tag-focus-ring-color, var(--tag-focus-ring-color)));border-radius:calc(var(--luzmo-tag-corner-radius, var(--tag-corner-radius)) + var(--luzmo-tag-focus-ring-gap, var(--tag-focus-ring-gap)) + var(--luzmo-tag-border-width, var(--tag-border-width)));border-width:var(--luzmo-tag-focus-ring-thickness, var(--tag-focus-ring-thickness));pointer-events:none;border-style:solid;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)))}:host([selected]){border-color:var(--highcontrast-tag-border-color-selected, var(--luzmo-tag-border-color-selected, var(--tag-border-color-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)))}:host([selected]:is(:active,[active])){border-color:var(--highcontrast-tag-border-color-selected-active, var(--luzmo-tag-border-color-selected-active, var(--tag-border-color-selected-active)));background-color:var(--highcontrast-tag-background-color-selected-active, var(--luzmo-tag-background-color-selected-active, var(--tag-background-color-selected-active)))}:host([selected][focused]),:host([selected]:focus-visible){border-color:var(--highcontrast-tag-border-color-selected-focus, var(--luzmo-tag-border-color-selected-focus, var(--tag-border-color-selected-focus)));background-color:var(--highcontrast-tag-background-color-selected-focus, var(--luzmo-tag-background-color-selected-focus, var(--tag-background-color-selected-focus)))}:host([invalid]){border-color:var(--highcontrast-tag-border-color-invalid, var(--luzmo-tag-border-color-invalid, var(--tag-border-color-invalid)));color:var(--highcontrast-tag-content-color-invalid, var(--luzmo-tag-content-color-invalid, var(--tag-content-color-invalid)))}:host([invalid]:is(:active,[active])){border-color:var(--highcontrast-tag-border-color-invalid-active, var(--luzmo-tag-border-color-invalid-active, var(--tag-border-color-invalid-active)));color:var(--highcontrast-tag-content-color-invalid-active, var(--luzmo-tag-content-color-invalid-active, var(--tag-content-color-invalid-active)))}:host([invalid][focused]),:host([invalid]:focus-visible){border-color:var(--highcontrast-tag-border-color-invalid-focus, var(--luzmo-tag-border-color-invalid-focus, var(--tag-border-color-invalid-focus)));color:var(--highcontrast-tag-content-color-invalid-focus, var(--luzmo-tag-content-color-invalid-focus, var(--tag-content-color-invalid-focus)))}:host([invalid][selected]){border-color:var(--highcontrast-tag-border-color-invalid-selected, var(--luzmo-tag-border-color-invalid-selected, var(--tag-border-color-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)))}:host([invalid][selected]:is(:active,[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)));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)))}:host([invalid][selected][focused]),:host([invalid][selected]:focus-visible){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)));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)))}:host([emphasized]){border-color:var(--highcontrast-tag-border-color-emphasized, var(--luzmo-tag-border-color-emphasized, var(--tag-border-color-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) )}@media (hover: hover){:host(:hover){border-color:var(--highcontrast-tag-border-color-hover, var(--luzmo-tag-border-color-hover, var(--tag-border-color-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)))}:host([selected]:hover){border-color:var(--highcontrast-tag-border-color-selected-hover, var(--luzmo-tag-border-color-selected-hover, var(--tag-border-color-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)))}:host([invalid]:hover){border-color:var(--highcontrast-tag-border-color-invalid-hover, var(--luzmo-tag-border-color-invalid-hover, var(--tag-border-color-invalid-hover)));color:var(--highcontrast-tag-content-color-invalid-hover, var(--luzmo-tag-content-color-invalid-hover, var(--tag-content-color-invalid-hover)))}:host([invalid][selected]:hover){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)));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)))}:host([emphasized]:hover){border-color:var(--highcontrast-tag-border-color-emphasized-hover, var(--luzmo-tag-border-color-emphasized-hover, var(--tag-border-color-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)))}}:host([emphasized]:is(:active,[active])){border-color:var(--highcontrast-tag-border-color-emphasized-active, var(--luzmo-tag-border-color-emphasized-active, var(--tag-border-color-emphasized-active)));background-color:var(--highcontrast-tag-background-color-emphasized-active, var(--luzmo-tag-background-color-emphasized-active, var(--tag-background-color-emphasized-active)))}:host([emphasized][focused]),:host([emphasized]:focus-visible){border-color:var(--highcontrast-tag-border-color-emphasized-focus, var(--luzmo-tag-border-color-emphasized-focus, var(--tag-border-color-emphasized-focus)));background-color:var(--highcontrast-tag-background-color-emphasized-focus, var(--luzmo-tag-background-color-emphasized-focus, var(--tag-background-color-emphasized-focus)))}:host([disabled]){border-color:var(--highcontrast-tag-border-color-disabled, var(--luzmo-tag-border-color-disabled, var(--tag-border-color-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}: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{--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-corner-radius: var(--luzmo-border-radius-s);--tag-size-medium-corner-radius: var(--luzmo-border-radius);--tag-size-large-corner-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-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)}:host([size=s]){--tag-height: var(--luzmo-component-height-xs);--tag-font-size: var(--luzmo-font-size-s);--tag-icon-size: var(--luzmo-font-size-s);--tag-clear-button-spacing-inline-start: var(--luzmo-spacing-2);--tag-corner-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-font-size);--tag-clear-button-spacing-inline-start: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--tag-corner-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-font-size);--tag-clear-button-spacing-inline-start: var(--luzmo-spacing-3);--tag-corner-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-font-size-l);--tag-clear-button-spacing-inline-start: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--tag-corner-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([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{--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([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)}';var k=Object.defineProperty,v=(l,o,a,n)=>{for(var r=void 0,e=l.length-1,c;e>=0;e--)(c=l[e])&&(r=c(o,a,r)||r);return r&&k(o,a,r),r};class i extends h.SizedMixin(t.LuzmoElement,{validSizes:["s","m","l","xl"],noDefaultSize:!0}){constructor(){super(),this.deletable=!1,this.disabled=!1,this.readonly=!1,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=o=>{if(!this.deletable||this.disabled)return;const{code:a}=o;switch(a){case"Backspace":case"Space":case"Delete":{this.delete();break}default:return}},this.addEventListener("focusin",this.handleFocusin)}static get styles(){return[t.r(p)]}delete(){this.readonly||!this.dispatchEvent(new Event("delete",{bubbles:!0,cancelable:!0,composed:!0}))||this.remove()}render(){return t.x`
       <slot name="avatar"></slot>
       <slot name="icon"></slot>
       <span class="label"><slot></slot></span>

package/components/tags/index.js

@@ -17,7 +17,7 @@
  * */
 import { a as h, r as m, E as k, x as g, n as u } from "../base-WsynuqaS.js";
 import { S as b } from "../sized-mixin-D4ACoVUr.js";
-import "../clear-button-BbVqNU-g.js";
+import "../clear-button-DoeRUWQ3.js";
 import { n as x } from "../query-assigned-nodes-C76XVPWY.js";
 import { F as w } from "../focus-visible-DBlJGoEW.js";
 import { R as y } from "../roving-tabindex-DOg4z6ZU.js";

package/components/text-field/index.cjs

@@ -15,7 +15,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const x=require("../text-field-BSIXGkFs.cjs"),t=require("../base-CBCg3yyw.cjs"),h=require("../luzmo-icons-D47EGj-3.cjs"),c=require("../sized-mixin-CPxE5C96.cjs"),s="@media (forced-colors: active){:host{--highcontrast-helptext-content-color-default: CanvasText;--highcontrast-helptext-icon-color-default: CanvasText}:host,.text,.icon{forced-color-adjust:none}}:host{--helptext-bottom-to-workflow-icon: 3px;color:var(--highcontrast-helptext-content-color-default, var(--luzmo-helptext-content-color-default, var(--helptext-content-color-default)));font-family:var(--luzmo-helptext-font-family, var(--luzmo-font-family));font-weight:var(--luzmo-helptext-font-weight, var(--luzmo-font-weight));font-size:var(--luzmo-helptext-font-size, var(--helptext-font-size, var(--luzmo-font-size-s)));min-block-size:var(--luzmo-helptext-min-height, var(--helptext-min-height, 24px));display:flex}.icon{block-size:var(--luzmo-helptext-icon-size, var(--helptext-icon-size, 18px));inline-size:var(--luzmo-helptext-icon-size, var(--helptext-icon-size, 18px));flex-shrink:0;margin-inline-end:var(--luzmo-helptext-text-to-visual, var(--helptext-text-to-visual, 7px));padding-block-start:var(--luzmo-helptext-top-to-workflow-icon, var(--helptext-top-to-workflow-icon, 3px));padding-block-end:var(--luzmo-helptext-bottom-to-workflow-icon, var(--helptext-bottom-to-workflow-icon, 3px))}.text{line-height:var(--luzmo-helptext-line-height, var(--helptext-line-height, 1.3));padding-block-start:var(--luzmo-helptext-top-to-text, var(--helptext-top-to-text, 4px));padding-block-end:var(--luzmo-helptext-bottom-to-text, var(--helptext-bottom-to-text, 5px))}:host(:lang(ja)) .text,:host(:lang(ko)) .text,:host(:lang(zh)) .text{line-height:var(--luzmo-helptext-line-height-cjk, var(--helptext-line-height-cjk, 1.4))}:host([variant=neutral]) .text{color:var(--highcontrast-helptext-content-color-default, var(--luzmo-helptext-content-color-default, var(--helptext-content-color-default)))}:host([variant=neutral]) .icon{color:var(--highcontrast-helptext-icon-color-default, var(--luzmo-helptext-icon-color-default, var(--helptext-icon-color-default)))}:host([variant=negative]) .text{color:var(--highcontrast-helptext-content-color-default, var(--luzmo-helptext-content-color-default, var(--luzmo-negative-color-down)))}:host([variant=negative]) .icon{color:var(--highcontrast-helptext-icon-color-default, var(--luzmo-helptext-icon-color-default, var(--helptext-icon-color-default)))}:host([disabled]) .text{color:var(--highcontrast-helptext-content-color-default, var(--luzmo-helptext-content-color-default, var(--luzmo-font-color)))}:host([disabled]) .icon{color:var(--highcontrast-helptext-icon-color-default, var(--luzmo-helptext-icon-color-default, var(--helptext-icon-color-default)))}:host{--helptext-line-height: 1.3;--helptext-content-color-default: var(--luzmo-font-color);--helptext-icon-color-default: var(--luzmo-font-color);--helptext-disabled-content-color: var(--luzmo-font-color-disabled)}:host([variant=neutral]){--helptext-content-color-default: var(var(--luzmo-font-color));--helptext-icon-color-default: var(var(--luzmo-font-color))}:host([variant=negative]){--helptext-content-color-default: var(var(--luzmo-negative-color));--helptext-icon-color-default: var(var(--luzmo-negative-color))}:host([disabled]){--helptext-content-color-default: var(--luzmo-font-color-disabled);--helptext-icon-color-default: var(--luzmo-font-color-disabled)}:host(:lang(ja)){--helptext-line-height-cjk: 1.4}:host(:lang(zh)){--helptext-line-height-cjk: 1.4}:host(:lang(ko)){--helptext-line-height-cjk: 1.4}:host([size=s]){--helptext-min-height: 24px;--helptext-icon-size: 16px;--helptext-font-size: 12px;--helptext-text-to-visual: 7px;--helptext-top-to-workflow-icon: 4px;--helptext-top-to-text: 4px;--helptext-bottom-to-text: 5px}:host{--helptext-min-height: 24px;--helptext-icon-size: 18px;--helptext-font-size: 12px;--helptext-text-to-visual: 7px;--helptext-top-to-workflow-icon: 3px;--helptext-top-to-text: 4px;--helptext-bottom-to-text: 5px}:host([size=l]){--helptext-min-height: 32px;--helptext-icon-size: 20px;--helptext-font-size: 14px;--helptext-text-to-visual: 8px;--helptext-top-to-workflow-icon: 6px;--helptext-top-to-text: 6px;--helptext-bottom-to-text: 5px}:host([size=xl]){--helptext-min-height: 40px;--helptext-icon-size: 22px;--helptext-font-size: 16px;--helptext-text-to-visual: 9px;--helptext-top-to-workflow-icon: 9px;--helptext-top-to-text: 9px;--helptext-bottom-to-text: 12px}";var u=Object.defineProperty,p=(l,i,r,v)=>{for(var e=void 0,n=l.length-1,a;n>=0;n--)(a=l[n])&&(e=a(i,r,e)||e);return e&&u(i,r,e),e};class o extends c.SizedMixin(t.LuzmoElement,{noDefaultSize:!0}){constructor(){super(...arguments),this.icon=!1,this.variant="neutral"}static get styles(){return[t.r(s)]}render(){return t.x`
-      ${this.variant==="negative"&&this.icon?t.x` ${h.p3(h.x)} `:t.E}
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const x=require("../text-field-D5d_Gt0t.cjs"),t=require("../base-CBCg3yyw.cjs"),h=require("../luzmo-icons-DletXGWU.cjs"),c=require("../sized-mixin-CPxE5C96.cjs"),s="@media (forced-colors: active){:host{--highcontrast-helptext-content-color-default: CanvasText;--highcontrast-helptext-icon-color-default: CanvasText}:host,.text,.icon{forced-color-adjust:none}}:host{--helptext-bottom-to-workflow-icon: 3px;color:var(--highcontrast-helptext-content-color-default, var(--luzmo-helptext-content-color-default, var(--helptext-content-color-default)));font-family:var(--luzmo-helptext-font-family, var(--luzmo-font-family));font-weight:var(--luzmo-helptext-font-weight, var(--luzmo-font-weight));font-size:var(--luzmo-helptext-font-size, var(--helptext-font-size, var(--luzmo-font-size-s)));min-block-size:var(--luzmo-helptext-min-height, var(--helptext-min-height, 24px));display:flex}.icon{block-size:var(--luzmo-helptext-icon-size, var(--helptext-icon-size, 18px));inline-size:var(--luzmo-helptext-icon-size, var(--helptext-icon-size, 18px));flex-shrink:0;margin-inline-end:var(--luzmo-helptext-text-to-visual, var(--helptext-text-to-visual, 7px));padding-block-start:var(--luzmo-helptext-top-to-workflow-icon, var(--helptext-top-to-workflow-icon, 3px));padding-block-end:var(--luzmo-helptext-bottom-to-workflow-icon, var(--helptext-bottom-to-workflow-icon, 3px))}.text{line-height:var(--luzmo-helptext-line-height, var(--helptext-line-height, 1.3));padding-block-start:var(--luzmo-helptext-top-to-text, var(--helptext-top-to-text, 4px));padding-block-end:var(--luzmo-helptext-bottom-to-text, var(--helptext-bottom-to-text, 5px))}:host(:lang(ja)) .text,:host(:lang(ko)) .text,:host(:lang(zh)) .text{line-height:var(--luzmo-helptext-line-height-cjk, var(--helptext-line-height-cjk, 1.4))}:host([variant=neutral]) .text{color:var(--highcontrast-helptext-content-color-default, var(--luzmo-helptext-content-color-default, var(--helptext-content-color-default)))}:host([variant=neutral]) .icon{color:var(--highcontrast-helptext-icon-color-default, var(--luzmo-helptext-icon-color-default, var(--helptext-icon-color-default)))}:host([variant=negative]) .text{color:var(--highcontrast-helptext-content-color-default, var(--luzmo-helptext-content-color-default, var(--luzmo-negative-color-down)))}:host([variant=negative]) .icon{color:var(--highcontrast-helptext-icon-color-default, var(--luzmo-helptext-icon-color-default, var(--helptext-icon-color-default)))}:host([disabled]) .text{color:var(--highcontrast-helptext-content-color-default, var(--luzmo-helptext-content-color-default, var(--luzmo-font-color)))}:host([disabled]) .icon{color:var(--highcontrast-helptext-icon-color-default, var(--luzmo-helptext-icon-color-default, var(--helptext-icon-color-default)))}:host{--helptext-line-height: 1.3;--helptext-content-color-default: var(--luzmo-font-color);--helptext-icon-color-default: var(--luzmo-font-color);--helptext-disabled-content-color: var(--luzmo-font-color-disabled)}:host([variant=neutral]){--helptext-content-color-default: var(var(--luzmo-font-color));--helptext-icon-color-default: var(var(--luzmo-font-color))}:host([variant=negative]){--helptext-content-color-default: var(var(--luzmo-negative-color));--helptext-icon-color-default: var(var(--luzmo-negative-color))}:host([disabled]){--helptext-content-color-default: var(--luzmo-font-color-disabled);--helptext-icon-color-default: var(--luzmo-font-color-disabled)}:host(:lang(ja)){--helptext-line-height-cjk: 1.4}:host(:lang(zh)){--helptext-line-height-cjk: 1.4}:host(:lang(ko)){--helptext-line-height-cjk: 1.4}:host([size=s]){--helptext-min-height: 24px;--helptext-icon-size: 16px;--helptext-font-size: 12px;--helptext-text-to-visual: 7px;--helptext-top-to-workflow-icon: 4px;--helptext-top-to-text: 4px;--helptext-bottom-to-text: 5px}:host{--helptext-min-height: 24px;--helptext-icon-size: 18px;--helptext-font-size: 12px;--helptext-text-to-visual: 7px;--helptext-top-to-workflow-icon: 3px;--helptext-top-to-text: 4px;--helptext-bottom-to-text: 5px}:host([size=l]){--helptext-min-height: 32px;--helptext-icon-size: 20px;--helptext-font-size: 14px;--helptext-text-to-visual: 8px;--helptext-top-to-workflow-icon: 6px;--helptext-top-to-text: 6px;--helptext-bottom-to-text: 5px}:host([size=xl]){--helptext-min-height: 40px;--helptext-icon-size: 22px;--helptext-font-size: 16px;--helptext-text-to-visual: 9px;--helptext-top-to-workflow-icon: 9px;--helptext-top-to-text: 9px;--helptext-bottom-to-text: 12px}";var u=Object.defineProperty,p=(l,i,r,v)=>{for(var e=void 0,n=l.length-1,a;n>=0;n--)(a=l[n])&&(e=a(i,r,e)||e);return e&&u(i,r,e),e};class o extends c.SizedMixin(t.LuzmoElement,{noDefaultSize:!0}){constructor(){super(...arguments),this.icon=!1,this.variant="neutral"}static get styles(){return[t.r(s)]}render(){return t.x`
+      ${this.variant==="negative"&&this.icon?t.x` ${h.O2(h.x)} `:t.E}
       <div class="text"><slot></slot></div>
     `}}p([t.n({type:Boolean,reflect:!0})],o.prototype,"icon");p([t.n({reflect:!0})],o.prototype,"variant");customElements.get("luzmo-text-field")||customElements.define("luzmo-text-field",x.LuzmoTextField);customElements.get("luzmo-help-text")||customElements.define("luzmo-help-text",o);exports.LuzmoTextField=x.LuzmoTextField;exports.LuzmoHelpText=o;

package/components/text-field/index.js

@@ -15,9 +15,9 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-import { L as m } from "../text-field-B9IkRRxO.js";
-import { a as p, r as x, E as s, x as a, n as c } from "../base-WsynuqaS.js";
-import { p as z, x as d } from "../luzmo-icons-NEyaMpEM.js";
+import { L as m } from "../text-field-BIADXoLC.js";
+import { a as x, r as p, E as s, x as a, n as c } from "../base-WsynuqaS.js";
+import { O as z, x as d } from "../luzmo-icons-DbwDQtuO.js";
 import { S as f } from "../sized-mixin-D4ACoVUr.js";
 const h = () => {
   if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
@@ -32,14 +32,14 @@ var v = Object.defineProperty, u = (o, r, n, b) => {
     (i = o[e]) && (t = i(r, n, t) || t);
   return t && v(r, n, t), t;
 };
-class l extends f(p, {
+class l extends f(x, {
   noDefaultSize: !0
 }) {
   constructor() {
     super(...arguments), this.icon = !1, this.variant = "neutral";
   }
   static get styles() {
-    return [x(g)];
+    return [p(g)];
   }
   render() {
     return a`

package/components/{text-field-B9IkRRxO.js → text-field-BIADXoLC.js}

@@ -21,7 +21,7 @@ import { e as g } from "./query-D_KR_GUc.js";
 import { o as n } from "./if-defined-DOaE2coe.js";
 import { e as $, i as x, t as p } from "./directive-oAbCiebi.js";
 import { f as b, m as E } from "./directive-helpers-Cm6gitnu.js";
-import { p as y, $ as w, F as T } from "./luzmo-icons-NEyaMpEM.js";
+import { O as y, I as w, F as T } from "./luzmo-icons-DbwDQtuO.js";
 import { F as _ } from "./focusable-BxtpnzWp.js";
 import { S } from "./sized-mixin-D4ACoVUr.js";
 import { M as B } from "./manage-help-text-syYnjKGL.js";

package/components/{text-field-BSIXGkFs.cjs → text-field-D5d_Gt0t.cjs}

@@ -15,14 +15,14 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-"use strict";const t=require("./base-CBCg3yyw.cjs"),v=require("./state-D8JEtYqe.cjs"),m=require("./query-BL-TJj7K.cjs"),r=require("./if-defined-C9YGdo33.cjs"),u=require("./directive-C7oCP5Bh.cjs"),c=require("./directive-helpers-DyIRTWwA.cjs"),h=require("./luzmo-icons-D47EGj-3.cjs"),g=require("./focusable-EbipgXRh.cjs"),f=require("./sized-mixin-CPxE5C96.cjs"),$=require("./manage-help-text-DhgARkZX.cjs"),x=require("./text-field.module-p_VF2tC_.cjs");/**
+"use strict";const t=require("./base-CBCg3yyw.cjs"),v=require("./state-D8JEtYqe.cjs"),m=require("./query-BL-TJj7K.cjs"),r=require("./if-defined-C9YGdo33.cjs"),u=require("./directive-C7oCP5Bh.cjs"),c=require("./directive-helpers-DyIRTWwA.cjs"),h=require("./luzmo-icons-DletXGWU.cjs"),g=require("./focusable-EbipgXRh.cjs"),f=require("./sized-mixin-CPxE5C96.cjs"),$=require("./manage-help-text-DhgARkZX.cjs"),x=require("./text-field.module-p_VF2tC_.cjs");/**
  * @license
  * Copyright 2020 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */const b=u.e(class extends u.i{constructor(s){if(super(s),s.type!==u.t.PROPERTY&&s.type!==u.t.ATTRIBUTE&&s.type!==u.t.BOOLEAN_ATTRIBUTE)throw Error("The `live` directive is not allowed on child or event bindings");if(!c.f(s))throw Error("`live` bindings can only contain a single expression")}render(s){return s}update(s,[e]){if(e===t.T||e===t.E)return e;const l=s.element,a=s.name;if(s.type===u.t.PROPERTY){if(e===l[a])return t.T}else if(s.type===u.t.BOOLEAN_ATTRIBUTE){if(!!e===l.hasAttribute(a))return t.T}else if(s.type===u.t.ATTRIBUTE&&l.getAttribute(a)===e+"")return t.T;return c.m(s),e}});var E=Object.defineProperty,T=Object.getOwnPropertyDescriptor,n=(s,e,l,a)=>{for(var o=a>1?void 0:a?T(e,l):e,p=s.length-1,d;p>=0;p--)(d=s[p])&&(o=(a?d(e,l,o):d(o))||o);return a&&o&&E(e,l,o),o};const q=["text","url","tel","email","password"];class i extends $.ManageHelpText(f.SizedMixin(g.Focusable,{noDefaultSize:!0})){constructor(){super(...arguments),this.allowedKeys="",this.focused=!1,this.invalid=!1,this.label="",this.placeholder="",this._type="text",this.grows=!1,this.maxlength=-1,this.minlength=-1,this.multiline=!1,this.readonly=!1,this.rows=-1,this.valid=!1,this._value="",this.quiet=!1,this.required=!1}static get styles(){return[t.r(x.textFieldStyles)]}set type(e){const l=this._type;this._type=e,this.requestUpdate("type",l)}get type(){return q.find(e=>e===this._type)??"text"}set value(e){if(e===this.value)return;const l=this._value;this._value=e,this.requestUpdate("value",l)}get value(){return this._value}get focusElement(){return this.inputElement}setSelectionRange(e,l,a="none"){this.inputElement.setSelectionRange(e,l,a)}select(){this.inputElement.select()}handleInput(e){if(this.allowedKeys&&this.inputElement.value&&!new RegExp(`^[${this.allowedKeys}]*$`,"u").test(this.inputElement.value)){const o=this.inputElement.selectionStart-1;this.inputElement.value=this.value.toString(),this.inputElement.setSelectionRange(o,o);return}this.value=this.inputElement.value}handleChange(){this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))}onFocus(){this.focused=!this.readonly&&!0}onBlur(e){this.focused=!this.readonly&&!1}handleInputElementPointerdown(){}renderStateIcons(){return this.invalid?t.x`
-        <div id="invalid" class="icon">${h.p3(h.$)}</div>
+        <div id="invalid" class="icon">${h.O2(h.I)}</div>
       `:this.valid?t.x`
-        <div id="valid" class="icon">${h.p3(h.F)}</div>
+        <div id="valid" class="icon">${h.O2(h.F)}</div>
       `:t.E}get displayValue(){return this.value.toString()}get renderMultiline(){return t.x`
       ${this.multiline&&this.grows&&this.rows===-1?t.x`
           <div id="sizer" class="input" aria-hidden="true">${this.value}&#8203;