@vonage/vivid 5.4.0 → 5.5.0

package/number-field/index.cjs

@@ -1,4 +1,4 @@
-"use strict";const x=require("../bundled/definition3.cjs"),z=require("../bundled/definition14.cjs"),_=require("../bundled/definition13.cjs"),C=require("../bundled/definition2.cjs"),g=require("../bundled/mixins.cjs"),r=require("../bundled/vivid-element.cjs"),q=require("../bundled/definition12.cjs"),y=require("../bundled/delegates-aria.cjs"),A=require("../bundled/form-associated.cjs"),S=require("../bundled/with-contextual-help.cjs"),D=require("../bundled/with-error-text.cjs"),V=require("../bundled/with-success-text.cjs"),N=require("../bundled/form-element.cjs"),F=require("../bundled/affix.cjs"),B=require("../bundled/localized.cjs"),p=require("../bundled/key-codes.cjs"),u=require("../bundled/enums.cjs"),T=require("../bundled/divider.cjs"),P=require("../bundled/when.cjs"),E=require("../bundled/slotted.cjs"),I=require("../bundled/ref.cjs"),U=require("../bundled/class-names.cjs"),L=':host{display:inline-block}.base{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-500)}.base.appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}@media (hover: hover){.base:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-700)}.base:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}}.base.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-700)}.base.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}.base:disabled{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.base:disabled.appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base.disabled{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.base.disabled.appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base.readonly:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-neutral-200);--_appearance-color-outline: var(--vvd-color-neutral-400)}.base.readonly:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-600);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base.error:where(:not(.disabled,:disabled)){--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: var(--vvd-color-alert-500)}.base.error:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: transparent}.base.success:where(:not(.disabled,:disabled)){--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: var(--vvd-color-success-500)}.base.success:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: transparent}.base{--_connotation-color-primary: var(--vvd-text-field-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-text-field-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-text-field-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-intermediate: var(--vvd-text-field-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-firm: var(--vvd-text-field-accent-firm, var(--vvd-color-canvas-text));--_connotation-color-fierce: var(--vvd-text-field-accent-fierce, var(--vvd-color-neutral-700));--_connotation-color-faint: var(--vvd-text-field-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-text-field-accent-soft, var(--vvd-color-neutral-100))}.base{--_text-field-gutter-start: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4) ;--_text-field-gutter-end: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4) ;--_text-field-icon-size: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2) ;--_text-field-block-size: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))) ;--_text-field-border-radius: 8px;--_text-field-pill-border-radius: 24px;display:inline-grid;width:100%;align-items:center;gap:4px;grid-template-columns:min-content 1fr max-content}.base.size-condensed{--_text-field-gutter-start: calc(1px*(24 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2) ;--_text-field-gutter-end: calc(1px*(24 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2) ;--_text-field-icon-size: calc(1px*(32 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2) ;--_text-field-block-size: calc(1px*(32 + 4*clamp(-1, var(--vvd-size-density, 0), 2))) ;--_text-field-border-radius: 4px}@supports (user-select: none){.base{user-select:none}}.base:not(.disabled){--_low-ink-color: var(--vvd-color-neutral-600)}.base.disabled{--_low-ink-color: var(--_appearance-color-text)}.label:not(slot),.label::slotted(label){box-sizing:initial!important;padding:initial!important;margin:initial!important;color:var(--vvd-color-canvas-text)!important;contain:inline-size!important;font:var(--vvd-typography-base);grid-column:1/4;grid-row:1}.char-count+.label:not(slot),.char-count+.label::slotted(label){grid-column:1/3}.char-count{color:var(--_low-ink-color);font:var(--vvd-typography-base)}.fieldset{position:relative;display:flex;align-items:center;background-color:var(--_appearance-color-fill);font:var(--vvd-typography-base);grid-column:1/4;padding-block:0;transition:color .2s,background-color .2s}.fieldset:after{position:absolute;display:block;border-radius:inherit;block-size:100%;box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);content:"";inline-size:100%;pointer-events:none;transition:box-shadow .2s}.fieldset:focus-visible{outline:none}.base>.fieldset{block-size:var(--_text-field-block-size)}.base:not(.shape-pill) .fieldset{border-radius:var(--_text-field-border-radius)}.base.shape-pill .fieldset{border-radius:var(--_text-field-pill-border-radius)}.wrapper{border-radius:inherit;block-size:100%;inline-size:100%}.control{border-radius:inherit;text-align:start}.control:not(slot),.control::slotted(input){width:100%!important;box-sizing:border-box!important;border:0 none!important;border-radius:inherit!important;margin:initial!important;appearance:none!important;background-color:transparent!important;block-size:100%!important;color:inherit!important;font:inherit;outline:transparent;padding-block:0!important;padding-inline:var(--_text-field-gutter-start) var(--_text-field-gutter-end)!important;text-align:inherit}.control:not(slot):disabled,.control::slotted(input:disabled){cursor:not-allowed!important;opacity:1!important;-webkit-text-fill-color:var(--_appearance-color-text)!important}.control:not(slot)::placeholder{opacity:1!important;-webkit-text-fill-color:var(--_low-ink-color)!important}.control::slotted(input:-webkit-autofill),.control:not(slot):-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--_appearance-color-fill) inset;-webkit-text-fill-color:var(--_appearance-color-text)!important}.has-icon .control:not(slot),.has-icon .control::slotted(input){padding-inline-start:calc(var(--_text-field-icon-size) + var(--_text-field-gutter-start) * 2)!important}.icon{position:absolute;z-index:1;color:var(--_low-ink-color);font-size:var(--_text-field-icon-size);inset-block-start:50%;inset-inline-start:calc(100% + var(--_text-field-gutter-start));line-height:1;transform:translateY(-50%)}.leading-items-wrapper{position:relative}.base.no-leading .leading-items-wrapper{display:none}.action-items-wrapper{margin-inline-end:4px}.base:not(.action-items) .action-items-wrapper{display:none}@supports selector(:has(*)){.base:not(.has-activedescendant) .fieldset:has(.wrapper .control:focus-within):after{--focus-stroke-gap-color: transparent;box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px))}}@supports not selector(:has(*)){.base:not(.has-activedescendant) .wrapper:focus-within:after{box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px));--focus-stroke-gap-color: transparent;position:absolute;z-index:1;display:block;border-radius:inherit;content:"";inset:0;pointer-events:none}}:host([internal-part]) .fieldset{background-color:transparent;font:var(--vvd-typography-heading-4);line-height:1.1}:host([internal-part]) .fieldset:not(:focus-within):after{block-size:1px;inset-block-end:0}@supports selector(:has(*)){:host([internal-part]) .fieldset:has(.action-items-wrapper:focus-within):after{block-size:1px;inset-block-end:0}}:host([internal-part]) .control{text-align:center}slot[name=_mirrored-helper-text]{display:none}.label-suffix{display:flex;align-items:center;gap:var(--label-suffix-gap, 8px);grid-column-end:-1;grid-row:1}.label-suffix[hidden]{display:none}slot[name=contextual-help]::slotted([data-vvd-component=contextual-help]){grid-column-end:-1;grid-row:1}.base{--_text-field-gutter-end: 70px}.control::-webkit-outer-spin-button,.control::-webkit-inner-spin-button{appearance:none}.control-buttons{position:absolute;z-index:1;right:3px;display:flex}.readonly .control-buttons,.disabled .control-buttons{pointer-events:none}.control-buttons .divider{margin-block:8px}.control-buttons>*{flex-shrink:0}';var O=Object.defineProperty,i=(a,t,e,o)=>{for(var l=void 0,s=a.length-1,c;s>=0;s--)(c=a[s])&&(l=c(t,e,l)||l);return l&&O(t,e,l),l};const v={up:1,down:-1};function b(a,t){const e=parseFloat(a.value),o=isNaN(e)?a.min>0?a.min:a.max<0?a.max:a.min?0:t*a.step:e+t*a.step;a.value=Number(o.toFixed(12)).toString(),a._updatedValueAnnouncement=a.locale.numberField.updatedValueAnnouncement(a._presentationValue)}const w=a=>{const t=a.source;return{invalidCharacters:new RegExp(`[^0-9\\-+e${t}]`,"g"),additionalDecimalSeparators:new RegExp(`(?<=${t}.*)${t}`,"g"),trailingDecimalSeparator:new RegExp(`${t}$`),decimalSeparator:a}},H=w(/\./),W=w(/,/),h=/^-?((\d*\.\d+)|(\d+))$/;class n extends S.WithContextualHelp(g.WithFeedback(D.WithErrorText(V.WithSuccessText(N.FormElement(F.AffixIcon(B.Localized(y.DelegatesAria(A.FormAssociated(r.VividElement))))))))){constructor(){super(...arguments),this.proxy=document.createElement("input"),this.readOnly=!1,this.autofocus=!1,this.step=1,this.isUserInput=!1,this._presentationValue="",this._updatedValueAnnouncement="",this.incrementButtonAriaLabel=null,this.decrementButtonAriaLabel=null}stepChanged(t,e){this.proxy.setAttribute("step",Number.isFinite(e)?e.toString():"")}maxChanged(t,e){this.max=Math.max(e,this.min??e),this.proxy.max=this.max.toString(),this.validate()}minChanged(t,e){this.min=Math.min(e,this.max??e),this.proxy.min=this.min.toString(),this.validate()}get valueAsNumber(){return parseFloat(this.value)}set valueAsNumber(t){this.value=t.toString()}valueChanged(t,e){this.value=h.test(e)?e:"",e===this.value&&(this.control&&!this.isUserInput&&(this._presentationValue=this.#e(this.value)),super.valueChanged(t,this.value),t!==void 0&&!this.isUserInput&&(this.$emit("input"),this.$emit("change")))}get _numberPatterns(){return this.locale.common.useCommaAsDecimalSeparator?W:H}#e(t){return t.replace(".",this.locale.common.useCommaAsDecimalSeparator?",":".")}#t(t){return t.replace(this._numberPatterns.invalidCharacters,"").replace(this._numberPatterns.additionalDecimalSeparators,"")}#a(t){const e=t.replace(this._numberPatterns.trailingDecimalSeparator,"").replace(this._numberPatterns.decimalSeparator,".");return h.test(e)?e:""}validate(){super.validate(this.control)}stepUp(){b(this,v.up)}stepDown(){b(this,v.down)}connectedCallback(){super.connectedCallback(),this.proxy.setAttribute("type","number"),this.validate(),this._presentationValue=this.#e(this.value),this.autofocus&&r.Updates.enqueue(()=>{this.focus()})}select(){this.control.select(),this.$emit("select")}handleTextInput(){this._presentationValue=this.#t(this.control.value),this.control.value!==this._presentationValue&&(this.control.value=this._presentationValue),this.isUserInput=!0,this.value=this.#a(this._presentationValue),this.isUserInput=!1}handleChange(){this.$emit("change")}handleKeyDown(t){switch(t.key){case p.keyArrowUp:return this.stepUp(),!1;case p.keyArrowDown:return this.stepDown(),!1}return!0}}i([r.attr({attribute:"readonly",mode:"boolean"})],n.prototype,"readOnly");i([r.attr({mode:"boolean"})],n.prototype,"autofocus");i([r.attr],n.prototype,"placeholder");i([r.attr],n.prototype,"list");i([r.attr({converter:r.nullableNumberConverter})],n.prototype,"maxlength");i([r.attr({converter:r.nullableNumberConverter})],n.prototype,"minlength");i([r.attr({converter:r.nullableNumberConverter})],n.prototype,"size");i([r.attr()],n.prototype,"scale");i([r.attr({converter:r.nullableNumberConverter})],n.prototype,"step");i([r.attr({converter:r.nullableNumberConverter})],n.prototype,"max");i([r.attr({converter:r.nullableNumberConverter})],n.prototype,"min");i([r.observable],n.prototype,"defaultSlottedNodes");i([r.observable],n.prototype,"_presentationValue");i([r.observable],n.prototype,"_updatedValueAnnouncement");i([r.attr({attribute:"increment-button-aria-label"})],n.prototype,"incrementButtonAriaLabel");i([r.attr({attribute:"decrement-button-aria-label"})],n.prototype,"decrementButtonAriaLabel");i([r.attr],n.prototype,"appearance");i([r.attr],n.prototype,"shape");i([r.attr],n.prototype,"autoComplete");const R=({errorValidationMessage:a,disabled:t,value:e,readOnly:o,placeholder:l,appearance:s,shape:c,label:$,successText:k,scale:d})=>U.classNames(["error",!!a],["disabled",t],["has-value",!!e],["readonly",o],["placeholder",!!l],[`appearance-${s}`,!!s],[`shape-${c}`,!!c],["no-label",!$],["success",!!k],[`size-${d}`,!!d]);function M(){return r.html` <label for="control" class="label">
+"use strict";const x=require("../bundled/definition3.cjs"),z=require("../bundled/definition15.cjs"),_=require("../bundled/definition14.cjs"),C=require("../bundled/definition2.cjs"),g=require("../bundled/mixins.cjs"),r=require("../bundled/vivid-element.cjs"),q=require("../bundled/definition13.cjs"),y=require("../bundled/delegates-aria.cjs"),A=require("../bundled/form-associated.cjs"),S=require("../bundled/with-contextual-help.cjs"),D=require("../bundled/with-error-text.cjs"),V=require("../bundled/with-success-text.cjs"),N=require("../bundled/form-element.cjs"),F=require("../bundled/affix.cjs"),B=require("../bundled/localized.cjs"),p=require("../bundled/key-codes.cjs"),u=require("../bundled/enums.cjs"),T=require("../bundled/divider.cjs"),P=require("../bundled/when.cjs"),E=require("../bundled/slotted.cjs"),I=require("../bundled/ref.cjs"),U=require("../bundled/class-names.cjs"),L=':host{display:inline-block}.base{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-500)}.base.appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}@media (hover: hover){.base:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-700)}.base:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}}.base.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-700)}.base.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}.base:disabled{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.base:disabled.appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base.disabled{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.base.disabled.appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base.readonly:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-neutral-200);--_appearance-color-outline: var(--vvd-color-neutral-400)}.base.readonly:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-600);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base.error:where(:not(.disabled,:disabled)){--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: var(--vvd-color-alert-500)}.base.error:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: transparent}.base.success:where(:not(.disabled,:disabled)){--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: var(--vvd-color-success-500)}.base.success:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: transparent}.base{--_connotation-color-primary: var(--vvd-text-field-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-text-field-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-text-field-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-intermediate: var(--vvd-text-field-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-firm: var(--vvd-text-field-accent-firm, var(--vvd-color-canvas-text));--_connotation-color-fierce: var(--vvd-text-field-accent-fierce, var(--vvd-color-neutral-700));--_connotation-color-faint: var(--vvd-text-field-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-text-field-accent-soft, var(--vvd-color-neutral-100))}.base{--_text-field-gutter-start: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4) ;--_text-field-gutter-end: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4) ;--_text-field-icon-size: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2) ;--_text-field-block-size: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))) ;--_text-field-border-radius: 8px;--_text-field-pill-border-radius: 24px;display:inline-grid;width:100%;align-items:center;gap:4px;grid-template-columns:min-content 1fr max-content}.base.size-condensed{--_text-field-gutter-start: calc(1px*(24 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2) ;--_text-field-gutter-end: calc(1px*(24 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2) ;--_text-field-icon-size: calc(1px*(32 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2) ;--_text-field-block-size: calc(1px*(32 + 4*clamp(-1, var(--vvd-size-density, 0), 2))) ;--_text-field-border-radius: 4px}@supports (user-select: none){.base{user-select:none}}.base:not(.disabled){--_low-ink-color: var(--vvd-color-neutral-600)}.base.disabled{--_low-ink-color: var(--_appearance-color-text)}.label:not(slot),.label::slotted(label){box-sizing:initial!important;padding:initial!important;margin:initial!important;color:var(--vvd-color-canvas-text)!important;contain:inline-size!important;font:var(--vvd-typography-base);grid-column:1/4;grid-row:1}.char-count+.label:not(slot),.char-count+.label::slotted(label){grid-column:1/3}.char-count{color:var(--_low-ink-color);font:var(--vvd-typography-base)}.fieldset{position:relative;display:flex;align-items:center;background-color:var(--_appearance-color-fill);font:var(--vvd-typography-base);grid-column:1/4;padding-block:0;transition:color .2s,background-color .2s}.fieldset:after{position:absolute;display:block;border-radius:inherit;block-size:100%;box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);content:"";inline-size:100%;pointer-events:none;transition:box-shadow .2s}.fieldset:focus-visible{outline:none}.base>.fieldset{block-size:var(--_text-field-block-size)}.base:not(.shape-pill) .fieldset{border-radius:var(--_text-field-border-radius)}.base.shape-pill .fieldset{border-radius:var(--_text-field-pill-border-radius)}.wrapper{border-radius:inherit;block-size:100%;inline-size:100%}.control{border-radius:inherit;text-align:start}.control:not(slot),.control::slotted(input){width:100%!important;box-sizing:border-box!important;border:0 none!important;border-radius:inherit!important;margin:initial!important;appearance:none!important;background-color:transparent!important;block-size:100%!important;color:inherit!important;font:inherit;outline:transparent;padding-block:0!important;padding-inline:var(--_text-field-gutter-start) var(--_text-field-gutter-end)!important;text-align:inherit}.control:not(slot):disabled,.control::slotted(input:disabled){cursor:not-allowed!important;opacity:1!important;-webkit-text-fill-color:var(--_appearance-color-text)!important}.control:not(slot)::placeholder{opacity:1!important;-webkit-text-fill-color:var(--_low-ink-color)!important}.control::slotted(input:-webkit-autofill),.control:not(slot):-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--_appearance-color-fill) inset;-webkit-text-fill-color:var(--_appearance-color-text)!important}.has-icon .control:not(slot),.has-icon .control::slotted(input){padding-inline-start:calc(var(--_text-field-icon-size) + var(--_text-field-gutter-start) * 2)!important}.icon{position:absolute;z-index:1;color:var(--_low-ink-color);font-size:var(--_text-field-icon-size);inset-block-start:50%;inset-inline-start:calc(100% + var(--_text-field-gutter-start));line-height:1;transform:translateY(-50%)}.leading-items-wrapper{position:relative}.base.no-leading .leading-items-wrapper{display:none}.action-items-wrapper{margin-inline-end:4px}.base:not(.action-items) .action-items-wrapper{display:none}@supports selector(:has(*)){.base:not(.has-activedescendant) .fieldset:has(.wrapper .control:focus-within):after{--focus-stroke-gap-color: transparent;box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px))}}@supports not selector(:has(*)){.base:not(.has-activedescendant) .wrapper:focus-within:after{box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px));--focus-stroke-gap-color: transparent;position:absolute;z-index:1;display:block;border-radius:inherit;content:"";inset:0;pointer-events:none}}:host([internal-part]) .fieldset{background-color:transparent;font:var(--vvd-typography-heading-4);line-height:1.1}:host([internal-part]) .fieldset:not(:focus-within):after{block-size:1px;inset-block-end:0}@supports selector(:has(*)){:host([internal-part]) .fieldset:has(.action-items-wrapper:focus-within):after{block-size:1px;inset-block-end:0}}:host([internal-part]) .control{text-align:center}slot[name=_mirrored-helper-text]{display:none}.label-suffix{display:flex;align-items:center;gap:var(--label-suffix-gap, 8px);grid-column-end:-1;grid-row:1}.label-suffix[hidden]{display:none}slot[name=contextual-help]::slotted([data-vvd-component=contextual-help]){grid-column-end:-1;grid-row:1}.base{--_text-field-gutter-end: 70px}.control::-webkit-outer-spin-button,.control::-webkit-inner-spin-button{appearance:none}.control-buttons{position:absolute;z-index:1;right:3px;display:flex}.readonly .control-buttons,.disabled .control-buttons{pointer-events:none}.control-buttons .divider{margin-block:8px}.control-buttons>*{flex-shrink:0}';var O=Object.defineProperty,i=(a,t,e,o)=>{for(var l=void 0,s=a.length-1,c;s>=0;s--)(c=a[s])&&(l=c(t,e,l)||l);return l&&O(t,e,l),l};const v={up:1,down:-1};function b(a,t){const e=parseFloat(a.value),o=isNaN(e)?a.min>0?a.min:a.max<0?a.max:a.min?0:t*a.step:e+t*a.step;a.value=Number(o.toFixed(12)).toString(),a._updatedValueAnnouncement=a.locale.numberField.updatedValueAnnouncement(a._presentationValue)}const w=a=>{const t=a.source;return{invalidCharacters:new RegExp(`[^0-9\\-+e${t}]`,"g"),additionalDecimalSeparators:new RegExp(`(?<=${t}.*)${t}`,"g"),trailingDecimalSeparator:new RegExp(`${t}$`),decimalSeparator:a}},H=w(/\./),W=w(/,/),h=/^-?((\d*\.\d+)|(\d+))$/;class n extends S.WithContextualHelp(g.WithFeedback(D.WithErrorText(V.WithSuccessText(N.FormElement(F.AffixIcon(B.Localized(y.DelegatesAria(A.FormAssociated(r.VividElement))))))))){constructor(){super(...arguments),this.proxy=document.createElement("input"),this.readOnly=!1,this.autofocus=!1,this.step=1,this.isUserInput=!1,this._presentationValue="",this._updatedValueAnnouncement="",this.incrementButtonAriaLabel=null,this.decrementButtonAriaLabel=null}stepChanged(t,e){this.proxy.setAttribute("step",Number.isFinite(e)?e.toString():"")}maxChanged(t,e){this.max=Math.max(e,this.min??e),this.proxy.max=this.max.toString(),this.validate()}minChanged(t,e){this.min=Math.min(e,this.max??e),this.proxy.min=this.min.toString(),this.validate()}get valueAsNumber(){return parseFloat(this.value)}set valueAsNumber(t){this.value=t.toString()}valueChanged(t,e){this.value=h.test(e)?e:"",e===this.value&&(this.control&&!this.isUserInput&&(this._presentationValue=this.#e(this.value)),super.valueChanged(t,this.value),t!==void 0&&!this.isUserInput&&(this.$emit("input"),this.$emit("change")))}get _numberPatterns(){return this.locale.common.useCommaAsDecimalSeparator?W:H}#e(t){return t.replace(".",this.locale.common.useCommaAsDecimalSeparator?",":".")}#t(t){return t.replace(this._numberPatterns.invalidCharacters,"").replace(this._numberPatterns.additionalDecimalSeparators,"")}#a(t){const e=t.replace(this._numberPatterns.trailingDecimalSeparator,"").replace(this._numberPatterns.decimalSeparator,".");return h.test(e)?e:""}validate(){super.validate(this.control)}stepUp(){b(this,v.up)}stepDown(){b(this,v.down)}connectedCallback(){super.connectedCallback(),this.proxy.setAttribute("type","number"),this.validate(),this._presentationValue=this.#e(this.value),this.autofocus&&r.Updates.enqueue(()=>{this.focus()})}select(){this.control.select(),this.$emit("select")}handleTextInput(){this._presentationValue=this.#t(this.control.value),this.control.value!==this._presentationValue&&(this.control.value=this._presentationValue),this.isUserInput=!0,this.value=this.#a(this._presentationValue),this.isUserInput=!1}handleChange(){this.$emit("change")}handleKeyDown(t){switch(t.key){case p.keyArrowUp:return this.stepUp(),!1;case p.keyArrowDown:return this.stepDown(),!1}return!0}}i([r.attr({attribute:"readonly",mode:"boolean"})],n.prototype,"readOnly");i([r.attr({mode:"boolean"})],n.prototype,"autofocus");i([r.attr],n.prototype,"placeholder");i([r.attr],n.prototype,"list");i([r.attr({converter:r.nullableNumberConverter})],n.prototype,"maxlength");i([r.attr({converter:r.nullableNumberConverter})],n.prototype,"minlength");i([r.attr({converter:r.nullableNumberConverter})],n.prototype,"size");i([r.attr()],n.prototype,"scale");i([r.attr({converter:r.nullableNumberConverter})],n.prototype,"step");i([r.attr({converter:r.nullableNumberConverter})],n.prototype,"max");i([r.attr({converter:r.nullableNumberConverter})],n.prototype,"min");i([r.observable],n.prototype,"defaultSlottedNodes");i([r.observable],n.prototype,"_presentationValue");i([r.observable],n.prototype,"_updatedValueAnnouncement");i([r.attr({attribute:"increment-button-aria-label"})],n.prototype,"incrementButtonAriaLabel");i([r.attr({attribute:"decrement-button-aria-label"})],n.prototype,"decrementButtonAriaLabel");i([r.attr],n.prototype,"appearance");i([r.attr],n.prototype,"shape");i([r.attr],n.prototype,"autoComplete");const R=({errorValidationMessage:a,disabled:t,value:e,readOnly:o,placeholder:l,appearance:s,shape:c,label:$,successText:k,scale:d})=>U.classNames(["error",!!a],["disabled",t],["has-value",!!e],["readonly",o],["placeholder",!!l],[`appearance-${s}`,!!s],[`shape-${c}`,!!c],["no-label",!$],["success",!!k],[`size-${d}`,!!d]);function M(){return r.html` <label for="control" class="label">
 		${a=>a.label}
 	</label>`}function m(a){return a.shape===u.Shape.Pill?u.Shape.Pill:null}function f(a){return a.disabled||a.readOnly?"-1":null}function K(a){const t=a.tagFor(x.Button),e=a.tagFor(T.Divider);return r.html`
 		<div class="control-buttons" ?inert="${o=>o.disabled||o.readOnly}">

package/number-field/index.js

@@ -1,10 +1,10 @@
 import { B as $, b as k } from "../bundled/definition3.js";
-import { d as z } from "../bundled/definition14.js";
-import { V as C, v as D } from "../bundled/definition13.js";
+import { d as z } from "../bundled/definition15.js";
+import { V as C, v as D } from "../bundled/definition14.js";
 import { i as V } from "../bundled/definition2.js";
 import { W as A, f as S } from "../bundled/mixins.js";
 import { V as F, U as B, a as i, n as c, o as d, h as u, c as P, d as N } from "../bundled/vivid-element.js";
-import { c as T } from "../bundled/definition12.js";
+import { c as T } from "../bundled/definition13.js";
 import { D as U, d as I } from "../bundled/delegates-aria.js";
 import { F as L } from "../bundled/form-associated.js";
 import { W as O } from "../bundled/with-contextual-help.js";

package/option/index.cjs

@@ -1 +1 @@
-"use strict";const i=require("../bundled/definition11.cjs");i.registerOption();
+"use strict";const i=require("../bundled/definition12.cjs");i.registerOption();

package/option/index.js

@@ -1,2 +1,2 @@
-import { r } from "../bundled/definition11.js";
+import { r } from "../bundled/definition12.js";
 r();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vonage/vivid",
-  "version": "5.4.0",
+  "version": "5.5.0",
   "type": "module",
   "module": "./index.js",
   "main": "./index.cjs",

package/progress-ring/index.cjs

@@ -1 +1 @@
-"use strict";const e=require("../bundled/definition15.cjs");e.registerProgressRing();
+"use strict";const e=require("../bundled/definition16.cjs");e.registerProgressRing();

package/progress-ring/index.js

@@ -1,2 +1,2 @@
-import { r } from "../bundled/definition15.js";
+import { r } from "../bundled/definition16.js";
 r();

package/radio/index.cjs

@@ -1 +1 @@
-"use strict";const i=require("../bundled/definition17.cjs");i.registerRadio();
+"use strict";const i=require("../bundled/definition18.cjs");i.registerRadio();

package/radio/index.js

@@ -1,2 +1,2 @@
-import { r } from "../bundled/definition17.js";
+import { r } from "../bundled/definition18.js";
 r();

package/radio-group/index.cjs

@@ -1,4 +1,4 @@
-"use strict";const r=require("../bundled/vivid-element.cjs"),c=require("../bundled/definition17.cjs"),f=require("../bundled/mixins.cjs"),n=require("../bundled/key-codes.cjs"),g=require("../bundled/aria.cjs"),p=require("../bundled/delegates-aria.cjs"),b=require("../bundled/when.cjs"),u=require("../bundled/slotted.cjs"),v=".base{display:flex;flex-direction:column;gap:8px;--_low-ink-color: var(--vvd-color-neutral-600)}.positioning-region{display:flex;flex-wrap:wrap;gap:8px}.positioning-region.vertical{flex-direction:column}fieldset{display:block;padding:0;border:none;margin:0}legend{padding:0;color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base);margin-block-end:8px}";var y=Object.defineProperty,s=(d,t,e,i)=>{for(var o=void 0,l=d.length-1,h;l>=0;l--)(h=d[l])&&(o=h(t,e,o)||o);return o&&y(t,e,o),o};class a extends f.WithFeedback(r.VividElement){constructor(){super(...arguments),this.errorValidationMessage="",this.orientation=g.Orientation.horizontal,this.slottedRadioButtons=[],this.radioErrorHandler=t=>{const e=t.target;this.errorValidationMessage=e.errorValidationMessage||""},this.radioChangeHandler=t=>{const e=t.target;e.checked&&(this.slottedRadioButtons?.forEach(i=>{i!==e&&(i.checked=!1)}),this.value=e.value,this.#e(e)),t.stopPropagation()},this.moveToRadioByIndex=(t,e)=>{const i=t[e];!this.isInsideToolbar&&!i.readOnly&&(i.checked=!0),i.focus()},this.moveRightOffGroup=()=>{this.nextElementSibling?.focus()},this.moveLeftOffGroup=()=>{this.previousElementSibling?.focus()},this.moveRight=t=>{const e=t.target,i=this.#t;let o=0;if(o=i.indexOf(e)+1,o===i.length&&this.isInsideToolbar&&t.key===n.keyArrowRight){this.moveRightOffGroup();return}o===i.length&&(o=0),this.moveToRadioByIndex(i,o)},this.moveLeft=t=>{const e=t.target,i=this.#t;let o=i.indexOf(e)-1;if(this.isInsideToolbar&&t.key===n.keyArrowLeft&&o<0){this.moveLeftOffGroup();return}o=o<0?i.length-1:o,this.moveToRadioByIndex(i,o)},this.keydownHandler=t=>{switch(t.key){case n.keyEnter:this.checkFocusedRadio(t.target);break;case n.keyArrowRight:case n.keyArrowDown:this.moveRight(t);break;case n.keyArrowLeft:case n.keyArrowUp:this.moveLeft(t);break;default:return!0}}}requiredChanged(){this.slottedRadioButtons?.forEach(t=>{this.required?t.required=!0:t.required=!1})}readOnlyChanged(){this.slottedRadioButtons?.forEach(t=>{this.readOnly?t.readOnly=!0:t.readOnly=!1})}disabledChanged(){this.slottedRadioButtons?.forEach(t=>{this.disabled?t.disabled=!0:t.disabled=!1})}nameChanged(){this.slottedRadioButtons?.forEach(t=>{t.setAttribute("name",this.name)})}valueChanged(){this.slottedRadioButtons?.forEach(t=>{t.value===this.value&&(t.checked=!0)}),this.$emit("change")}handleSlotChange(){this.errorText&&this.slottedRadioButtons?.forEach(t=>{t.errorText=this.errorText})}errorTextChanged(t,e){e?this.errorValidationMessage=e:this.errorValidationMessage=""}get#t(){return this.slottedRadioButtons?.filter(t=>!t.disabled)}slottedRadioButtonsChanged(){this.slottedRadioButtons&&this.slottedRadioButtons.length>0&&this.setupRadioButtons()}get isInsideToolbar(){return!!this.closest('[role="toolbar"]')}connectedCallback(){super.connectedCallback(),this.setupRadioButtons()}disconnectedCallback(){this.slottedRadioButtons?.forEach(t=>{t.removeEventListener("change",this.radioChangeHandler),t.removeEventListener("invalid",this.radioErrorHandler)})}setupRadioButtons(){let t=!1;for(const e of this.slottedRadioButtons)this.name!==void 0&&e.setAttribute("name",this.name),this.disabled&&(e.disabled=!0),this.readOnly&&(e.readOnly=!0),this.required&&(e.required=!0),this.value&&this.value===e.value?(e.checked=!0,this.#e(e),t=!0):e.checked=!1,e.addEventListener("change",this.radioChangeHandler),e.addEventListener("invalid",this.radioErrorHandler);if(this.value===void 0&&this.slottedRadioButtons?.length>0){const e=this.slottedRadioButtons?.filter(i=>i.hasAttribute("checked"));if(e.length>0&&!t){const i=e[e.length-1];i.checked=!0,this.#e(i)}else this.#e(this.slottedRadioButtons[0])}}focusInHandler(t){this.#e(t.target)}#e(t){t.setAttribute("tabindex","0");for(const e of this.slottedRadioButtons)e!==t&&e.setAttribute("tabindex","-1")}checkFocusedRadio(t){t.readOnly||(t.checked=!0)}}s([r.attr],a.prototype,"label");s([r.attr({attribute:"required",mode:"boolean"})],a.prototype,"required");s([r.attr({attribute:"readonly",mode:"boolean"})],a.prototype,"readOnly");s([r.attr({attribute:"disabled",mode:"boolean"})],a.prototype,"disabled");s([r.attr],a.prototype,"name");s([r.attr],a.prototype,"value");s([r.observable],a.prototype,"errorValidationMessage");s([r.attr({attribute:"error-text"})],a.prototype,"errorText");s([r.attr],a.prototype,"orientation");s([r.observable],a.prototype,"slottedRadioButtons");const R=d=>{const t=d.tagFor(c.Radio,!0);return r.html`
+"use strict";const r=require("../bundled/vivid-element.cjs"),c=require("../bundled/definition18.cjs"),f=require("../bundled/mixins.cjs"),n=require("../bundled/key-codes.cjs"),g=require("../bundled/aria.cjs"),p=require("../bundled/delegates-aria.cjs"),b=require("../bundled/when.cjs"),u=require("../bundled/slotted.cjs"),v=".base{display:flex;flex-direction:column;gap:8px;--_low-ink-color: var(--vvd-color-neutral-600)}.positioning-region{display:flex;flex-wrap:wrap;gap:8px}.positioning-region.vertical{flex-direction:column}fieldset{display:block;padding:0;border:none;margin:0}legend{padding:0;color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base);margin-block-end:8px}";var y=Object.defineProperty,s=(d,t,e,i)=>{for(var o=void 0,l=d.length-1,h;l>=0;l--)(h=d[l])&&(o=h(t,e,o)||o);return o&&y(t,e,o),o};class a extends f.WithFeedback(r.VividElement){constructor(){super(...arguments),this.errorValidationMessage="",this.orientation=g.Orientation.horizontal,this.slottedRadioButtons=[],this.radioErrorHandler=t=>{const e=t.target;this.errorValidationMessage=e.errorValidationMessage||""},this.radioChangeHandler=t=>{const e=t.target;e.checked&&(this.slottedRadioButtons?.forEach(i=>{i!==e&&(i.checked=!1)}),this.value=e.value,this.#e(e)),t.stopPropagation()},this.moveToRadioByIndex=(t,e)=>{const i=t[e];!this.isInsideToolbar&&!i.readOnly&&(i.checked=!0),i.focus()},this.moveRightOffGroup=()=>{this.nextElementSibling?.focus()},this.moveLeftOffGroup=()=>{this.previousElementSibling?.focus()},this.moveRight=t=>{const e=t.target,i=this.#t;let o=0;if(o=i.indexOf(e)+1,o===i.length&&this.isInsideToolbar&&t.key===n.keyArrowRight){this.moveRightOffGroup();return}o===i.length&&(o=0),this.moveToRadioByIndex(i,o)},this.moveLeft=t=>{const e=t.target,i=this.#t;let o=i.indexOf(e)-1;if(this.isInsideToolbar&&t.key===n.keyArrowLeft&&o<0){this.moveLeftOffGroup();return}o=o<0?i.length-1:o,this.moveToRadioByIndex(i,o)},this.keydownHandler=t=>{switch(t.key){case n.keyEnter:this.checkFocusedRadio(t.target);break;case n.keyArrowRight:case n.keyArrowDown:this.moveRight(t);break;case n.keyArrowLeft:case n.keyArrowUp:this.moveLeft(t);break;default:return!0}}}requiredChanged(){this.slottedRadioButtons?.forEach(t=>{this.required?t.required=!0:t.required=!1})}readOnlyChanged(){this.slottedRadioButtons?.forEach(t=>{this.readOnly?t.readOnly=!0:t.readOnly=!1})}disabledChanged(){this.slottedRadioButtons?.forEach(t=>{this.disabled?t.disabled=!0:t.disabled=!1})}nameChanged(){this.slottedRadioButtons?.forEach(t=>{t.setAttribute("name",this.name)})}valueChanged(){this.slottedRadioButtons?.forEach(t=>{t.value===this.value&&(t.checked=!0)}),this.$emit("change")}handleSlotChange(){this.errorText&&this.slottedRadioButtons?.forEach(t=>{t.errorText=this.errorText})}errorTextChanged(t,e){e?this.errorValidationMessage=e:this.errorValidationMessage=""}get#t(){return this.slottedRadioButtons?.filter(t=>!t.disabled)}slottedRadioButtonsChanged(){this.slottedRadioButtons&&this.slottedRadioButtons.length>0&&this.setupRadioButtons()}get isInsideToolbar(){return!!this.closest('[role="toolbar"]')}connectedCallback(){super.connectedCallback(),this.setupRadioButtons()}disconnectedCallback(){this.slottedRadioButtons?.forEach(t=>{t.removeEventListener("change",this.radioChangeHandler),t.removeEventListener("invalid",this.radioErrorHandler)})}setupRadioButtons(){let t=!1;for(const e of this.slottedRadioButtons)this.name!==void 0&&e.setAttribute("name",this.name),this.disabled&&(e.disabled=!0),this.readOnly&&(e.readOnly=!0),this.required&&(e.required=!0),this.value&&this.value===e.value?(e.checked=!0,this.#e(e),t=!0):e.checked=!1,e.addEventListener("change",this.radioChangeHandler),e.addEventListener("invalid",this.radioErrorHandler);if(this.value===void 0&&this.slottedRadioButtons?.length>0){const e=this.slottedRadioButtons?.filter(i=>i.hasAttribute("checked"));if(e.length>0&&!t){const i=e[e.length-1];i.checked=!0,this.#e(i)}else this.#e(this.slottedRadioButtons[0])}}focusInHandler(t){this.#e(t.target)}#e(t){t.setAttribute("tabindex","0");for(const e of this.slottedRadioButtons)e!==t&&e.setAttribute("tabindex","-1")}checkFocusedRadio(t){t.readOnly||(t.checked=!0)}}s([r.attr],a.prototype,"label");s([r.attr({attribute:"required",mode:"boolean"})],a.prototype,"required");s([r.attr({attribute:"readonly",mode:"boolean"})],a.prototype,"readOnly");s([r.attr({attribute:"disabled",mode:"boolean"})],a.prototype,"disabled");s([r.attr],a.prototype,"name");s([r.attr],a.prototype,"value");s([r.observable],a.prototype,"errorValidationMessage");s([r.attr({attribute:"error-text"})],a.prototype,"errorText");s([r.attr],a.prototype,"orientation");s([r.observable],a.prototype,"slottedRadioButtons");const R=d=>{const t=d.tagFor(c.Radio,!0);return r.html`
 		<template
 			@keydown="${(e,i)=>e.keydownHandler(i.event)}"
 			@focusin="${(e,i)=>e.focusInHandler(i.event)}"

package/radio-group/index.js

@@ -1,5 +1,5 @@
 import { V as p, a as r, o as f, h, c as b, d as v } from "../bundled/vivid-element.js";
-import { R as m, a as y } from "../bundled/definition17.js";
+import { R as m, a as y } from "../bundled/definition18.js";
 import { W as R, f as k } from "../bundled/mixins.js";
 import { g as u, h as c, c as B, b as x, f as O } from "../bundled/key-codes.js";
 import { O as g } from "../bundled/aria.js";

package/rich-text-editor/index.cjs

@@ -1,4 +1,4 @@
-"use strict";const C=require("../bundled/vivid-element.cjs"),Zt=require("../bundled/definition3.cjs"),zr=require("../bundled/definition14.cjs"),Br=require("../bundled/definition11.cjs"),dt=require("../bundled/definition18.cjs"),Fr=require("../bundled/definition6.cjs"),Vr=require("../bundled/definition7.cjs"),Lr=require("../bundled/definition19.cjs"),$r=require("../bundled/divider.cjs"),Qt=require("../bundled/repeat.cjs"),gn=require("../bundled/class-names.cjs"),qr=require("../bundled/localized.cjs"),Wr=require("../bundled/definition2.cjs"),ys=require("../bundled/when.cjs"),xs='@charset "UTF-8";.ProseMirror li{position:relative}.ProseMirror-hideselection *::selection{background:transparent}.ProseMirror-hideselection *::-moz-selection{background:transparent}.ProseMirror-hideselection{caret-color:transparent}.ProseMirror [draggable][contenteditable=false]{user-select:text}.ProseMirror-selectednode{outline:2px solid #8cf}li.ProseMirror-selectednode{outline:none}li.ProseMirror-selectednode:after{content:"";position:absolute;inset:-2px -2px -2px -32px;border:2px solid #8cf;pointer-events:none}img.ProseMirror-separator{display:inline!important;border:none!important;margin:0!important}.ProseMirror-textblock-dropdown{min-width:3em}.ProseMirror-menu{margin:0 -4px;line-height:1}.ProseMirror-tooltip .ProseMirror-menu{width:-webkit-fit-content;width:fit-content;white-space:pre}.ProseMirror-menuitem{margin-right:3px;display:inline-block}.ProseMirror-menuseparator{border-right:1px solid #ddd;margin-right:3px}.ProseMirror-menu-dropdown,.ProseMirror-menu-dropdown-menu{font-size:90%;white-space:nowrap}.ProseMirror-menu-dropdown{vertical-align:1px;cursor:pointer;position:relative;padding-right:15px}.ProseMirror-menu-dropdown-wrap{padding:1px 0 1px 4px;display:inline-block;position:relative}.ProseMirror-menu-dropdown:after{content:"";border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid currentColor;opacity:.6;position:absolute;right:4px;top:calc(50% - 2px)}.ProseMirror-menu-dropdown-menu,.ProseMirror-menu-submenu{position:absolute;background:#fff;color:#666;border:1px solid #aaa;padding:2px}.ProseMirror-menu-dropdown-menu{z-index:15;min-width:6em}.ProseMirror-menu-dropdown-item{cursor:pointer;padding:2px 8px 2px 4px}@media (hover: hover){.ProseMirror-menu-dropdown-item:hover{background:#f2f2f2}}.ProseMirror-menu-submenu-wrap{position:relative;margin-right:-4px}.ProseMirror-menu-submenu-label:after{content:"";border-top:4px solid transparent;border-bottom:4px solid transparent;border-left:4px solid currentColor;opacity:.6;position:absolute;right:4px;top:calc(50% - 4px)}.ProseMirror-menu-submenu{display:none;min-width:4em;left:100%;top:-3px}.ProseMirror-menu-active{background:#eee;border-radius:4px}.ProseMirror-menu-disabled{opacity:.3}.ProseMirror-menu-submenu-wrap:hover .ProseMirror-menu-submenu,.ProseMirror-menu-submenu-wrap-active .ProseMirror-menu-submenu{display:block}.ProseMirror-menubar{border-top-left-radius:inherit;border-top-right-radius:inherit;position:relative;min-height:1em;color:#666;padding:1px 6px;top:0;left:0;right:0;border-bottom:1px solid silver;background:#fff;z-index:10;-moz-box-sizing:border-box;box-sizing:border-box;overflow:visible}.ProseMirror-icon{display:inline-block;line-height:.8;vertical-align:-2px;padding:2px 8px;cursor:pointer}.ProseMirror-menu-disabled.ProseMirror-icon{cursor:default}.ProseMirror-icon svg{fill:currentColor;height:1em}.ProseMirror-icon span{vertical-align:text-top}.ProseMirror-gapcursor{display:none;pointer-events:none;position:absolute}.ProseMirror-gapcursor:after{content:"";display:block;position:absolute;top:-2px;width:20px;border-top:1px solid black;animation:ProseMirror-cursor-blink 1.1s steps(2,start) infinite}@keyframes ProseMirror-cursor-blink{to{visibility:hidden}}.ProseMirror-focused .ProseMirror-gapcursor{display:block}.ProseMirror-example-setup-style hr{padding:2px 10px;border:none;margin:1em 0}.ProseMirror-example-setup-style hr:after{content:"";display:block;height:1px;background-color:silver;line-height:2px}.ProseMirror ul,.ProseMirror ol{padding-left:30px}.ProseMirror blockquote{padding-left:1em;border-left:3px solid #eee;margin-left:0;margin-right:0}.ProseMirror-example-setup-style img{cursor:default}.ProseMirror-prompt{background:#fff;padding:5px 10px 5px 15px;border:1px solid silver;position:fixed;border-radius:3px;z-index:11;box-shadow:-.5px 2px 5px #0003}.ProseMirror-prompt h5{margin:0;font-weight:400;font-size:100%;color:#444}.ProseMirror-prompt input[type=text],.ProseMirror-prompt textarea{background:#eee;border:none;outline:none}.ProseMirror-prompt input[type=text]{padding:0 4px}.ProseMirror-prompt-close{position:absolute;left:2px;top:1px;color:#666;border:none;background:transparent;padding:0}.ProseMirror-prompt-close:after{content:"✕";font-size:12px}.ProseMirror-invalid{background:#ffc;border:1px solid #cc7;border-radius:4px;padding:5px 10px;position:absolute;min-width:10em}.ProseMirror-prompt-buttons{margin-top:5px;display:none}.placeholder:before{position:absolute;color:var(--vvd-color-neutral-600);content:attr(data-placeholder);font:var(--vvd-typography-base);pointer-events:none}.editor{box-sizing:border-box;background:var(--vvd-color-canvas);background-clip:padding-box;color:var(--vvd-color-canvas-text)}.ProseMirror{position:relative;box-sizing:border-box;padding:10px 16px;block-size:120px;font:var(--vvd-typography-base);font-feature-settings:"liga" 0;font-variant-ligatures:none;line-height:1.2;outline:none;overflow-y:auto;white-space:break-spaces;word-wrap:break-word}.ProseMirror pre{white-space:pre-wrap}.ProseMirror p{margin-bottom:1em}.ProseMirror p:first-child,.ProseMirror h1:first-child,.ProseMirror h2:first-child,.ProseMirror h3:first-child,.ProseMirror h4:first-child,.ProseMirror h5:first-child,.ProseMirror h6:first-child{margin-top:10px}h2{font:var(--vvd-typography-heading-4)}h3{font:var(--vvd-typography-base-extended)}p{font:var(--vvd-typography-base)}:host{display:block}#editor{--scrollbar-track-color: transparent;--scrollbar-thumb-color: color-mix(in srgb, var(--vvd-color-neutral-950), transparent 70%)}#editor{scrollbar-color:var(--scrollbar-thumb-color) var(--scrollbar-track-color);scrollbar-width:thin}#editor ::-webkit-scrollbar{width:4px}#editor ::-webkit-scrollbar-track{background:var(--scrollbar-track-color)}#editor ::-webkit-scrollbar-thumb{border:0;border-radius:4px;background-color:var(--scrollbar-fallback-track-color, var(--scrollbar-thumb-color))}#editor{position:relative;display:flex;flex-direction:column;block-size:100%;overflow-y:auto}[contenteditable=true]{overflow:unset;block-size:unset}#attachments-wrapper{order:1}#attachments-wrapper .divider{padding:0 12px}.hidden{display:none}.drag-overlay{position:absolute;z-index:10;display:none;align-items:center;justify-content:center;border:1px dashed var(--vvd-color-cta-400);border-radius:8px;background:var(--vvd-color-cta-100);font:var(--vvd-typography-base);inset:0;opacity:.8;pointer-events:none;transition:opacity .2s}.drag-over .drag-overlay{display:flex}';function It(r,e,t){return r.$emit(e,t,{bubbles:!1,composed:!1}),!0}const Jr=[{text:"Bold",icon:"bold-line",value:"bold"},{text:"Italic",icon:"italic-line",value:"italics"},{text:"Underline",icon:"underline-line",value:"underline"},{text:"Strikethrough",icon:"strikethrough-line",value:"strikethrough"},{text:"Monospace",icon:"monospace-line",value:"monospace"}],bs=[{text:"Extra Large",value:"extra-large"},{text:"Large",value:"large"},{text:"Normal",value:"normal"},{text:"Small",value:"small"}],ks=r=>{const e=r;if(!e||!e.detail||e.detail.textBlockType===void 0)return;e.target.shadowRoot.querySelector("#text-block").setAttribute("current-value",e.detail.textBlockType)},Ss=r=>{const e=r;if(!e||!e.detail)return;const n=e.target.shadowRoot.querySelectorAll("#text-decoration .selection-button");n.forEach(i=>i.removeAttribute("active")),e.detail.textDecoration!==void 0&&Jr.forEach((i,s)=>{e.detail.textDecoration.indexOf(i.value)>=0&&n[s].toggleAttribute("active",!0)})},Ms=r=>{const e=r;if(!e||!e.detail)return;const t=e.target,n=e.detail.textSize??"normal";t.shadowRoot.querySelectorAll(".menubar-selector-menuitem").forEach(s=>{s.toggleAttribute("checked",s.getAttribute("value")===n)})},Kr={textBlock:{registerStateProperty:function(r){r.addEventListener("text-styles-changed",ks)},render:function(r){const e=r.tagFor(Lr.Select),t=r.tagFor(Br.ListboxOption),n=r.tagFor(dt.Tooltip);return C.html`
+"use strict";const C=require("../bundled/vivid-element.cjs"),Zt=require("../bundled/definition3.cjs"),zr=require("../bundled/definition15.cjs"),Br=require("../bundled/definition12.cjs"),dt=require("../bundled/definition11.cjs"),Fr=require("../bundled/definition6.cjs"),Vr=require("../bundled/definition7.cjs"),Lr=require("../bundled/definition19.cjs"),$r=require("../bundled/divider.cjs"),Qt=require("../bundled/repeat.cjs"),gn=require("../bundled/class-names.cjs"),qr=require("../bundled/localized.cjs"),Wr=require("../bundled/definition2.cjs"),ys=require("../bundled/when.cjs"),xs='@charset "UTF-8";.ProseMirror li{position:relative}.ProseMirror-hideselection *::selection{background:transparent}.ProseMirror-hideselection *::-moz-selection{background:transparent}.ProseMirror-hideselection{caret-color:transparent}.ProseMirror [draggable][contenteditable=false]{user-select:text}.ProseMirror-selectednode{outline:2px solid #8cf}li.ProseMirror-selectednode{outline:none}li.ProseMirror-selectednode:after{content:"";position:absolute;inset:-2px -2px -2px -32px;border:2px solid #8cf;pointer-events:none}img.ProseMirror-separator{display:inline!important;border:none!important;margin:0!important}.ProseMirror-textblock-dropdown{min-width:3em}.ProseMirror-menu{margin:0 -4px;line-height:1}.ProseMirror-tooltip .ProseMirror-menu{width:-webkit-fit-content;width:fit-content;white-space:pre}.ProseMirror-menuitem{margin-right:3px;display:inline-block}.ProseMirror-menuseparator{border-right:1px solid #ddd;margin-right:3px}.ProseMirror-menu-dropdown,.ProseMirror-menu-dropdown-menu{font-size:90%;white-space:nowrap}.ProseMirror-menu-dropdown{vertical-align:1px;cursor:pointer;position:relative;padding-right:15px}.ProseMirror-menu-dropdown-wrap{padding:1px 0 1px 4px;display:inline-block;position:relative}.ProseMirror-menu-dropdown:after{content:"";border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid currentColor;opacity:.6;position:absolute;right:4px;top:calc(50% - 2px)}.ProseMirror-menu-dropdown-menu,.ProseMirror-menu-submenu{position:absolute;background:#fff;color:#666;border:1px solid #aaa;padding:2px}.ProseMirror-menu-dropdown-menu{z-index:15;min-width:6em}.ProseMirror-menu-dropdown-item{cursor:pointer;padding:2px 8px 2px 4px}@media (hover: hover){.ProseMirror-menu-dropdown-item:hover{background:#f2f2f2}}.ProseMirror-menu-submenu-wrap{position:relative;margin-right:-4px}.ProseMirror-menu-submenu-label:after{content:"";border-top:4px solid transparent;border-bottom:4px solid transparent;border-left:4px solid currentColor;opacity:.6;position:absolute;right:4px;top:calc(50% - 4px)}.ProseMirror-menu-submenu{display:none;min-width:4em;left:100%;top:-3px}.ProseMirror-menu-active{background:#eee;border-radius:4px}.ProseMirror-menu-disabled{opacity:.3}.ProseMirror-menu-submenu-wrap:hover .ProseMirror-menu-submenu,.ProseMirror-menu-submenu-wrap-active .ProseMirror-menu-submenu{display:block}.ProseMirror-menubar{border-top-left-radius:inherit;border-top-right-radius:inherit;position:relative;min-height:1em;color:#666;padding:1px 6px;top:0;left:0;right:0;border-bottom:1px solid silver;background:#fff;z-index:10;-moz-box-sizing:border-box;box-sizing:border-box;overflow:visible}.ProseMirror-icon{display:inline-block;line-height:.8;vertical-align:-2px;padding:2px 8px;cursor:pointer}.ProseMirror-menu-disabled.ProseMirror-icon{cursor:default}.ProseMirror-icon svg{fill:currentColor;height:1em}.ProseMirror-icon span{vertical-align:text-top}.ProseMirror-gapcursor{display:none;pointer-events:none;position:absolute}.ProseMirror-gapcursor:after{content:"";display:block;position:absolute;top:-2px;width:20px;border-top:1px solid black;animation:ProseMirror-cursor-blink 1.1s steps(2,start) infinite}@keyframes ProseMirror-cursor-blink{to{visibility:hidden}}.ProseMirror-focused .ProseMirror-gapcursor{display:block}.ProseMirror-example-setup-style hr{padding:2px 10px;border:none;margin:1em 0}.ProseMirror-example-setup-style hr:after{content:"";display:block;height:1px;background-color:silver;line-height:2px}.ProseMirror ul,.ProseMirror ol{padding-left:30px}.ProseMirror blockquote{padding-left:1em;border-left:3px solid #eee;margin-left:0;margin-right:0}.ProseMirror-example-setup-style img{cursor:default}.ProseMirror-prompt{background:#fff;padding:5px 10px 5px 15px;border:1px solid silver;position:fixed;border-radius:3px;z-index:11;box-shadow:-.5px 2px 5px #0003}.ProseMirror-prompt h5{margin:0;font-weight:400;font-size:100%;color:#444}.ProseMirror-prompt input[type=text],.ProseMirror-prompt textarea{background:#eee;border:none;outline:none}.ProseMirror-prompt input[type=text]{padding:0 4px}.ProseMirror-prompt-close{position:absolute;left:2px;top:1px;color:#666;border:none;background:transparent;padding:0}.ProseMirror-prompt-close:after{content:"✕";font-size:12px}.ProseMirror-invalid{background:#ffc;border:1px solid #cc7;border-radius:4px;padding:5px 10px;position:absolute;min-width:10em}.ProseMirror-prompt-buttons{margin-top:5px;display:none}.placeholder:before{position:absolute;color:var(--vvd-color-neutral-600);content:attr(data-placeholder);font:var(--vvd-typography-base);pointer-events:none}.editor{box-sizing:border-box;background:var(--vvd-color-canvas);background-clip:padding-box;color:var(--vvd-color-canvas-text)}.ProseMirror{position:relative;box-sizing:border-box;padding:10px 16px;block-size:120px;font:var(--vvd-typography-base);font-feature-settings:"liga" 0;font-variant-ligatures:none;line-height:1.2;outline:none;overflow-y:auto;white-space:break-spaces;word-wrap:break-word}.ProseMirror pre{white-space:pre-wrap}.ProseMirror p{margin-bottom:1em}.ProseMirror p:first-child,.ProseMirror h1:first-child,.ProseMirror h2:first-child,.ProseMirror h3:first-child,.ProseMirror h4:first-child,.ProseMirror h5:first-child,.ProseMirror h6:first-child{margin-top:10px}h2{font:var(--vvd-typography-heading-4)}h3{font:var(--vvd-typography-base-extended)}p{font:var(--vvd-typography-base)}:host{display:block}#editor{--scrollbar-track-color: transparent;--scrollbar-thumb-color: color-mix(in srgb, var(--vvd-color-neutral-950), transparent 70%)}#editor{scrollbar-color:var(--scrollbar-thumb-color) var(--scrollbar-track-color);scrollbar-width:thin}#editor ::-webkit-scrollbar{width:4px}#editor ::-webkit-scrollbar-track{background:var(--scrollbar-track-color)}#editor ::-webkit-scrollbar-thumb{border:0;border-radius:4px;background-color:var(--scrollbar-fallback-track-color, var(--scrollbar-thumb-color))}#editor{position:relative;display:flex;flex-direction:column;block-size:100%;overflow-y:auto}[contenteditable=true]{overflow:unset;block-size:unset}#attachments-wrapper{order:1}#attachments-wrapper .divider{padding:0 12px}.hidden{display:none}.drag-overlay{position:absolute;z-index:10;display:none;align-items:center;justify-content:center;border:1px dashed var(--vvd-color-cta-400);border-radius:8px;background:var(--vvd-color-cta-100);font:var(--vvd-typography-base);inset:0;opacity:.8;pointer-events:none;transition:opacity .2s}.drag-over .drag-overlay{display:flex}';function It(r,e,t){return r.$emit(e,t,{bubbles:!1,composed:!1}),!0}const Jr=[{text:"Bold",icon:"bold-line",value:"bold"},{text:"Italic",icon:"italic-line",value:"italics"},{text:"Underline",icon:"underline-line",value:"underline"},{text:"Strikethrough",icon:"strikethrough-line",value:"strikethrough"},{text:"Monospace",icon:"monospace-line",value:"monospace"}],bs=[{text:"Extra Large",value:"extra-large"},{text:"Large",value:"large"},{text:"Normal",value:"normal"},{text:"Small",value:"small"}],ks=r=>{const e=r;if(!e||!e.detail||e.detail.textBlockType===void 0)return;e.target.shadowRoot.querySelector("#text-block").setAttribute("current-value",e.detail.textBlockType)},Ss=r=>{const e=r;if(!e||!e.detail)return;const n=e.target.shadowRoot.querySelectorAll("#text-decoration .selection-button");n.forEach(i=>i.removeAttribute("active")),e.detail.textDecoration!==void 0&&Jr.forEach((i,s)=>{e.detail.textDecoration.indexOf(i.value)>=0&&n[s].toggleAttribute("active",!0)})},Ms=r=>{const e=r;if(!e||!e.detail)return;const t=e.target,n=e.detail.textSize??"normal";t.shadowRoot.querySelectorAll(".menubar-selector-menuitem").forEach(s=>{s.toggleAttribute("checked",s.getAttribute("value")===n)})},Kr={textBlock:{registerStateProperty:function(r){r.addEventListener("text-styles-changed",ks)},render:function(r){const e=r.tagFor(Lr.Select),t=r.tagFor(Br.ListboxOption),n=r.tagFor(dt.Tooltip);return C.html`
 		<${n} text="${(i,{parent:s})=>s.locale.richTextEditor.textBlockType}" placement="top">
 			<${e}
                 scale="condensed"

package/rich-text-editor/index.js

@@ -1,8 +1,8 @@
 import { h as U, V as gn, a as ge, d as yn, U as gs, n as Vr, c as ys } from "../bundled/vivid-element.js";
 import { B as Fn, b as xs } from "../bundled/definition3.js";
-import { d as Lr } from "../bundled/definition14.js";
-import { L as bs, l as ks } from "../bundled/definition11.js";
-import { T as It, t as Ss } from "../bundled/definition18.js";
+import { d as Lr } from "../bundled/definition15.js";
+import { L as bs, l as ks } from "../bundled/definition12.js";
+import { T as It, t as Ss } from "../bundled/definition11.js";
 import { M as Ms, m as Cs } from "../bundled/definition6.js";
 import { M as Os, m as ws } from "../bundled/definition7.js";
 import { S as Ts, s as Ns } from "../bundled/definition19.js";

package/searchable-select/index.cjs

@@ -1,4 +1,4 @@
-"use strict";const x=require("../bundled/definition3.cjs"),F=require("../bundled/definition9.cjs"),y=require("../bundled/definition2.cjs"),$=require("../bundled/definition11.cjs"),A=require("../bundled/definition15.cjs"),i=require("../bundled/vivid-element.cjs"),D=require("../bundled/mixins.cjs"),E=require("../bundled/definition14.cjs"),z=require("../bundled/scrollIntoView.cjs"),V=require("../bundled/delegates-aria.cjs"),L=require("../bundled/form-associated.cjs"),q=require("../bundled/with-contextual-help.cjs"),M=require("../bundled/with-error-text.cjs"),P=require("../bundled/with-success-text.cjs"),N=require("../bundled/form-element.cjs"),w=require("../bundled/affix.cjs"),R=require("../bundled/localized.cjs"),B=require("../bundled/divider.cjs"),p=require("../bundled/when.cjs"),S=require("../bundled/slotted.cjs"),_=require("../bundled/ref.cjs"),m=require("../bundled/repeat.cjs"),O=require("../bundled/class-names.cjs"),W=".chevron{display:flex;flex-shrink:0;font:var(--vvd-typography-base-extended);transform:rotate(0);transition:transform .2s}:host([data-expanded=true]) .chevron,:host([open]) .chevron{transform:rotate(180deg)}:not(.disabled) .chevron{cursor:pointer}.disabled .chevron{color:var(--_low-ink-color);cursor:not-allowed}:host(:focus-visible){outline:none}:host{display:inline-block;inline-size:300px;--_low-ink-color: var(--vvd-color-neutral-600)}:host([disabled]){--_low-ink-color: var(--vvd-color-neutral-400);cursor:not-allowed}.control-wrapper{display:flex;flex-direction:column;gap:4px}.label{color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base)}.selection-count{color:var(--_low-ink-color);font:var(--vvd-typography-base)}.fieldset{--_connotation-color-primary: var(--vvd-searchable-select-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-searchable-select-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-searchable-select-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-intermediate: var(--vvd-searchable-select-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-faint: var(--vvd-searchable-select-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-searchable-select-accent-soft, var(--vvd-color-neutral-100));--_connotation-color-firm: var(--vvd-searchable-select-accent-firm, var(--vvd-color-canvas-text));--_connotation-color-fierce: var(--vvd-searchable-select-accent-fierce, var(--vvd-color-neutral-700))}.fieldset{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-500)}.fieldset.appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}@media (hover: hover){.fieldset:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-700)}.fieldset:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}}.fieldset.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-700)}.fieldset.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}.fieldset:disabled{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.fieldset:disabled.appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.fieldset.disabled{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.fieldset.disabled.appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.fieldset.readonly:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-neutral-200);--_appearance-color-outline: var(--vvd-color-neutral-400)}.fieldset.readonly:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-600);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.fieldset.error:where(:not(.disabled,:disabled)){--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: var(--vvd-color-alert-500)}.fieldset.error:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: transparent}.fieldset.success:where(:not(.disabled,:disabled)){--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: var(--vvd-color-success-500)}.fieldset.success:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: transparent}.fieldset{display:flex;align-items:center;justify-content:space-between;background-color:var(--_appearance-color-fill);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);font:var(--vvd-typography-base);gap:8px;padding-block:8px;padding-inline:16px;transition:box-shadow .2s,background-color .2s}@supports selector(:has(*)){.fieldset:not(.has-highlighted-option):has(input:focus){box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px));--focus-stroke-gap-color: transparent}}@supports not selector(:has(*)){.fieldset:not(.has-highlighted-option):focus-within{box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px));--focus-stroke-gap-color: transparent}}:host(:not([shape=pill])) .fieldset{border-radius:8px}:host([shape=pill]) .fieldset{border-radius:24px}.popup-wrapper{position:relative}.content-area{display:flex;overflow:hidden;flex:1;flex-direction:column;gap:8px;min-block-size:24px}.tag-row{display:flex;gap:8px;inline-size:100%}.tag-row.contains-only-input:not(:focus-within){display:contents}.tag-wrapper{overflow:hidden}.tag{max-inline-size:100%}input{box-sizing:border-box;flex:1;border:none;background:none;block-size:24px;font:var(--vvd-typography-base);max-inline-size:100%;min-inline-size:min(100px,40%);outline:none}.contains-only-input input:not(:focus){position:absolute;block-size:0;inline-size:0;min-inline-size:0;opacity:0;pointer-events:none}.listbox{display:flex;flex-direction:column;padding:4px;gap:2px;max-block-size:var(--searchable-select-height, 408px);overflow-y:auto}.empty-message{display:flex;align-items:center;justify-content:center;color:var(--vvd-color-neutral-300);font:var(--vvd-typography-base);min-block-size:40px;text-align:center}::part(popup-base){inline-size:max-content;min-inline-size:var(--_searchable-select-fixed-width, 100%)}slot[name=icon]{font-size:20px}.visually-hidden{position:absolute;overflow:hidden;width:1px;height:1px;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}::slotted([data-vvd-component=option][data-highlighted]),[data-select-all][data-highlighted]{border-radius:8px;box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px));--focus-stroke-gap-color: transparent}.divider{margin-block:10px;margin-inline:12px}.label-wrapper{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:var(--label-wrapper-gap, 8px)}.label-wrapper[hidden]{display:none}.label-wrapper .label{flex:1 1 auto}.label-wrapper slot[name=contextual-help]::slotted([data-vvd-component=contextual-help]){margin-inline-start:auto}",H='.base.connotation-cta{--_connotation-color-contrast: var(--vvd-option-tag-cta-contrast, var(--vvd-color-cta-800))}.base:not(.connotation-cta){--_connotation-color-contrast: var(--vvd-option-tag-accent-contrast, var(--vvd-color-neutral-800))}.base{position:relative;display:inline-flex;box-sizing:border-box;align-items:center;background-color:var(--fill-color);block-size:calc(1px*(24 + 4*clamp(-1,var(--vvd-size-density, 0),2)));box-shadow:inset 0 0 0 1px var(--outline-color);color:var(--text-color);column-gap:8px;font:var(--vvd-typography-base-bold);max-inline-size:100%;padding-inline:8px;user-select:none;vertical-align:middle}.base:not(.disabled){--text-color: var(--_connotation-color-contrast);--fill-color: var(--_connotation-color-soft);--outline-color: transparent}@supports (background-color: color-mix(in srgb,black 50%,white)){.base:not(.disabled){--fill-color: color-mix( in srgb, var(--_connotation-color-contrast), transparent 87.5% )}}.base.disabled{--text-color: var(--vvd-color-neutral-300);--fill-color: var(--vvd-color-neutral-200);--outline-color: transparent}@supports (background-color: color-mix(in srgb,black 50%,white)){.base.disabled{--fill-color: color-mix( in srgb, var(--vvd-color-neutral-800), transparent 87.5% )}}.base:not(.shape-pill){border-radius:4px}.base.shape-pill{border-radius:16px}.label{overflow:hidden;max-inline-size:100%;text-overflow:ellipsis;white-space:nowrap}slot[name=icon]{font-size:calc(calc(1px*(24 + 4*clamp(-1,var(--vvd-size-density, 0),2))) / 1.5);line-height:1}.icon-placeholder{inline-size:calc(calc(1px*(24 + 4*clamp(-1,var(--vvd-size-density, 0),2))) / 1.5)}.remove-button{display:flex;align-items:center;border-radius:inherit;cursor:pointer;outline:none}.disabled .remove-button{pointer-events:none}.remove-button:focus-visible:before{--focus-stroke-gap-color: transparent;box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px));position:absolute;z-index:1;display:block;border-radius:inherit;content:"";inset:0;pointer-events:none}';var K=Object.defineProperty,c=(s,t,e,o)=>{for(var a=void 0,n=s.length-1,v;n>=0;n--)(v=s[n])&&(a=v(t,e,a)||a);return a&&K(t,e,a),a};const f=8,j=100,k=10,U=s=>typeof s=="string";class r extends q.WithContextualHelp(D.WithFeedback(M.WithErrorText(P.WithSuccessText(N.FormElement(V.DelegatesAria(w.AffixIconWithTrailing(R.Localized(L.FormAssociated(i.VividElement))))))))){constructor(){super(...arguments),this.fixedDropdown=!1,this.open=!1,this.multiple=!1,this.externalTags=!1,this.maxLines=null,this.values=[],this.initialValues=[],this._currentSearchText=null,this._areOptionsInitialized=!1,this.#i={handleChange:(t,e)=>{t.selected&&!this.values.includes(t.value)?this.values=[...this.values,t.value]:!t.selected&&this.values.includes(t.value)&&(this.values=this.values.filter(o=>o!==t.value))}},this.#a=new Map,this._filteredOptions=[],this._filteredEnabledOptions=[],this.loading=!1,this._highlightedOptionIndex=null,this._numElidedTags=0,this._tagRows=[],this._lastTagRow=[],this.clearable=!1,this.maxSelected=null,this._slottedDisabledOptions=[],this.enableSelectAll=!1,this.proxy=document.createElement("input"),this.setFormValue=(t,e)=>{U(t)||super.setFormValue(t,e)},this._changeDescription="",this.#d=new ResizeObserver(()=>{this.#u()})}openChanged(){this.open||this.#e(null)}valuesChanged(){if(this._areOptionsInitialized){if(!this.multiple&&this.values.length>1){this.values=[this.values[0]];return}if(this.values.some(t=>!this.#h(t))){this.values=this.values.filter(t=>this.#h(t));return}this.value=this.values.length?this.values[0]:"",this.#c(),this.#_(),this.$fastController.isConnected&&this.#u(),this.#f()}}#t(t){this.values=t,this.$emit("change",void 0,{bubbles:!1}),this.$emit("input",void 0,{bubbles:!1})}#b(t){const e=new Set(this.values),o=new Set(t);this.values=[...this.values].filter(a=>o.has(a)).concat([...t].filter(a=>!e.has(a)))}initialValuesChanged(){this.dirtyValue||(this.values=this.initialValues,this.dirtyValue=!1)}#h(t){return this._slottedOptions.some(e=>e.value===t)}valueChanged(t,e){if(super.valueChanged(t,e),!this._areOptionsInitialized)return;const o=this._slottedOptions.some(a=>a.value===e);this.values[0]!==e&&(this.values=o?[e]:[])}get selectedIndex(){return this.values.length?this._slottedOptions.findIndex(t=>t.value===this.values[0]):-1}set selectedIndex(t){this.value=this._slottedOptions[t]?.value??""}get options(){return[...this._slottedOptions]}get selectedOptions(){return this._slottedOptions.filter(t=>this.values.includes(t.value))}_currentSearchTextChanged(){this.#o(),this.$emit("search-text-change",void 0,{bubbles:!1,composed:!1})}get searchText(){return this._currentSearchText??""}get _inputValue(){return this._currentSearchText??(!this.multiple&&this.value!==""?this.#k(this.value)??"":"")}_onInputInput(t){this._currentSearchText=t.target.value}_onInputFocus(t){this.#o()}_onInputBlur(t){this.open=!1,this._currentSearchText=null,this._changeDescription=""}_onInputKeydown(t){if(t.ctrlKey||t.shiftKey)return!0;switch(t.key){case"Enter":return this.#x(),this._inputValue===""&&(this.open=!this.open),!1;case"Escape":this.open=!1;break;case"Home":if(!this.open){this.open=!0;break}return this.#w(),!1;case"End":if(!this.open){this.open=!0;break}return this.#y(),!1;case"PageUp":if(!this.open){this.open=!0;break}return this.#$(),!1;case"PageDown":if(!this.open){this.open=!0;break}return this.#O(),!1;case"ArrowUp":if(!this.open){this.open=!0;break}return this.#T(),!1;case"ArrowDown":if(!this.open){this.open=!0;break}return this.#S(),!1;case"ArrowLeft":return this.multiple&&this._inputValue===""&&this.values.length&&!this.externalTags?(this.#l(this.#r(this.values.length)),!1):!0;case"Backspace":return this.multiple&&this._inputValue===""&&this.values.length?(this._onTagRemoved(this.values[this.values.length-1]),!1):!0;default:return this.open||(this.open=!0),!0}return!0}_slottedOptionsChanged(t,e){const o=!!this.querySelectorAll(":not([slot])").length;if(!e.length&&o)return;if(this._areOptionsInitialized=!0,t){this._slottedDisabledOptions=[];for(const n of t)i.Observable.getNotifier(n).unsubscribe(this.#i,"selected")}if(e)for(const n of e)n._displayCheckmark=!0,i.Observable.getNotifier(n).subscribe(this.#i,"selected");const a=[];for(const n of this._slottedOptions)(n.selected||n.value===this.value||this.values.includes(n.value))&&a.push(n.value),n.disabled&&this._slottedDisabledOptions.push(n);this.#b(a),this.#o(),this.#c()}#i;#_(){for(const t of this._slottedOptions)t.selected=this.values.includes(t.value),this.#m(t)}#p(t){const e=t.value;let o,a=!1;const n=!this.values.includes(e);this.multiple?(n?o=[...this.values,e]:o=this.values.filter(u=>u!==e),a=!0):(n?(o=[e],a=!0):o=[],this.open=!1),this.#t(o);const v=n?this.locale.searchableSelect.optionSelectedMessage(t._getAccessibleName()):this.locale.searchableSelect.optionDeselectedMessage(t._getAccessibleName()),h=this.multiple&&this.maxSelected&&this.maxSelected>=1?this.locale.searchableSelect.maxSelectedMessage(this.values.length,this.maxSelected):"";this._changeDescription=`${v} ${h}`,a&&(this._currentSearchText=null)}#a;#s(t){return t.querySelector('[slot="tag-icon"]')}_tagIconSlotName(t){return`_tag-icon-${this.values.indexOf(t)}`}#m(t){if(t.selected&&this.#s(t)){let e=this.#a.get(t);e||(e=this.#s(t).cloneNode(!0),this.#a.set(t,e)),e.slot=this._tagIconSlotName(t.value),this.appendChild(e)}else{const e=this.#a.get(t);e&&(e.remove(),this.#a.delete(t))}}optionFilterChanged(){this.#o()}loadingChanged(t,e){this._changeDescription=this.locale.searchableSelect.loadingOptionsMessage,t&&!e&&(this._changeDescription="")}#o(){const t=[],e=this.optionFilter??((a,n)=>a.text.toLowerCase().includes(n.toLowerCase()));for(const a of this._slottedOptions??[]){a._vvdSearchText=this.searchText;const n=!this.searchText||e(a,this.searchText);a._isNotMatching=!n,!a.hidden&&n&&t.push(a)}this.#e(null),this._filteredOptions=t;const o=t.filter(a=>!a.disabled);this._selectAllOption?this._filteredEnabledOptions=[this._selectAllOption,...o]:this._filteredEnabledOptions=o}#e(t){if(typeof this._highlightedOptionIndex=="number"){const e=this._filteredEnabledOptions[this._highlightedOptionIndex];e._highlighted=!1,e.removeAttribute("data-highlighted")}if(typeof t=="number"&&(this._filteredEnabledOptions.length?t=Math.max(0,Math.min(this._filteredEnabledOptions.length-1,t)):t=null),this._highlightedOptionIndex=t,typeof this._highlightedOptionIndex=="number"){const e=this._filteredEnabledOptions[this._highlightedOptionIndex];e._highlighted=!0,e.setAttribute("data-highlighted",""),z.scrollIntoView(e,this._listbox,"nearest"),this._changeDescription=this.locale.searchableSelect.optionFocusedMessage(e._getAccessibleName(),this._highlightedOptionIndex+1,this._filteredEnabledOptions.length,e.selected)}}#x(){if(this._highlightedOptionIndex===null)return;const t=this._filteredEnabledOptions[this._highlightedOptionIndex];if(t.getAttribute("data-select-all")!==null){this._toggleSelectAll();return}this.#p(t)}#w(){this.#e(0)}#y(){this.#e(this._filteredEnabledOptions.length-1)}#$(){this.#e((this._highlightedOptionIndex??this._filteredEnabledOptions.length)-k)}#O(){this.#e((this._highlightedOptionIndex??-1)+k)}#T(){this.#e((this._highlightedOptionIndex??this._filteredEnabledOptions.length)-1)}#S(){this.#e((this._highlightedOptionIndex??-1)+1)}_tagLabelForValue(t){return this._slottedOptions.find(o=>o.value===t).label}_tagConnotationForValue(t){return this._slottedOptions.find(o=>o.value===t).tagConnotation}_isTagDisabled(t){const e=this._slottedOptions.find(o=>o.value===t);return this.disabled||e.disabled}#k(t){return this._slottedOptions?.find(o=>o.value===t)?.label}#n(t,e,o){const a=document.createElement(this._optionTagTagName);a.label=t,a.removable=e,a.style.cssText="position: absolute; visibility: hidden;",a.hasIconPlaceholder=o,this.shadowRoot.appendChild(a);const n=a.getBoundingClientRect().width;return a.remove(),n}#u(){if(!this.multiple){this._numElidedTags=0,this._tagRows=[],this._lastTagRow=[];return}if(this.externalTags){this._numElidedTags=this.values.length,this._tagRows=[],this._lastTagRow=[];return}const t=this._contentArea.getBoundingClientRect().width,e=[[]];let o=0,a=j,n;for(n=this.values.length-1;n>=0;n--){const h=this.maxLines&&o===this.maxLines-1,u=this.#n(this._tagLabelForValue(this.values[n]),!0,this.#s(this.selectedOptions[n])!==null),l={value:this.values[n],width:u};let d=0;if(h){const T=n;T&&(d=f+this.#n(T.toString(),!1,!1))}if(a+f+u+d>t){if(h)if(n===this.values.length-1)e[o].unshift(l),a+=f+u;else break;else e.push([]),o++,e[o].unshift(l),a=u;continue}e[o].unshift(l),a+=f+u}this._numElidedTags=n+1,e.reverse();for(let h=0;h<e.length-1;h++){let u=e[h].map(l=>l.width).reduce((l,d)=>l+d,0)+(e[h].length-1)*f;for(h===0&&this._numElidedTags&&(u+=f+this.#n(this._numElidedTags.toString(),!1,!1));e[h+1].length&&u+f+e[h+1][0].width<=t;){const l=e[h+1].shift();e[h].push(l),u+=f+l.width}}const v=e.map(h=>h.map(u=>u.value));this._tagRows=v.slice(0,-1),this._lastTagRow=v.slice(-1)[0]}_onTagRemoved(t){this.#t(this.values.filter(e=>e!==t)),this.#o()}_onTagKeydown(t){const e=parseInt(t.target.dataset.index);switch(t.key){case"Backspace":case"Delete":case"Enter":case" ":{this._onTagRemoved(this.values[e]),i.Updates.process(),this.#l(this.#C(e));break}case"ArrowLeft":this.#l(this.#r(e)??e);break;case"ArrowRight":this.#l(this.#v(e));break}return!0}#l(t){t===null?this._input.focus():this.shadowRoot.querySelector(`[data-index="${t}"]`)?.focus()}#r(t){if(!this.values.length)return null;for(let e=t-1;e>=0;e--)if(!this._isTagDisabled(this.values[e]))return e;return null}#v(t){if(!this.values.length)return null;for(let e=t+1;e<this.values.length;e++)if(!this._isTagDisabled(this.values[e]))return e;return null}#C(t){return this.#v(t-1)??this.#r(t)}_onListboxClick(t){if(this.disabled)return;const e=t.target.closest("option,[role=option],[data-vvd-component=option]");if(e?.getAttribute("data-select-all")!==null){this._toggleSelectAll();return}e&&!e.disabled&&this.#p(e)}get _shouldShowClearButton(){return this.clearable&&this.values.length>0}_onClearButtonClick(){this.#t(this.selectedOptions.filter(t=>t.disabled).map(t=>t.value))}maxSelectedChanged(){this.#c()}#c(){if(!this.multiple||!this._slottedOptions||typeof this.maxSelected!="number"||this.maxSelected<=0)return;const t=this._slottedOptions.filter(e=>!this._slottedDisabledOptions.includes(e));if(this.values.length>=this.maxSelected){const e=t.filter(o=>!this.selectedOptions.includes(o));for(const o of e)o.disabled=!0}else for(const e of t)e.disabled=!1}get _hasSelectionCount(){return this.multiple&&this.maxSelected&&this.maxSelected>=1}get _selectableOptions(){return this._slottedOptions?.filter(t=>!this._slottedDisabledOptions.includes(t)&&!t.disabled)??[]}get _selectAllLabel(){return this._isAllSelected?this.deselectAllText??this.locale.searchableSelect.deselectAllLabel:this.selectAllText??this.locale.searchableSelect.selectAllLabel}get _isAllSelected(){const t=this.values;if(!this.multiple||!this._slottedOptions)return!1;const e=this._selectableOptions;if(e.length===0)return!1;const o=new Set(t);return e.every(a=>o.has(a.value))}_toggleSelectAll(){const t=this._selectableOptions.map(a=>a.value);if(this._isAllSelected){const a=this.values.filter(n=>!t.includes(n));this.#t(a),this._changeDescription=this.locale.searchableSelect.deselectedAllMessage;return}const e=t.filter(a=>!this.values.includes(a)),o=[...this.values,...e];this.#t(o),this._changeDescription=this.locale.searchableSelect.selectedAllMessage}#g(){return this.initialValues.length?this.initialValues:this.initialValue?[this.initialValue]:[]}nameChanged(t,e){super.nameChanged(t,e),this.#f()}#f(){if(!this.name)this.setFormValue(null);else{const t=new FormData;for(const e of this.values)t.append(this.name,e);this.setFormValue(t)}}formResetCallback(){super.formResetCallback(),this.#t(this.#g())}#d;_onFieldsetClick(t){this.disabled||t.defaultPrevented||(this._input.focus(),this.open=!0)}_onChevronClick(){return this.open?(this.open=!1,!1):!0}connectedCallback(){super.connectedCallback(),this.values.length||(this.values=this.#g()),this.#d.observe(this._contentArea)}disconnectedCallback(){super.disconnectedCallback(),this.#d.disconnect()}validate(){super.validate(this._input??void 0)}focus(t){this._input?.focus(t)}_onMouseDown(t){const e=t.composedPath()[0];return!t.defaultPrevented&&e!==this._input&&!this._isFromContextualHelp(t)?(this._input.focus(),!1):!0}}c([i.attr],r.prototype,"appearance");c([i.attr],r.prototype,"shape");c([i.attr({mode:"boolean",attribute:"fixed-dropdown"})],r.prototype,"fixedDropdown");c([i.attr],r.prototype,"placeholder");c([i.attr({mode:"boolean"})],r.prototype,"open");c([i.attr({mode:"boolean"})],r.prototype,"multiple");c([i.attr({attribute:"external-tags",mode:"boolean"})],r.prototype,"externalTags");c([i.attr({attribute:"max-lines",converter:i.nullableNumberConverter})],r.prototype,"maxLines");c([i.observable],r.prototype,"values");c([i.observable],r.prototype,"initialValues");c([i.observable],r.prototype,"_input");c([i.observable],r.prototype,"_currentSearchText");c([i.observable],r.prototype,"_slottedOptions");c([i.observable],r.prototype,"optionFilter");c([i.observable],r.prototype,"_filteredOptions");c([i.observable],r.prototype,"_filteredEnabledOptions");c([i.attr({mode:"boolean"})],r.prototype,"loading");c([i.observable],r.prototype,"_highlightedOptionIndex");c([i.observable],r.prototype,"_contentArea");c([i.observable],r.prototype,"_numElidedTags");c([i.observable],r.prototype,"_tagRows");c([i.observable],r.prototype,"_lastTagRow");c([i.observable],r.prototype,"_listbox");c([i.attr({mode:"boolean"})],r.prototype,"clearable");c([i.attr({attribute:"max-selected",converter:i.nullableNumberConverter})],r.prototype,"maxSelected");c([i.observable],r.prototype,"_slottedDisabledOptions");c([i.attr({attribute:"enable-select-all",mode:"boolean"})],r.prototype,"enableSelectAll");c([i.attr({attribute:"select-all-text"})],r.prototype,"selectAllText");c([i.attr({attribute:"deselect-all-text"})],r.prototype,"deselectAllText");c([i.observable],r.prototype,"_selectAllOption");c([i.observable],r.prototype,"_changeDescription");c([i.observable],r.prototype,"_anchor");var G=Object.defineProperty,b=(s,t,e,o)=>{for(var a=void 0,n=s.length-1,v;n>=0;n--)(v=s[n])&&(a=v(t,e,a)||a);return a&&G(t,e,a),a};class g extends R.Localized(i.VividElement){constructor(){super(...arguments),this.removable=!1,this.disabled=!1,this.hasIconPlaceholder=!1}_onClickRemove(){this.$emit("remove",void 0,{bubbles:!1})}}b([i.attr],g.prototype,"shape");b([i.observable],g.prototype,"connotation");b([i.attr],g.prototype,"label");b([i.attr({mode:"boolean"})],g.prototype,"removable");b([i.attr({mode:"boolean"})],g.prototype,"disabled");b([i.observable],g.prototype,"hasIconPlaceholder");const J=s=>O.classNames(["disabled",s.disabled],[`appearance-${s.appearance}`,!!s.appearance],[`shape-${s.shape}`,!!s.shape],["error",!!s.errorValidationMessage],["success",!!s.successText],["has-highlighted-option",s._highlightedOptionIndex!==null]);function Q(){return i.html`
+"use strict";const x=require("../bundled/definition3.cjs"),F=require("../bundled/definition9.cjs"),y=require("../bundled/definition2.cjs"),$=require("../bundled/definition12.cjs"),A=require("../bundled/definition16.cjs"),i=require("../bundled/vivid-element.cjs"),D=require("../bundled/mixins.cjs"),E=require("../bundled/definition15.cjs"),z=require("../bundled/scrollIntoView.cjs"),V=require("../bundled/delegates-aria.cjs"),L=require("../bundled/form-associated.cjs"),q=require("../bundled/with-contextual-help.cjs"),M=require("../bundled/with-error-text.cjs"),P=require("../bundled/with-success-text.cjs"),N=require("../bundled/form-element.cjs"),w=require("../bundled/affix.cjs"),R=require("../bundled/localized.cjs"),B=require("../bundled/divider.cjs"),p=require("../bundled/when.cjs"),S=require("../bundled/slotted.cjs"),_=require("../bundled/ref.cjs"),m=require("../bundled/repeat.cjs"),O=require("../bundled/class-names.cjs"),W=".chevron{display:flex;flex-shrink:0;font:var(--vvd-typography-base-extended);transform:rotate(0);transition:transform .2s}:host([data-expanded=true]) .chevron,:host([open]) .chevron{transform:rotate(180deg)}:not(.disabled) .chevron{cursor:pointer}.disabled .chevron{color:var(--_low-ink-color);cursor:not-allowed}:host(:focus-visible){outline:none}:host{display:inline-block;inline-size:300px;--_low-ink-color: var(--vvd-color-neutral-600)}:host([disabled]){--_low-ink-color: var(--vvd-color-neutral-400);cursor:not-allowed}.control-wrapper{display:flex;flex-direction:column;gap:4px}.label{color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base)}.selection-count{color:var(--_low-ink-color);font:var(--vvd-typography-base)}.fieldset{--_connotation-color-primary: var(--vvd-searchable-select-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-searchable-select-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-searchable-select-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-intermediate: var(--vvd-searchable-select-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-faint: var(--vvd-searchable-select-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-searchable-select-accent-soft, var(--vvd-color-neutral-100));--_connotation-color-firm: var(--vvd-searchable-select-accent-firm, var(--vvd-color-canvas-text));--_connotation-color-fierce: var(--vvd-searchable-select-accent-fierce, var(--vvd-color-neutral-700))}.fieldset{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-500)}.fieldset.appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}@media (hover: hover){.fieldset:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-700)}.fieldset:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}}.fieldset.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-700)}.fieldset.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}.fieldset:disabled{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.fieldset:disabled.appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.fieldset.disabled{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.fieldset.disabled.appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.fieldset.readonly:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-neutral-200);--_appearance-color-outline: var(--vvd-color-neutral-400)}.fieldset.readonly:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-600);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.fieldset.error:where(:not(.disabled,:disabled)){--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: var(--vvd-color-alert-500)}.fieldset.error:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: transparent}.fieldset.success:where(:not(.disabled,:disabled)){--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: var(--vvd-color-success-500)}.fieldset.success:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: transparent}.fieldset{display:flex;align-items:center;justify-content:space-between;background-color:var(--_appearance-color-fill);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);font:var(--vvd-typography-base);gap:8px;padding-block:8px;padding-inline:16px;transition:box-shadow .2s,background-color .2s}@supports selector(:has(*)){.fieldset:not(.has-highlighted-option):has(input:focus){box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px));--focus-stroke-gap-color: transparent}}@supports not selector(:has(*)){.fieldset:not(.has-highlighted-option):focus-within{box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px));--focus-stroke-gap-color: transparent}}:host(:not([shape=pill])) .fieldset{border-radius:8px}:host([shape=pill]) .fieldset{border-radius:24px}.popup-wrapper{position:relative}.content-area{display:flex;overflow:hidden;flex:1;flex-direction:column;gap:8px;min-block-size:24px}.tag-row{display:flex;gap:8px;inline-size:100%}.tag-row.contains-only-input:not(:focus-within){display:contents}.tag-wrapper{overflow:hidden}.tag{max-inline-size:100%}input{box-sizing:border-box;flex:1;border:none;background:none;block-size:24px;font:var(--vvd-typography-base);max-inline-size:100%;min-inline-size:min(100px,40%);outline:none}.contains-only-input input:not(:focus){position:absolute;block-size:0;inline-size:0;min-inline-size:0;opacity:0;pointer-events:none}.listbox{display:flex;flex-direction:column;padding:4px;gap:2px;max-block-size:var(--searchable-select-height, 408px);overflow-y:auto}.empty-message{display:flex;align-items:center;justify-content:center;color:var(--vvd-color-neutral-300);font:var(--vvd-typography-base);min-block-size:40px;text-align:center}::part(popup-base){inline-size:max-content;min-inline-size:var(--_searchable-select-fixed-width, 100%)}slot[name=icon]{font-size:20px}.visually-hidden{position:absolute;overflow:hidden;width:1px;height:1px;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}::slotted([data-vvd-component=option][data-highlighted]),[data-select-all][data-highlighted]{border-radius:8px;box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px));--focus-stroke-gap-color: transparent}.divider{margin-block:10px;margin-inline:12px}.label-wrapper{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:var(--label-wrapper-gap, 8px)}.label-wrapper[hidden]{display:none}.label-wrapper .label{flex:1 1 auto}.label-wrapper slot[name=contextual-help]::slotted([data-vvd-component=contextual-help]){margin-inline-start:auto}",H='.base.connotation-cta{--_connotation-color-contrast: var(--vvd-option-tag-cta-contrast, var(--vvd-color-cta-800))}.base:not(.connotation-cta){--_connotation-color-contrast: var(--vvd-option-tag-accent-contrast, var(--vvd-color-neutral-800))}.base{position:relative;display:inline-flex;box-sizing:border-box;align-items:center;background-color:var(--fill-color);block-size:calc(1px*(24 + 4*clamp(-1,var(--vvd-size-density, 0),2)));box-shadow:inset 0 0 0 1px var(--outline-color);color:var(--text-color);column-gap:8px;font:var(--vvd-typography-base-bold);max-inline-size:100%;padding-inline:8px;user-select:none;vertical-align:middle}.base:not(.disabled){--text-color: var(--_connotation-color-contrast);--fill-color: var(--_connotation-color-soft);--outline-color: transparent}@supports (background-color: color-mix(in srgb,black 50%,white)){.base:not(.disabled){--fill-color: color-mix( in srgb, var(--_connotation-color-contrast), transparent 87.5% )}}.base.disabled{--text-color: var(--vvd-color-neutral-300);--fill-color: var(--vvd-color-neutral-200);--outline-color: transparent}@supports (background-color: color-mix(in srgb,black 50%,white)){.base.disabled{--fill-color: color-mix( in srgb, var(--vvd-color-neutral-800), transparent 87.5% )}}.base:not(.shape-pill){border-radius:4px}.base.shape-pill{border-radius:16px}.label{overflow:hidden;max-inline-size:100%;text-overflow:ellipsis;white-space:nowrap}slot[name=icon]{font-size:calc(calc(1px*(24 + 4*clamp(-1,var(--vvd-size-density, 0),2))) / 1.5);line-height:1}.icon-placeholder{inline-size:calc(calc(1px*(24 + 4*clamp(-1,var(--vvd-size-density, 0),2))) / 1.5)}.remove-button{display:flex;align-items:center;border-radius:inherit;cursor:pointer;outline:none}.disabled .remove-button{pointer-events:none}.remove-button:focus-visible:before{--focus-stroke-gap-color: transparent;box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px));position:absolute;z-index:1;display:block;border-radius:inherit;content:"";inset:0;pointer-events:none}';var K=Object.defineProperty,c=(s,t,e,o)=>{for(var a=void 0,n=s.length-1,v;n>=0;n--)(v=s[n])&&(a=v(t,e,a)||a);return a&&K(t,e,a),a};const f=8,j=100,k=10,U=s=>typeof s=="string";class r extends q.WithContextualHelp(D.WithFeedback(M.WithErrorText(P.WithSuccessText(N.FormElement(V.DelegatesAria(w.AffixIconWithTrailing(R.Localized(L.FormAssociated(i.VividElement))))))))){constructor(){super(...arguments),this.fixedDropdown=!1,this.open=!1,this.multiple=!1,this.externalTags=!1,this.maxLines=null,this.values=[],this.initialValues=[],this._currentSearchText=null,this._areOptionsInitialized=!1,this.#i={handleChange:(t,e)=>{t.selected&&!this.values.includes(t.value)?this.values=[...this.values,t.value]:!t.selected&&this.values.includes(t.value)&&(this.values=this.values.filter(o=>o!==t.value))}},this.#a=new Map,this._filteredOptions=[],this._filteredEnabledOptions=[],this.loading=!1,this._highlightedOptionIndex=null,this._numElidedTags=0,this._tagRows=[],this._lastTagRow=[],this.clearable=!1,this.maxSelected=null,this._slottedDisabledOptions=[],this.enableSelectAll=!1,this.proxy=document.createElement("input"),this.setFormValue=(t,e)=>{U(t)||super.setFormValue(t,e)},this._changeDescription="",this.#d=new ResizeObserver(()=>{this.#u()})}openChanged(){this.open||this.#e(null)}valuesChanged(){if(this._areOptionsInitialized){if(!this.multiple&&this.values.length>1){this.values=[this.values[0]];return}if(this.values.some(t=>!this.#h(t))){this.values=this.values.filter(t=>this.#h(t));return}this.value=this.values.length?this.values[0]:"",this.#c(),this.#_(),this.$fastController.isConnected&&this.#u(),this.#f()}}#t(t){this.values=t,this.$emit("change",void 0,{bubbles:!1}),this.$emit("input",void 0,{bubbles:!1})}#b(t){const e=new Set(this.values),o=new Set(t);this.values=[...this.values].filter(a=>o.has(a)).concat([...t].filter(a=>!e.has(a)))}initialValuesChanged(){this.dirtyValue||(this.values=this.initialValues,this.dirtyValue=!1)}#h(t){return this._slottedOptions.some(e=>e.value===t)}valueChanged(t,e){if(super.valueChanged(t,e),!this._areOptionsInitialized)return;const o=this._slottedOptions.some(a=>a.value===e);this.values[0]!==e&&(this.values=o?[e]:[])}get selectedIndex(){return this.values.length?this._slottedOptions.findIndex(t=>t.value===this.values[0]):-1}set selectedIndex(t){this.value=this._slottedOptions[t]?.value??""}get options(){return[...this._slottedOptions]}get selectedOptions(){return this._slottedOptions.filter(t=>this.values.includes(t.value))}_currentSearchTextChanged(){this.#o(),this.$emit("search-text-change",void 0,{bubbles:!1,composed:!1})}get searchText(){return this._currentSearchText??""}get _inputValue(){return this._currentSearchText??(!this.multiple&&this.value!==""?this.#k(this.value)??"":"")}_onInputInput(t){this._currentSearchText=t.target.value}_onInputFocus(t){this.#o()}_onInputBlur(t){this.open=!1,this._currentSearchText=null,this._changeDescription=""}_onInputKeydown(t){if(t.ctrlKey||t.shiftKey)return!0;switch(t.key){case"Enter":return this.#x(),this._inputValue===""&&(this.open=!this.open),!1;case"Escape":this.open=!1;break;case"Home":if(!this.open){this.open=!0;break}return this.#w(),!1;case"End":if(!this.open){this.open=!0;break}return this.#y(),!1;case"PageUp":if(!this.open){this.open=!0;break}return this.#$(),!1;case"PageDown":if(!this.open){this.open=!0;break}return this.#O(),!1;case"ArrowUp":if(!this.open){this.open=!0;break}return this.#T(),!1;case"ArrowDown":if(!this.open){this.open=!0;break}return this.#S(),!1;case"ArrowLeft":return this.multiple&&this._inputValue===""&&this.values.length&&!this.externalTags?(this.#l(this.#r(this.values.length)),!1):!0;case"Backspace":return this.multiple&&this._inputValue===""&&this.values.length?(this._onTagRemoved(this.values[this.values.length-1]),!1):!0;default:return this.open||(this.open=!0),!0}return!0}_slottedOptionsChanged(t,e){const o=!!this.querySelectorAll(":not([slot])").length;if(!e.length&&o)return;if(this._areOptionsInitialized=!0,t){this._slottedDisabledOptions=[];for(const n of t)i.Observable.getNotifier(n).unsubscribe(this.#i,"selected")}if(e)for(const n of e)n._displayCheckmark=!0,i.Observable.getNotifier(n).subscribe(this.#i,"selected");const a=[];for(const n of this._slottedOptions)(n.selected||n.value===this.value||this.values.includes(n.value))&&a.push(n.value),n.disabled&&this._slottedDisabledOptions.push(n);this.#b(a),this.#o(),this.#c()}#i;#_(){for(const t of this._slottedOptions)t.selected=this.values.includes(t.value),this.#m(t)}#p(t){const e=t.value;let o,a=!1;const n=!this.values.includes(e);this.multiple?(n?o=[...this.values,e]:o=this.values.filter(u=>u!==e),a=!0):(n?(o=[e],a=!0):o=[],this.open=!1),this.#t(o);const v=n?this.locale.searchableSelect.optionSelectedMessage(t._getAccessibleName()):this.locale.searchableSelect.optionDeselectedMessage(t._getAccessibleName()),h=this.multiple&&this.maxSelected&&this.maxSelected>=1?this.locale.searchableSelect.maxSelectedMessage(this.values.length,this.maxSelected):"";this._changeDescription=`${v} ${h}`,a&&(this._currentSearchText=null)}#a;#s(t){return t.querySelector('[slot="tag-icon"]')}_tagIconSlotName(t){return`_tag-icon-${this.values.indexOf(t)}`}#m(t){if(t.selected&&this.#s(t)){let e=this.#a.get(t);e||(e=this.#s(t).cloneNode(!0),this.#a.set(t,e)),e.slot=this._tagIconSlotName(t.value),this.appendChild(e)}else{const e=this.#a.get(t);e&&(e.remove(),this.#a.delete(t))}}optionFilterChanged(){this.#o()}loadingChanged(t,e){this._changeDescription=this.locale.searchableSelect.loadingOptionsMessage,t&&!e&&(this._changeDescription="")}#o(){const t=[],e=this.optionFilter??((a,n)=>a.text.toLowerCase().includes(n.toLowerCase()));for(const a of this._slottedOptions??[]){a._vvdSearchText=this.searchText;const n=!this.searchText||e(a,this.searchText);a._isNotMatching=!n,!a.hidden&&n&&t.push(a)}this.#e(null),this._filteredOptions=t;const o=t.filter(a=>!a.disabled);this._selectAllOption?this._filteredEnabledOptions=[this._selectAllOption,...o]:this._filteredEnabledOptions=o}#e(t){if(typeof this._highlightedOptionIndex=="number"){const e=this._filteredEnabledOptions[this._highlightedOptionIndex];e._highlighted=!1,e.removeAttribute("data-highlighted")}if(typeof t=="number"&&(this._filteredEnabledOptions.length?t=Math.max(0,Math.min(this._filteredEnabledOptions.length-1,t)):t=null),this._highlightedOptionIndex=t,typeof this._highlightedOptionIndex=="number"){const e=this._filteredEnabledOptions[this._highlightedOptionIndex];e._highlighted=!0,e.setAttribute("data-highlighted",""),z.scrollIntoView(e,this._listbox,"nearest"),this._changeDescription=this.locale.searchableSelect.optionFocusedMessage(e._getAccessibleName(),this._highlightedOptionIndex+1,this._filteredEnabledOptions.length,e.selected)}}#x(){if(this._highlightedOptionIndex===null)return;const t=this._filteredEnabledOptions[this._highlightedOptionIndex];if(t.getAttribute("data-select-all")!==null){this._toggleSelectAll();return}this.#p(t)}#w(){this.#e(0)}#y(){this.#e(this._filteredEnabledOptions.length-1)}#$(){this.#e((this._highlightedOptionIndex??this._filteredEnabledOptions.length)-k)}#O(){this.#e((this._highlightedOptionIndex??-1)+k)}#T(){this.#e((this._highlightedOptionIndex??this._filteredEnabledOptions.length)-1)}#S(){this.#e((this._highlightedOptionIndex??-1)+1)}_tagLabelForValue(t){return this._slottedOptions.find(o=>o.value===t).label}_tagConnotationForValue(t){return this._slottedOptions.find(o=>o.value===t).tagConnotation}_isTagDisabled(t){const e=this._slottedOptions.find(o=>o.value===t);return this.disabled||e.disabled}#k(t){return this._slottedOptions?.find(o=>o.value===t)?.label}#n(t,e,o){const a=document.createElement(this._optionTagTagName);a.label=t,a.removable=e,a.style.cssText="position: absolute; visibility: hidden;",a.hasIconPlaceholder=o,this.shadowRoot.appendChild(a);const n=a.getBoundingClientRect().width;return a.remove(),n}#u(){if(!this.multiple){this._numElidedTags=0,this._tagRows=[],this._lastTagRow=[];return}if(this.externalTags){this._numElidedTags=this.values.length,this._tagRows=[],this._lastTagRow=[];return}const t=this._contentArea.getBoundingClientRect().width,e=[[]];let o=0,a=j,n;for(n=this.values.length-1;n>=0;n--){const h=this.maxLines&&o===this.maxLines-1,u=this.#n(this._tagLabelForValue(this.values[n]),!0,this.#s(this.selectedOptions[n])!==null),l={value:this.values[n],width:u};let d=0;if(h){const T=n;T&&(d=f+this.#n(T.toString(),!1,!1))}if(a+f+u+d>t){if(h)if(n===this.values.length-1)e[o].unshift(l),a+=f+u;else break;else e.push([]),o++,e[o].unshift(l),a=u;continue}e[o].unshift(l),a+=f+u}this._numElidedTags=n+1,e.reverse();for(let h=0;h<e.length-1;h++){let u=e[h].map(l=>l.width).reduce((l,d)=>l+d,0)+(e[h].length-1)*f;for(h===0&&this._numElidedTags&&(u+=f+this.#n(this._numElidedTags.toString(),!1,!1));e[h+1].length&&u+f+e[h+1][0].width<=t;){const l=e[h+1].shift();e[h].push(l),u+=f+l.width}}const v=e.map(h=>h.map(u=>u.value));this._tagRows=v.slice(0,-1),this._lastTagRow=v.slice(-1)[0]}_onTagRemoved(t){this.#t(this.values.filter(e=>e!==t)),this.#o()}_onTagKeydown(t){const e=parseInt(t.target.dataset.index);switch(t.key){case"Backspace":case"Delete":case"Enter":case" ":{this._onTagRemoved(this.values[e]),i.Updates.process(),this.#l(this.#C(e));break}case"ArrowLeft":this.#l(this.#r(e)??e);break;case"ArrowRight":this.#l(this.#v(e));break}return!0}#l(t){t===null?this._input.focus():this.shadowRoot.querySelector(`[data-index="${t}"]`)?.focus()}#r(t){if(!this.values.length)return null;for(let e=t-1;e>=0;e--)if(!this._isTagDisabled(this.values[e]))return e;return null}#v(t){if(!this.values.length)return null;for(let e=t+1;e<this.values.length;e++)if(!this._isTagDisabled(this.values[e]))return e;return null}#C(t){return this.#v(t-1)??this.#r(t)}_onListboxClick(t){if(this.disabled)return;const e=t.target.closest("option,[role=option],[data-vvd-component=option]");if(e?.getAttribute("data-select-all")!==null){this._toggleSelectAll();return}e&&!e.disabled&&this.#p(e)}get _shouldShowClearButton(){return this.clearable&&this.values.length>0}_onClearButtonClick(){this.#t(this.selectedOptions.filter(t=>t.disabled).map(t=>t.value))}maxSelectedChanged(){this.#c()}#c(){if(!this.multiple||!this._slottedOptions||typeof this.maxSelected!="number"||this.maxSelected<=0)return;const t=this._slottedOptions.filter(e=>!this._slottedDisabledOptions.includes(e));if(this.values.length>=this.maxSelected){const e=t.filter(o=>!this.selectedOptions.includes(o));for(const o of e)o.disabled=!0}else for(const e of t)e.disabled=!1}get _hasSelectionCount(){return this.multiple&&this.maxSelected&&this.maxSelected>=1}get _selectableOptions(){return this._slottedOptions?.filter(t=>!this._slottedDisabledOptions.includes(t)&&!t.disabled)??[]}get _selectAllLabel(){return this._isAllSelected?this.deselectAllText??this.locale.searchableSelect.deselectAllLabel:this.selectAllText??this.locale.searchableSelect.selectAllLabel}get _isAllSelected(){const t=this.values;if(!this.multiple||!this._slottedOptions)return!1;const e=this._selectableOptions;if(e.length===0)return!1;const o=new Set(t);return e.every(a=>o.has(a.value))}_toggleSelectAll(){const t=this._selectableOptions.map(a=>a.value);if(this._isAllSelected){const a=this.values.filter(n=>!t.includes(n));this.#t(a),this._changeDescription=this.locale.searchableSelect.deselectedAllMessage;return}const e=t.filter(a=>!this.values.includes(a)),o=[...this.values,...e];this.#t(o),this._changeDescription=this.locale.searchableSelect.selectedAllMessage}#g(){return this.initialValues.length?this.initialValues:this.initialValue?[this.initialValue]:[]}nameChanged(t,e){super.nameChanged(t,e),this.#f()}#f(){if(!this.name)this.setFormValue(null);else{const t=new FormData;for(const e of this.values)t.append(this.name,e);this.setFormValue(t)}}formResetCallback(){super.formResetCallback(),this.#t(this.#g())}#d;_onFieldsetClick(t){this.disabled||t.defaultPrevented||(this._input.focus(),this.open=!0)}_onChevronClick(){return this.open?(this.open=!1,!1):!0}connectedCallback(){super.connectedCallback(),this.values.length||(this.values=this.#g()),this.#d.observe(this._contentArea)}disconnectedCallback(){super.disconnectedCallback(),this.#d.disconnect()}validate(){super.validate(this._input??void 0)}focus(t){this._input?.focus(t)}_onMouseDown(t){const e=t.composedPath()[0];return!t.defaultPrevented&&e!==this._input&&!this._isFromContextualHelp(t)?(this._input.focus(),!1):!0}}c([i.attr],r.prototype,"appearance");c([i.attr],r.prototype,"shape");c([i.attr({mode:"boolean",attribute:"fixed-dropdown"})],r.prototype,"fixedDropdown");c([i.attr],r.prototype,"placeholder");c([i.attr({mode:"boolean"})],r.prototype,"open");c([i.attr({mode:"boolean"})],r.prototype,"multiple");c([i.attr({attribute:"external-tags",mode:"boolean"})],r.prototype,"externalTags");c([i.attr({attribute:"max-lines",converter:i.nullableNumberConverter})],r.prototype,"maxLines");c([i.observable],r.prototype,"values");c([i.observable],r.prototype,"initialValues");c([i.observable],r.prototype,"_input");c([i.observable],r.prototype,"_currentSearchText");c([i.observable],r.prototype,"_slottedOptions");c([i.observable],r.prototype,"optionFilter");c([i.observable],r.prototype,"_filteredOptions");c([i.observable],r.prototype,"_filteredEnabledOptions");c([i.attr({mode:"boolean"})],r.prototype,"loading");c([i.observable],r.prototype,"_highlightedOptionIndex");c([i.observable],r.prototype,"_contentArea");c([i.observable],r.prototype,"_numElidedTags");c([i.observable],r.prototype,"_tagRows");c([i.observable],r.prototype,"_lastTagRow");c([i.observable],r.prototype,"_listbox");c([i.attr({mode:"boolean"})],r.prototype,"clearable");c([i.attr({attribute:"max-selected",converter:i.nullableNumberConverter})],r.prototype,"maxSelected");c([i.observable],r.prototype,"_slottedDisabledOptions");c([i.attr({attribute:"enable-select-all",mode:"boolean"})],r.prototype,"enableSelectAll");c([i.attr({attribute:"select-all-text"})],r.prototype,"selectAllText");c([i.attr({attribute:"deselect-all-text"})],r.prototype,"deselectAllText");c([i.observable],r.prototype,"_selectAllOption");c([i.observable],r.prototype,"_changeDescription");c([i.observable],r.prototype,"_anchor");var G=Object.defineProperty,b=(s,t,e,o)=>{for(var a=void 0,n=s.length-1,v;n>=0;n--)(v=s[n])&&(a=v(t,e,a)||a);return a&&G(t,e,a),a};class g extends R.Localized(i.VividElement){constructor(){super(...arguments),this.removable=!1,this.disabled=!1,this.hasIconPlaceholder=!1}_onClickRemove(){this.$emit("remove",void 0,{bubbles:!1})}}b([i.attr],g.prototype,"shape");b([i.observable],g.prototype,"connotation");b([i.attr],g.prototype,"label");b([i.attr({mode:"boolean"})],g.prototype,"removable");b([i.attr({mode:"boolean"})],g.prototype,"disabled");b([i.observable],g.prototype,"hasIconPlaceholder");const J=s=>O.classNames(["disabled",s.disabled],[`appearance-${s.appearance}`,!!s.appearance],[`shape-${s.shape}`,!!s.shape],["error",!!s.errorValidationMessage],["success",!!s.successText],["has-highlighted-option",s._highlightedOptionIndex!==null]);function Q(){return i.html`
 		<label for="control" class="label" id="label"> ${s=>s.label} </label>
 	`}function X(){return i.html`
 		<span

package/searchable-select/index.js

@@ -1,11 +1,11 @@
 import { B as R, c as z, b as E } from "../bundled/definition3.js";
 import { P as L, p as P } from "../bundled/definition9.js";
 import { I as M, i as I } from "../bundled/definition2.js";
-import { i as B, L as W, l as N } from "../bundled/definition11.js";
-import { P as H, p as K } from "../bundled/definition15.js";
+import { i as B, L as W, l as N } from "../bundled/definition12.js";
+import { P as H, p as K } from "../bundled/definition16.js";
 import { V as F, O, U as j, a as u, n as A, o as p, h as d, c as q, d as D } from "../bundled/vivid-element.js";
 import { W as U, f as G } from "../bundled/mixins.js";
-import { d as J } from "../bundled/definition14.js";
+import { d as J } from "../bundled/definition15.js";
 import { s as Q } from "../bundled/scrollIntoView.js";
 import { D as X, d as Y } from "../bundled/delegates-aria.js";
 import { F as Z } from "../bundled/form-associated.js";

package/select/definition.cjs

@@ -20,7 +20,7 @@ const affix = require('../unbundled/affix.cjs');
 const button_definition = require('../unbundled/definition.cjs');
 const index = require('../unbundled/index.cjs');
 
-const styles = ".chevron{display:flex;flex-shrink:0;font:var(--vvd-typography-base-extended);transform:rotate(0);transition:transform .2s}:host([data-expanded=true]) .chevron,:host([open]) .chevron{transform:rotate(180deg)}:host(:focus-visible){outline:none}:host{display:inline-flex;flex-direction:column;gap:4px;--_low-ink-color: var(--vvd-color-neutral-600);--focus-stroke-gap-color: transparent}:host([disabled]){--_low-ink-color: var(--vvd-color-neutral-400);cursor:not-allowed}.label{color:var(--vvd-color-canvas-text);contain:inline-size;font:var(--vvd-typography-base)}.control{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-500)}.control.appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}@media (hover: hover){.control:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-700)}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}}.control.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-700)}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}.control:disabled{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.control:disabled.appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.control.disabled{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.control.disabled.appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.control.readonly:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-neutral-200);--_appearance-color-outline: var(--vvd-color-neutral-400)}.control.readonly:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-600);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.control.error:where(:not(.disabled,:disabled)){--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: var(--vvd-color-alert-500)}.control.error:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: transparent}.control.success:where(:not(.disabled,:disabled)){--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: var(--vvd-color-success-500)}.control.success:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: transparent}.control{--_connotation-color-primary: var(--vvd-select-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-select-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-select-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-intermediate: var(--vvd-select-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-faint: var(--vvd-select-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-select-accent-soft, var(--vvd-color-neutral-100));--_connotation-color-firm: var(--vvd-select-accent-firm, var(--vvd-color-canvas-text));--_connotation-color-fierce: var(--vvd-select-accent-fierce, var(--vvd-color-neutral-700))}.control{border-radius:var(--_select-control-border-radius);block-size:var(--_select-block-size);padding-inline:var(--_select-padding-inline)}.control{--_select-icon-size: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2) ;--_select-block-size: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))) ;--_select-padding-inline: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4) ;display:flex;align-items:center;justify-content:space-between;background-color:var(--_appearance-color-fill);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);font:var(--vvd-typography-base);gap:8px;transition:box-shadow .2s,background-color .2s}.control.size-condensed{--_select-icon-size: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4) ;--_select-block-size: calc(1px*(32 + 4*clamp(-1, var(--vvd-size-density, 0), 2))) ;--_select-padding-inline: calc(1px*(24 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2) }.control.size-condensed:not(.shape-pill){--_select-control-border-radius: 4px}.control-wrapper{position:relative}.control:not(.disabled){cursor:pointer}.control.disabled{pointer-events:none}.control:not(.shape-pill){--_select-control-border-radius: 8px}.control.shape-pill{--_select-control-border-radius: 24px}:host(:focus-visible) .control{box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px))}.listbox{display:flex;max-height:var(--select-height, 408px);flex-direction:column;padding:4px;gap:2px;overflow-y:auto}:host([multiple]:focus-visible) .listbox{box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px));border-radius:8px}.selected-value{display:flex;overflow:hidden;flex-grow:1;align-items:center;column-gap:12px;white-space:nowrap}.selected-value .text{overflow:hidden;max-inline-size:100%;text-overflow:ellipsis}.control.shows-placeholder .selected-value .text{color:var(--vvd-color-neutral-600)}.selected-value slot[name=icon]{flex:0 0 var(--_select-icon-size);font-size:var(--_select-icon-size);line-height:1}.control.has-meta .selected-value{padding-inline-end:8px}.feedback-wrapper{display:contents}::part(popup-base){inline-size:max-content;min-inline-size:var(--_select-fixed-width, 100%)}:host([multiple]) ::part(popup-base){position:static}.label-wrapper{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:var(--label-wrapper-gap, 8px)}.label-wrapper[hidden]{display:none}.label-wrapper .label{flex:1 1 auto}.label-wrapper slot[name=contextual-help]::slotted([data-vvd-component=contextual-help]){margin-inline-start:auto}";
+const styles = ".chevron{display:flex;flex-shrink:0;font:var(--vvd-typography-base-extended);transform:rotate(0);transition:transform .2s}:host([data-expanded=true]) .chevron,:host([open]) .chevron{transform:rotate(180deg)}:host(:focus-visible){outline:none}:host{display:inline-flex;flex-direction:column;gap:4px;--_low-ink-color: var(--vvd-color-neutral-600);--focus-stroke-gap-color: transparent}:host([disabled]){--_low-ink-color: var(--vvd-color-neutral-400);cursor:not-allowed}.label{color:var(--vvd-color-canvas-text);contain:inline-size;font:var(--vvd-typography-base)}.control{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-500)}.control.appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}@media (hover: hover){.control:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-700)}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}}.control.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-700)}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}.control:disabled{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.control:disabled.appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.control.disabled{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.control.disabled.appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.control.readonly:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-neutral-200);--_appearance-color-outline: var(--vvd-color-neutral-400)}.control.readonly:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-600);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.control.error:where(:not(.disabled,:disabled)){--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: var(--vvd-color-alert-500)}.control.error:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: transparent}.control.success:where(:not(.disabled,:disabled)){--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: var(--vvd-color-success-500)}.control.success:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: transparent}.control{--_connotation-color-primary: var(--vvd-select-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-select-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-select-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-intermediate: var(--vvd-select-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-faint: var(--vvd-select-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-select-accent-soft, var(--vvd-color-neutral-100));--_connotation-color-firm: var(--vvd-select-accent-firm, var(--vvd-color-canvas-text));--_connotation-color-fierce: var(--vvd-select-accent-fierce, var(--vvd-color-neutral-700))}.control{border-radius:var(--_select-control-border-radius);block-size:var(--_select-block-size);padding-inline:var(--_select-padding-inline)}.control{--_select-icon-size: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2) ;--_select-block-size: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))) ;--_select-padding-inline: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4) ;display:flex;align-items:center;justify-content:space-between;background-color:var(--_appearance-color-fill);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);font:var(--vvd-typography-base);gap:8px;transition:box-shadow .2s,background-color .2s}.control.size-condensed{--_select-icon-size: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4) ;--_select-block-size: calc(1px*(32 + 4*clamp(-1, var(--vvd-size-density, 0), 2))) ;--_select-padding-inline: calc(1px*(24 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2) }.control.size-condensed:not(.shape-pill){--_select-control-border-radius: 4px}.control-wrapper{position:relative}.control:not(.disabled){cursor:pointer}.control.disabled{pointer-events:none}.control:not(.shape-pill){--_select-control-border-radius: 8px}.control.shape-pill{--_select-control-border-radius: 24px}.listbox{display:flex;max-height:var(--select-height, 408px);flex-direction:column;padding:4px;gap:2px;overflow-y:auto}:host([multiple]:focus-visible) .listbox{box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px));border-radius:8px}.selected-value{display:flex;overflow:hidden;flex-grow:1;align-items:center;column-gap:12px;white-space:nowrap}.selected-value .text{overflow:hidden;max-inline-size:100%;text-overflow:ellipsis}.control.shows-placeholder .selected-value .text{color:var(--vvd-color-neutral-600)}.selected-value slot[name=icon]{flex:0 0 var(--_select-icon-size);font-size:var(--_select-icon-size);line-height:1}.control.has-meta .selected-value{padding-inline-end:8px}.feedback-wrapper{display:contents}::part(popup-base){inline-size:max-content;min-inline-size:var(--_select-fixed-width, 100%)}:host([multiple]) ::part(popup-base){position:static}:host(:focus-within) .control:not(.has-activedescendant){--focus-stroke-gap-color: transparent;box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px))}:host(:not([multiple])) ::slotted([data-vvd-component=option][current-selected]){border-radius:8px;box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px));--focus-stroke-gap-color: transparent}.label-wrapper{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:var(--label-wrapper-gap, 8px)}.label-wrapper[hidden]{display:none}.label-wrapper .label{flex:1 1 auto}.label-wrapper slot[name=contextual-help]::slotted([data-vvd-component=contextual-help]){margin-inline-start:auto}";
 
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -735,8 +735,11 @@ const getStateClasses = ({
   successText,
   placeholder,
   value,
-  scale
+  scale,
+  _activeDescendant,
+  open
 }) => fastWebUtilities.classNames(
+  ["has-activedescendant", Boolean(_activeDescendant) && open],
   ["disabled", disabled],
   [`appearance-${appearance}`, Boolean(appearance)],
   [`shape-${shape}`, Boolean(shape)],
@@ -838,7 +841,7 @@ const SelectTemplate = (context) => {
     ariaDisabled: (x) => x.disabled
   })}
 			aria-controls="${(x) => x.listboxId}"
-			aria-activedescendant="${(x) => x._activeDescendant}"
+			aria-activedescendant="${(x) => x.open ? x._activeDescendant : null}"
 			aria-describedby="${(x) => x._feedbackDescribedBy}"
 			tabindex="${(x) => !x.disabled ? "0" : null}"
 			@click="${ifNotFromFeedback((x, e) => x.clickHandler(e))}"

package/select/definition.js

@@ -16,7 +16,7 @@ import { b as AffixIconWithTrailing, a as affixIconTemplateFactory, I as IconWra
 import { c as chevronTemplateFactory } from '../unbundled/definition.js';
 import { h as handleEscapeKeyAndStopPropogation } from '../unbundled/index.js';
 
-const styles = ".chevron{display:flex;flex-shrink:0;font:var(--vvd-typography-base-extended);transform:rotate(0);transition:transform .2s}:host([data-expanded=true]) .chevron,:host([open]) .chevron{transform:rotate(180deg)}:host(:focus-visible){outline:none}:host{display:inline-flex;flex-direction:column;gap:4px;--_low-ink-color: var(--vvd-color-neutral-600);--focus-stroke-gap-color: transparent}:host([disabled]){--_low-ink-color: var(--vvd-color-neutral-400);cursor:not-allowed}.label{color:var(--vvd-color-canvas-text);contain:inline-size;font:var(--vvd-typography-base)}.control{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-500)}.control.appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}@media (hover: hover){.control:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-700)}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}}.control.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-700)}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}.control:disabled{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.control:disabled.appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.control.disabled{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.control.disabled.appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.control.readonly:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-neutral-200);--_appearance-color-outline: var(--vvd-color-neutral-400)}.control.readonly:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-600);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.control.error:where(:not(.disabled,:disabled)){--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: var(--vvd-color-alert-500)}.control.error:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: transparent}.control.success:where(:not(.disabled,:disabled)){--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: var(--vvd-color-success-500)}.control.success:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: transparent}.control{--_connotation-color-primary: var(--vvd-select-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-select-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-select-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-intermediate: var(--vvd-select-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-faint: var(--vvd-select-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-select-accent-soft, var(--vvd-color-neutral-100));--_connotation-color-firm: var(--vvd-select-accent-firm, var(--vvd-color-canvas-text));--_connotation-color-fierce: var(--vvd-select-accent-fierce, var(--vvd-color-neutral-700))}.control{border-radius:var(--_select-control-border-radius);block-size:var(--_select-block-size);padding-inline:var(--_select-padding-inline)}.control{--_select-icon-size: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2) ;--_select-block-size: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))) ;--_select-padding-inline: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4) ;display:flex;align-items:center;justify-content:space-between;background-color:var(--_appearance-color-fill);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);font:var(--vvd-typography-base);gap:8px;transition:box-shadow .2s,background-color .2s}.control.size-condensed{--_select-icon-size: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4) ;--_select-block-size: calc(1px*(32 + 4*clamp(-1, var(--vvd-size-density, 0), 2))) ;--_select-padding-inline: calc(1px*(24 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2) }.control.size-condensed:not(.shape-pill){--_select-control-border-radius: 4px}.control-wrapper{position:relative}.control:not(.disabled){cursor:pointer}.control.disabled{pointer-events:none}.control:not(.shape-pill){--_select-control-border-radius: 8px}.control.shape-pill{--_select-control-border-radius: 24px}:host(:focus-visible) .control{box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px))}.listbox{display:flex;max-height:var(--select-height, 408px);flex-direction:column;padding:4px;gap:2px;overflow-y:auto}:host([multiple]:focus-visible) .listbox{box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px));border-radius:8px}.selected-value{display:flex;overflow:hidden;flex-grow:1;align-items:center;column-gap:12px;white-space:nowrap}.selected-value .text{overflow:hidden;max-inline-size:100%;text-overflow:ellipsis}.control.shows-placeholder .selected-value .text{color:var(--vvd-color-neutral-600)}.selected-value slot[name=icon]{flex:0 0 var(--_select-icon-size);font-size:var(--_select-icon-size);line-height:1}.control.has-meta .selected-value{padding-inline-end:8px}.feedback-wrapper{display:contents}::part(popup-base){inline-size:max-content;min-inline-size:var(--_select-fixed-width, 100%)}:host([multiple]) ::part(popup-base){position:static}.label-wrapper{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:var(--label-wrapper-gap, 8px)}.label-wrapper[hidden]{display:none}.label-wrapper .label{flex:1 1 auto}.label-wrapper slot[name=contextual-help]::slotted([data-vvd-component=contextual-help]){margin-inline-start:auto}";
+const styles = ".chevron{display:flex;flex-shrink:0;font:var(--vvd-typography-base-extended);transform:rotate(0);transition:transform .2s}:host([data-expanded=true]) .chevron,:host([open]) .chevron{transform:rotate(180deg)}:host(:focus-visible){outline:none}:host{display:inline-flex;flex-direction:column;gap:4px;--_low-ink-color: var(--vvd-color-neutral-600);--focus-stroke-gap-color: transparent}:host([disabled]){--_low-ink-color: var(--vvd-color-neutral-400);cursor:not-allowed}.label{color:var(--vvd-color-canvas-text);contain:inline-size;font:var(--vvd-typography-base)}.control{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-500)}.control.appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}@media (hover: hover){.control:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-700)}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}}.control.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-700)}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}.control:disabled{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.control:disabled.appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.control.disabled{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.control.disabled.appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.control.readonly:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-neutral-200);--_appearance-color-outline: var(--vvd-color-neutral-400)}.control.readonly:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-600);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.control.error:where(:not(.disabled,:disabled)){--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: var(--vvd-color-alert-500)}.control.error:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: transparent}.control.success:where(:not(.disabled,:disabled)){--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: var(--vvd-color-success-500)}.control.success:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: transparent}.control{--_connotation-color-primary: var(--vvd-select-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-select-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-select-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-intermediate: var(--vvd-select-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-faint: var(--vvd-select-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-select-accent-soft, var(--vvd-color-neutral-100));--_connotation-color-firm: var(--vvd-select-accent-firm, var(--vvd-color-canvas-text));--_connotation-color-fierce: var(--vvd-select-accent-fierce, var(--vvd-color-neutral-700))}.control{border-radius:var(--_select-control-border-radius);block-size:var(--_select-block-size);padding-inline:var(--_select-padding-inline)}.control{--_select-icon-size: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2) ;--_select-block-size: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))) ;--_select-padding-inline: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4) ;display:flex;align-items:center;justify-content:space-between;background-color:var(--_appearance-color-fill);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);font:var(--vvd-typography-base);gap:8px;transition:box-shadow .2s,background-color .2s}.control.size-condensed{--_select-icon-size: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4) ;--_select-block-size: calc(1px*(32 + 4*clamp(-1, var(--vvd-size-density, 0), 2))) ;--_select-padding-inline: calc(1px*(24 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2) }.control.size-condensed:not(.shape-pill){--_select-control-border-radius: 4px}.control-wrapper{position:relative}.control:not(.disabled){cursor:pointer}.control.disabled{pointer-events:none}.control:not(.shape-pill){--_select-control-border-radius: 8px}.control.shape-pill{--_select-control-border-radius: 24px}.listbox{display:flex;max-height:var(--select-height, 408px);flex-direction:column;padding:4px;gap:2px;overflow-y:auto}:host([multiple]:focus-visible) .listbox{box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px));border-radius:8px}.selected-value{display:flex;overflow:hidden;flex-grow:1;align-items:center;column-gap:12px;white-space:nowrap}.selected-value .text{overflow:hidden;max-inline-size:100%;text-overflow:ellipsis}.control.shows-placeholder .selected-value .text{color:var(--vvd-color-neutral-600)}.selected-value slot[name=icon]{flex:0 0 var(--_select-icon-size);font-size:var(--_select-icon-size);line-height:1}.control.has-meta .selected-value{padding-inline-end:8px}.feedback-wrapper{display:contents}::part(popup-base){inline-size:max-content;min-inline-size:var(--_select-fixed-width, 100%)}:host([multiple]) ::part(popup-base){position:static}:host(:focus-within) .control:not(.has-activedescendant){--focus-stroke-gap-color: transparent;box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px))}:host(:not([multiple])) ::slotted([data-vvd-component=option][current-selected]){border-radius:8px;box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px));--focus-stroke-gap-color: transparent}.label-wrapper{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:var(--label-wrapper-gap, 8px)}.label-wrapper[hidden]{display:none}.label-wrapper .label{flex:1 1 auto}.label-wrapper slot[name=contextual-help]::slotted([data-vvd-component=contextual-help]){margin-inline-start:auto}";
 
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -731,8 +731,11 @@ const getStateClasses = ({
   successText,
   placeholder,
   value,
-  scale
+  scale,
+  _activeDescendant,
+  open
 }) => classNames(
+  ["has-activedescendant", Boolean(_activeDescendant) && open],
   ["disabled", disabled],
   [`appearance-${appearance}`, Boolean(appearance)],
   [`shape-${shape}`, Boolean(shape)],
@@ -834,7 +837,7 @@ const SelectTemplate = (context) => {
     ariaDisabled: (x) => x.disabled
   })}
 			aria-controls="${(x) => x.listboxId}"
-			aria-activedescendant="${(x) => x._activeDescendant}"
+			aria-activedescendant="${(x) => x.open ? x._activeDescendant : null}"
 			aria-describedby="${(x) => x._feedbackDescribedBy}"
 			tabindex="${(x) => !x.disabled ? "0" : null}"
 			@click="${ifNotFromFeedback((x, e) => x.clickHandler(e))}"

package/selectable-box/index.cjs

@@ -1,4 +1,4 @@
-"use strict";const p=require("../bundled/definition8.cjs"),v=require("../bundled/definition17.cjs"),t=require("../bundled/vivid-element.cjs"),i=require("../bundled/delegates-aria.cjs"),r=require("../bundled/enums.cjs"),f=require("../bundled/when.cjs"),u=require("../bundled/class-names.cjs"),x=":host{display:flex}.base.connotation-cta{--_connotation-color-firm-all: var(--vvd-selectable-box-cta-firm-all, var(--vvd-color-cta-600));--_connotation-color-pale: var(--vvd-selectable-box-cta-pale, var(--vvd-color-cta-300));--_connotation-color-fierce: var(--vvd-selectable-box-cta-fierce, var(--vvd-color-cta-700));--_connotation-color-faint: var(--vvd-selectable-box-cta-faint, var(--vvd-color-cta-50));--_connotation-color-soft: var(--vvd-selectable-box-cta-soft, var(--vvd-color-cta-100))}.base:not(.connotation-cta){--_connotation-color-firm-all: var(--vvd-selectable-box-accent-firm-all, var(--vvd-color-neutral-600));--_connotation-color-pale: var(--vvd-selectable-box-accent-pale, var(--vvd-color-neutral-300));--_connotation-color-fierce: var(--vvd-selectable-box-accent-fierce, var(--vvd-color-neutral-700));--_connotation-color-faint: var(--vvd-selectable-box-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-selectable-box-accent-soft, var(--vvd-color-neutral-100))}.base{--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: transparent;--_appearance-color-outline: var(--_connotation-color-pale)}@media (hover: hover){.base:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: transparent;--_appearance-color-outline: var(--_connotation-color-firm-all)}}.base.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: transparent;--_appearance-color-outline: var(--_connotation-color-firm-all)}.base.selected:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: var(--_connotation-color-soft);--_appearance-color-outline: var(--_connotation-color-pale)}@media (hover: hover){.base.selected:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: var(--_connotation-color-firm-all)}}.base.selected.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: var(--_connotation-color-firm-all)}.base{--control-offset: calc(var(--selectable-box-spacing, 16px) + 36px)}.base{position:relative;padding:var(--selectable-box-spacing, 16px);border:1px solid var(--_appearance-color-outline);border-radius:8px;background-color:var(--_appearance-color-fill);inline-size:100%;text-align:start}.base.control-placement-end-stacked,.base.control-placement-start-stacked{padding-block-start:var(--control-offset)}.base.control-placement-start{padding-inline-start:var(--control-offset)}.base.control-placement-end{padding-inline-end:var(--control-offset)}.base:focus-visible{--focus-stroke-gap-color: transparent;box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px))}.base.tight{overflow:hidden;min-height:calc(var(--selectable-box-spacing, 16px) * 2 + 22px);padding:0}.base.selected{background-color:var(--selectable-box-checked-bg, var(--_appearance-color-fill))}.base.clickable{cursor:pointer}.control{position:absolute;inset-block-start:var(--selectable-box-spacing, 16px)}.control.start-stacked,.control.start{inset-inline-start:var(--selectable-box-spacing, 16px)}.control.end-stacked,.control.end{inset-inline-end:var(--selectable-box-spacing, 16px)}";var _=Object.defineProperty,c=(a,o,e,s)=>{for(var l=void 0,d=a.length-1,b;d>=0;d--)(b=a[d])&&(l=b(o,e,l)||l);return l&&_(o,e,l),l};class n extends i.DelegatesAria(t.VividElement){constructor(){super(...arguments),this.checked=!1,this.clickableBox=!1,this.controlPlacement="end-stacked",this.tight=!1}_handleCheckedChange(){this.controlType==="radio"&&this.checked||(this.checked=!this.checked,this.clickableBox&&this.$emit("change"))}_handleKeydown(o){return(o.code==="Space"||o.code==="Enter")&&this.clickableBox?this._handleCheckedChange():!0}}c([t.attr({mode:"boolean"})],n.prototype,"checked");c([t.attr({attribute:"clickable-box",mode:"boolean"})],n.prototype,"clickableBox");c([t.attr],n.prototype,"connotation");c([t.attr({attribute:"control-type"})],n.prototype,"controlType");c([t.attr({attribute:"control-placement",mode:"fromView"})],n.prototype,"controlPlacement");c([t.attr({mode:"boolean"})],n.prototype,"tight");const k=({connotation:a,tight:o,checked:e,clickableBox:s,controlPlacement:l})=>u.classNames("base",[`connotation-${a}`,!!a],["tight",o],["selected",e],["clickable",s],["readonly",!s],[`control-placement-${l}`,!!l]);function h(a){a.clickableBox||a._handleCheckedChange()}function m(a){const o=a.tagFor(p.Checkbox);return t.html`${f.when(e=>e.controlType!=="radio",t.html`
+"use strict";const p=require("../bundled/definition8.cjs"),v=require("../bundled/definition18.cjs"),t=require("../bundled/vivid-element.cjs"),i=require("../bundled/delegates-aria.cjs"),r=require("../bundled/enums.cjs"),f=require("../bundled/when.cjs"),u=require("../bundled/class-names.cjs"),x=":host{display:flex}.base.connotation-cta{--_connotation-color-firm-all: var(--vvd-selectable-box-cta-firm-all, var(--vvd-color-cta-600));--_connotation-color-pale: var(--vvd-selectable-box-cta-pale, var(--vvd-color-cta-300));--_connotation-color-fierce: var(--vvd-selectable-box-cta-fierce, var(--vvd-color-cta-700));--_connotation-color-faint: var(--vvd-selectable-box-cta-faint, var(--vvd-color-cta-50));--_connotation-color-soft: var(--vvd-selectable-box-cta-soft, var(--vvd-color-cta-100))}.base:not(.connotation-cta){--_connotation-color-firm-all: var(--vvd-selectable-box-accent-firm-all, var(--vvd-color-neutral-600));--_connotation-color-pale: var(--vvd-selectable-box-accent-pale, var(--vvd-color-neutral-300));--_connotation-color-fierce: var(--vvd-selectable-box-accent-fierce, var(--vvd-color-neutral-700));--_connotation-color-faint: var(--vvd-selectable-box-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-selectable-box-accent-soft, var(--vvd-color-neutral-100))}.base{--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: transparent;--_appearance-color-outline: var(--_connotation-color-pale)}@media (hover: hover){.base:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: transparent;--_appearance-color-outline: var(--_connotation-color-firm-all)}}.base.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: transparent;--_appearance-color-outline: var(--_connotation-color-firm-all)}.base.selected:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: var(--_connotation-color-soft);--_appearance-color-outline: var(--_connotation-color-pale)}@media (hover: hover){.base.selected:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: var(--_connotation-color-firm-all)}}.base.selected.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm-all);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: var(--_connotation-color-firm-all)}.base{--control-offset: calc(var(--selectable-box-spacing, 16px) + 36px)}.base{position:relative;padding:var(--selectable-box-spacing, 16px);border:1px solid var(--_appearance-color-outline);border-radius:8px;background-color:var(--_appearance-color-fill);inline-size:100%;text-align:start}.base.control-placement-end-stacked,.base.control-placement-start-stacked{padding-block-start:var(--control-offset)}.base.control-placement-start{padding-inline-start:var(--control-offset)}.base.control-placement-end{padding-inline-end:var(--control-offset)}.base:focus-visible{--focus-stroke-gap-color: transparent;box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px))}.base.tight{overflow:hidden;min-height:calc(var(--selectable-box-spacing, 16px) * 2 + 22px);padding:0}.base.selected{background-color:var(--selectable-box-checked-bg, var(--_appearance-color-fill))}.base.clickable{cursor:pointer}.control{position:absolute;inset-block-start:var(--selectable-box-spacing, 16px)}.control.start-stacked,.control.start{inset-inline-start:var(--selectable-box-spacing, 16px)}.control.end-stacked,.control.end{inset-inline-end:var(--selectable-box-spacing, 16px)}";var _=Object.defineProperty,c=(a,o,e,s)=>{for(var l=void 0,d=a.length-1,b;d>=0;d--)(b=a[d])&&(l=b(o,e,l)||l);return l&&_(o,e,l),l};class n extends i.DelegatesAria(t.VividElement){constructor(){super(...arguments),this.checked=!1,this.clickableBox=!1,this.controlPlacement="end-stacked",this.tight=!1}_handleCheckedChange(){this.controlType==="radio"&&this.checked||(this.checked=!this.checked,this.clickableBox&&this.$emit("change"))}_handleKeydown(o){return(o.code==="Space"||o.code==="Enter")&&this.clickableBox?this._handleCheckedChange():!0}}c([t.attr({mode:"boolean"})],n.prototype,"checked");c([t.attr({attribute:"clickable-box",mode:"boolean"})],n.prototype,"clickableBox");c([t.attr],n.prototype,"connotation");c([t.attr({attribute:"control-type"})],n.prototype,"controlType");c([t.attr({attribute:"control-placement",mode:"fromView"})],n.prototype,"controlPlacement");c([t.attr({mode:"boolean"})],n.prototype,"tight");const k=({connotation:a,tight:o,checked:e,clickableBox:s,controlPlacement:l})=>u.classNames("base",[`connotation-${a}`,!!a],["tight",o],["selected",e],["clickable",s],["readonly",!s],[`control-placement-${l}`,!!l]);function h(a){a.clickableBox||a._handleCheckedChange()}function m(a){const o=a.tagFor(p.Checkbox);return t.html`${f.when(e=>e.controlType!=="radio",t.html`
 		<${o}
 			${i.delegateAria({ariaLabel:e=>!e.clickableBox&&e.ariaLabel?e.ariaLabel:null},{onlySpecified:!0})}
 			@change="${e=>h(e)}"

package/selectable-box/index.js

@@ -1,5 +1,5 @@
 import { C as h, c as u } from "../bundled/definition8.js";
-import { R as x, a as _ } from "../bundled/definition17.js";
+import { R as x, a as _ } from "../bundled/definition18.js";
 import { V as m, a as c, h as n, c as k, d as g } from "../bundled/vivid-element.js";
 import { D as $, d as p } from "../bundled/delegates-aria.js";
 import { C as i } from "../bundled/enums.js";

package/shared/color-picker/base-color-picker.d.ts

@@ -9,6 +9,7 @@ export declare const BaseColorPicker: <T extends Constructor<VividElement>>(Base
         swatches: ColorSwatch[];
         connectedCallback(): void;
         _canvasColor: string;
+        readonly _computedCanvasColor: string;
         _refreshCanvasColor(): void;
         _applyContrastClass(color: string, threshold?: number): boolean;
         _getRowLength(): number;
@@ -19,7 +20,7 @@ export declare const BaseColorPicker: <T extends Constructor<VividElement>>(Base
         _getGridCells(): HTMLElement[];
         _handleCellKeydown(event: KeyboardEvent, value: string, index: number, isSaveCell?: boolean): boolean;
         _focusSwatchByIndex(index: number): void;
-        _renderColorSwatch(iconTag: InlineTemplateDirective): import("@microsoft/fast-element").ViewTemplate<ColorSwatch, any>;
+        _renderColorSwatch(iconTag: InlineTemplateDirective, tooltipTag: InlineTemplateDirective): import("@microsoft/fast-element").ViewTemplate<ColorSwatch, any>;
         readonly locale: import("../localization/Locale").Locale;
         _vividAriaBehaviour: import("../aria/aria-mixin").VividAriaBehaviour;
         readonly $fastController: import("@microsoft/fast-element").ElementController<HTMLElement>;