@vonage/vivid 5.6.0 → 5.8.0

package/bundled/definition7.js

@@ -6,7 +6,7 @@ import { H as P, a as z } from "./host-semantics.js";
 import { s as m, e as B } from "./slotted.js";
 import { w as l } from "./when.js";
 import { c as T } from "./class-names.js";
-const D = ":host(:focus-visible){outline:none}:host([disabled]){pointer-events:none}.base{--_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(--_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(--_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: transparent;--_appearance-color-outline: transparent}.base.disabled{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base:active:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-soft);--_appearance-color-outline: transparent}.base.active:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-soft);--_appearance-color-outline: transparent}.base.selected:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-soft);--_appearance-color-outline: transparent}@media (hover: hover){.base.selected:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-dim);--_appearance-color-outline: transparent}}.base.selected.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-dim);--_appearance-color-outline: transparent}.base.connotation-cta{--_connotation-color-primary: var(--vvd-menu-item-cta-primary, var(--vvd-color-cta-500));--_connotation-color-primary-text: var(--vvd-menu-item-cta-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-menu-item-cta-primary-increment, var(--vvd-color-cta-600));--_connotation-color-firm: var(--vvd-menu-item-cta-firm, var(--vvd-color-cta-600));--_connotation-color-faint: var(--vvd-menu-item-cta-faint, var(--vvd-color-cta-50));--_connotation-color-soft: var(--vvd-menu-item-cta-soft, var(--vvd-color-cta-100));--_connotation-color-pale: var(--vvd-menu-item-cta-pale, var(--vvd-color-cta-300));--_connotation-color-dim: var(--vvd-menu-item-cta-dim, var(--vvd-color-cta-200))}.base:not(.connotation-cta){--_connotation-color-primary: var(--vvd-menu-item-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-menu-item-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-menu-item-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-firm: var(--vvd-menu-item-accent-firm, var(--vvd-color-canvas-text));--_connotation-color-faint: var(--vvd-menu-item-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-menu-item-accent-soft, var(--vvd-color-neutral-100));--_connotation-color-pale: var(--vvd-menu-item-accent-pale, var(--vvd-color-neutral-300));--_connotation-color-dim: var(--vvd-menu-item-accent-dim, var(--vvd-color-neutral-200))}.base{--_menu-item-padding-inline: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4) }.base{display:flex;box-sizing:border-box;align-items:center;border-radius:8px;background-color:var(--_appearance-color-fill);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);inline-size:100%}.base:not(.two-lines){gap:12px;min-block-size:calc(1px*(40 + 4*clamp(-1,var(--vvd-size-density, 0),2)));padding-block:8px;padding-inline:var(--_menu-item-padding-inline)}.base.two-lines{gap:16px;min-block-size:calc(1px*(40 + 4*clamp(-1,var(--vvd-size-density, 0),2)) + 1px*(24 + 4*clamp(-1,var(--vvd-size-density, 0),2)));padding-block:12px;padding-inline:var(--_menu-item-padding-inline)}@supports (user-select: none){.base{user-select:none}}.base:not(.disabled){cursor:pointer}:host(:not([role=presentation]):focus-visible) .base{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}.icon{flex-shrink:0;font-size:calc(1px*(40 + 4*clamp(-1,var(--vvd-size-density, 0),2))/2);line-height:1}.action,.decorative{display:flex;place-content:center}.action{color:var(--_appearance-color-text)}.base.trailing .action,.base.has-meta .action{order:2}:host(:not([check-appearance],[checked],[disabled])) .action{color:var(--vvd-color-neutral-500)}.base:not(.disabled) .decorative{color:var(--vvd-color-neutral-600)}.base.disabled .decorative{color:var(--vvd-color-neutral-200)}.base.has-meta .decorative{order:1}.chevron{order:3}.text{display:flex;overflow:hidden;flex-direction:column;gap:4px;margin-inline-end:auto}.text-primary,.text-secondary{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;font:var(--vvd-typography-base)}.text-primary{font:var(--vvd-typography-base);-webkit-line-clamp:var(--text-primary-line-clamp, 1)}.base:not(.disabled) .text-primary{color:var(--vvd-color-canvas-text)}.base.disabled .text-primary{color:var(--_appearance-color-text)}.base.two-lines .text-primary{font:var(--vvd-typography-base-bold)}.text-secondary{color:var(--vvd-color-neutral-800);font:var(--vvd-typography-base-condensed);-webkit-line-clamp:var(--text-secondary-line-clamp, 1)}.base.two-lines .text-secondary{color:var(--vvd-color-neutral-600)}.base.disabled .text-secondary{color:var(--_appearance-color-text)}.base.selected:not(.disabled) .text-secondary{color:var(--vvd-color-neutral-800)}:host([internal-part]) .text-primary{font:var(--_text-primary-custom-size, var--vvd-typography-base)}", u = {
+const D = ":host(:focus-visible){outline:none}:host([disabled]){pointer-events:none}.base{--_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(--_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(--_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: transparent;--_appearance-color-outline: transparent}.base.disabled{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base:active:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-soft);--_appearance-color-outline: transparent}.base.active:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-soft);--_appearance-color-outline: transparent}.base.selected:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-soft);--_appearance-color-outline: transparent}@media (hover: hover){.base.selected:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-dim);--_appearance-color-outline: transparent}}.base.selected.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-dim);--_appearance-color-outline: transparent}.base.connotation-cta{--_connotation-color-primary: var(--vvd-menu-item-cta-primary, var(--vvd-color-cta-500));--_connotation-color-primary-text: var(--vvd-menu-item-cta-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-menu-item-cta-primary-increment, var(--vvd-color-cta-600));--_connotation-color-firm: var(--vvd-menu-item-cta-firm, var(--vvd-color-cta-600));--_connotation-color-faint: var(--vvd-menu-item-cta-faint, var(--vvd-color-cta-50));--_connotation-color-soft: var(--vvd-menu-item-cta-soft, var(--vvd-color-cta-100));--_connotation-color-pale: var(--vvd-menu-item-cta-pale, var(--vvd-color-cta-300));--_connotation-color-dim: var(--vvd-menu-item-cta-dim, var(--vvd-color-cta-200))}.base:not(.connotation-cta){--_connotation-color-primary: var(--vvd-menu-item-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-menu-item-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-menu-item-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-firm: var(--vvd-menu-item-accent-firm, var(--vvd-color-canvas-text));--_connotation-color-faint: var(--vvd-menu-item-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-menu-item-accent-soft, var(--vvd-color-neutral-100));--_connotation-color-pale: var(--vvd-menu-item-accent-pale, var(--vvd-color-neutral-300));--_connotation-color-dim: var(--vvd-menu-item-accent-dim, var(--vvd-color-neutral-200))}.base{--_menu-item-padding-inline: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4) }.base{display:flex;box-sizing:border-box;align-items:center;border-radius:8px;background-color:var(--_appearance-color-fill);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);inline-size:100%}.base:not(.two-lines){gap:12px;min-block-size:calc(1px*(40 + 4*clamp(-1,var(--vvd-size-density, 0),2)));padding-block:8px;padding-inline:var(--_menu-item-padding-inline)}.base.two-lines{gap:16px;min-block-size:calc(1px*(40 + 4*clamp(-1,var(--vvd-size-density, 0),2)) + 1px*(24 + 4*clamp(-1,var(--vvd-size-density, 0),2)));padding-block:12px;padding-inline:var(--_menu-item-padding-inline)}@supports (user-select: none){.base{user-select:none}}.base:not(.disabled){cursor:pointer}:host(:not([role=presentation]):focus-visible) .base{box-shadow:0 0 0 4px color-mix(in srgb,var(--focus-stroke-color, 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}.icon{flex-shrink:0;font-size:calc(1px*(40 + 4*clamp(-1,var(--vvd-size-density, 0),2))/2);line-height:1}.action,.decorative{display:flex;place-content:center}.action{color:var(--_appearance-color-text)}.base.trailing .action,.base.has-meta .action{order:2}:host(:not([check-appearance],[checked],[disabled])) .action{color:var(--vvd-color-neutral-500)}.base:not(.disabled) .decorative{color:var(--vvd-color-neutral-600)}.base.disabled .decorative{color:var(--vvd-color-neutral-200)}.base.has-meta .decorative{order:1}.chevron{order:3}.text{display:flex;overflow:hidden;flex-direction:column;gap:4px;margin-inline-end:auto}.text-primary,.text-secondary{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;font:var(--vvd-typography-base)}.text-primary{font:var(--vvd-typography-base);-webkit-line-clamp:var(--text-primary-line-clamp, 1)}.base:not(.disabled) .text-primary{color:var(--vvd-color-canvas-text)}.base.disabled .text-primary{color:var(--_appearance-color-text)}.base.two-lines .text-primary{font:var(--vvd-typography-base-bold)}.text-secondary{color:var(--vvd-color-neutral-800);font:var(--vvd-typography-base-condensed);-webkit-line-clamp:var(--text-secondary-line-clamp, 1)}.base.two-lines .text-secondary{color:var(--vvd-color-neutral-600)}.base.disabled .text-secondary{color:var(--_appearance-color-text)}.base.selected:not(.disabled) .text-secondary{color:var(--vvd-color-neutral-800)}:host([internal-part]) .text-primary{font:var(--_text-primary-custom-size, var--vvd-typography-base)}", u = {
   menuitem: "menuitem",
   menuitemcheckbox: "menuitemcheckbox",
   menuitemradio: "menuitemradio",

package/bundled/definition8.cjs

@@ -1,4 +1,4 @@
-"use strict";const v=require("./definition2.cjs"),o=require("./vivid-element.cjs"),p=require("./mixins.cjs"),h=require("./delegates-aria.cjs"),x=require("./form-associated.cjs"),f=require("./with-error-text.cjs"),k=require("./with-success-text.cjs"),y=require("./form-element.cjs"),d=require("./when.cjs"),_=require("./slotted.cjs"),g=require("./class-names.cjs"),C=':host{display:inline-flex;flex-direction:column;gap:4px;vertical-align:middle;--_low-ink-color: var(--vvd-color-neutral-600)}:host([disabled]){cursor:not-allowed}.base.connotation-cta{--_connotation-color-primary: var(--vvd-checkbox-cta-primary, var(--vvd-color-cta-500));--_connotation-color-primary-text: var(--vvd-checkbox-cta-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-checkbox-cta-primary-increment, var(--vvd-color-cta-600));--_connotation-color-fierce: var(--vvd-checkbox-cta-fierce, var(--vvd-color-cta-700));--_connotation-color-intermediate: var(--vvd-checkbox-cta-intermediate, var(--vvd-color-cta-500));--_connotation-color-firm: var(--vvd-checkbox-cta-firm, var(--vvd-color-cta-600))}.base:not(.connotation-cta){--_connotation-color-primary: var(--vvd-checkbox-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-checkbox-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-checkbox-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-fierce: var(--vvd-checkbox-accent-fierce, var(--vvd-color-neutral-700));--_connotation-color-intermediate: var(--vvd-checkbox-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-firm: var(--vvd-checkbox-accent-firm, var(--vvd-color-canvas-text))}.base{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-500)}@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-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-700)}.base:checked:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: var(--_connotation-color-primary)}.base.checked:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: var(--_connotation-color-primary)}@media (hover: hover){.base:checked:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary-increment);--_appearance-color-outline: var(--_connotation-color-primary-increment)}}.base.checked.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary-increment);--_appearance-color-outline: var(--_connotation-color-primary-increment)}.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-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.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{display:inline-flex;align-items:center;gap:8px;vertical-align:middle}.base:focus-visible{outline:none}@supports (user-select: none){.base{user-select:none}}.base:not(.disabled){cursor:pointer}.base.disabled{pointer-events:none}.control{position:relative;display:flex;flex-shrink:0;align-items:center;justify-content:center;border-radius:4px;background-color:var(--_appearance-color-fill);block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));box-shadow:inset 0 0 0 2px var(--_appearance-color-outline);color:var(--_appearance-color-text);inline-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.base:focus-visible .control{--focus-stroke-gap-color: transparent}.base:focus-visible .control: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));position:absolute;display:block;border-radius:var(--focus-border-radius, inherit);block-size:calc(100% + var(--focus-block-size-addition, 4px));content:"";inline-size:calc(100% + var(--focus-block-size-addition, 4px));inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%)}.base.error:not(.checked) .control{background-color:var(--vvd-color-canvas);box-shadow:inset 0 0 0 2px var(--vvd-color-alert-500)}.indicator{font-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)) - 4px)}.base:not(.checked) .indicator.checkmark{display:none}.base.checked .indicator.minus,.base:not(.indeterminate) .indicator.minus{display:none}label{display:flex;flex-wrap:wrap;align-items:center;color:var(--vvd-color-canvas-text);column-gap:4px;cursor:pointer;font:var(--vvd-typography-base)}.hide-label label{display:none}.icon{font-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2))*.6);line-height:1}';var w=Object.defineProperty,i=(r,a,e,c)=>{for(var t=void 0,l=r.length-1,s;l>=0;l--)(s=r[l])&&(t=s(a,e,t)||t);return t&&w(a,e,t),t};const $=" ";class n extends h.DelegatesAria(p.WithFeedback(f.WithErrorText(k.WithSuccessText(y.FormElement(x.CheckableFormAssociated(o.VividElement)))))){constructor(){super(),this.tabindex=null,this.proxy=document.createElement("input"),this.initialValue="on",this.defaultSlottedNodes=[],this.indeterminate=!1,this.keypressHandler=a=>{if(a.target instanceof HTMLAnchorElement)return!0;if(!this.disabled&&!this.readOnly)switch(a.key){case $:this.indeterminate&&(this.indeterminate=!1),this.checked=!this.checked;break}return!1},this.clickHandler=a=>a.target instanceof HTMLAnchorElement?!0:(!this.disabled&&!this.readOnly&&(this.indeterminate&&(this.indeterminate=!1),this.checked=!this.checked),!1),this.proxy.setAttribute("type","checkbox")}readOnlyChanged(){/* v8 ignore if -- @preserve */this.proxy instanceof HTMLInputElement&&(this.proxy.readOnly=this.readOnly)}ariaCheckedChanged(a,e){super.ariaCheckedChanged(a,e),this.ariaChecked==="mixed"?this.indeterminate=!0:(this.indeterminate=!1,this.checked=this.ariaChecked==="true")}checkedChanged(a,e){super.checkedChanged(a,e),this.ariaChecked=e==!0?"true":"false",a!==void 0&&this.$emit("input")}}i([o.attr({attribute:"tabindex"})],n.prototype,"tabindex");i([o.attr],n.prototype,"connotation");i([o.attr({attribute:"readonly",mode:"boolean"})],n.prototype,"readOnly");i([o.observable],n.prototype,"defaultSlottedNodes");i([o.attr({attribute:"indeterminate",mode:"boolean"})],n.prototype,"indeterminate");i([o.observable],n.prototype,"slottedContent");const q=({connotation:r,readOnly:a,checked:e,disabled:c,indeterminate:t,errorValidationMessage:l,successText:s,label:u,slottedContent:m})=>g.classNames("base",[`connotation-${r}`,!!r],["readonly",!!a],["checked",!!e||!!t],["disabled",!!c],["error connotation-alert",!!l],["success connotation-success",!!s],["hide-label",!u&&!m?.length]),z=r=>{const a=r.tagFor(v.Icon);return o.html`<template>
+"use strict";const v=require("./definition2.cjs"),o=require("./vivid-element.cjs"),p=require("./mixins.cjs"),h=require("./delegates-aria.cjs"),x=require("./form-associated.cjs"),f=require("./with-error-text.cjs"),k=require("./with-success-text.cjs"),y=require("./form-element.cjs"),d=require("./when.cjs"),_=require("./slotted.cjs"),g=require("./class-names.cjs"),C=':host{display:inline-flex;flex-direction:column;gap:4px;vertical-align:middle;--_low-ink-color: var(--vvd-color-neutral-600)}:host([disabled]){cursor:not-allowed}.base.connotation-cta{--_connotation-color-primary: var(--vvd-checkbox-cta-primary, var(--vvd-color-cta-500));--_connotation-color-primary-text: var(--vvd-checkbox-cta-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-checkbox-cta-primary-increment, var(--vvd-color-cta-600));--_connotation-color-fierce: var(--vvd-checkbox-cta-fierce, var(--vvd-color-cta-700));--_connotation-color-intermediate: var(--vvd-checkbox-cta-intermediate, var(--vvd-color-cta-500));--_connotation-color-firm: var(--vvd-checkbox-cta-firm, var(--vvd-color-cta-600))}.base:not(.connotation-cta){--_connotation-color-primary: var(--vvd-checkbox-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-checkbox-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-checkbox-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-fierce: var(--vvd-checkbox-accent-fierce, var(--vvd-color-neutral-700));--_connotation-color-intermediate: var(--vvd-checkbox-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-firm: var(--vvd-checkbox-accent-firm, var(--vvd-color-canvas-text))}.base{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-500)}@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-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-700)}.base:checked:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: var(--_connotation-color-primary)}.base.checked:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: var(--_connotation-color-primary)}@media (hover: hover){.base:checked:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary-increment);--_appearance-color-outline: var(--_connotation-color-primary-increment)}}.base.checked.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary-increment);--_appearance-color-outline: var(--_connotation-color-primary-increment)}.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-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.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{display:inline-flex;align-items:start;gap:8px;vertical-align:middle}.base:focus-visible{outline:none}@supports (user-select: none){.base{user-select:none}}.base:not(.disabled){cursor:pointer}.base.disabled{pointer-events:none}.control{position:relative;display:flex;flex-shrink:0;align-items:center;justify-content:center;border-radius:4px;background-color:var(--_appearance-color-fill);block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));box-shadow:inset 0 0 0 2px var(--_appearance-color-outline);color:var(--_appearance-color-text);inline-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.base:focus-visible .control{--focus-stroke-gap-color: transparent}.base:focus-visible .control:after{box-shadow:0 0 0 4px color-mix(in srgb,var(--focus-stroke-color, 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;display:block;border-radius:var(--focus-border-radius, inherit);block-size:calc(100% + var(--focus-block-size-addition, 4px));content:"";inline-size:calc(100% + var(--focus-block-size-addition, 4px));inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%)}.base.error:not(.checked) .control{background-color:var(--vvd-color-canvas);box-shadow:inset 0 0 0 2px var(--vvd-color-alert-500)}.indicator{font-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)) - 4px)}.base:not(.checked) .indicator.checkmark{display:none}.base.checked .indicator.minus,.base:not(.indeterminate) .indicator.minus{display:none}label{display:flex;flex-wrap:wrap;align-items:center;color:var(--vvd-color-canvas-text);column-gap:4px;cursor:pointer;font:var(--vvd-typography-base)}.hide-label label{display:none}.icon{font-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2))*.6);line-height:1}';var w=Object.defineProperty,i=(r,a,e,c)=>{for(var t=void 0,l=r.length-1,s;l>=0;l--)(s=r[l])&&(t=s(a,e,t)||t);return t&&w(a,e,t),t};const $=" ";class n extends h.DelegatesAria(p.WithFeedback(f.WithErrorText(k.WithSuccessText(y.FormElement(x.CheckableFormAssociated(o.VividElement)))))){constructor(){super(),this.tabindex=null,this.proxy=document.createElement("input"),this.initialValue="on",this.defaultSlottedNodes=[],this.indeterminate=!1,this.keypressHandler=a=>{if(a.target instanceof HTMLAnchorElement)return!0;if(!this.disabled&&!this.readOnly)switch(a.key){case $:this.indeterminate&&(this.indeterminate=!1),this.checked=!this.checked;break}return!1},this.clickHandler=a=>a.target instanceof HTMLAnchorElement?!0:(!this.disabled&&!this.readOnly&&(this.indeterminate&&(this.indeterminate=!1),this.checked=!this.checked),!1),this.proxy.setAttribute("type","checkbox")}readOnlyChanged(){/* v8 ignore if -- @preserve */this.proxy instanceof HTMLInputElement&&(this.proxy.readOnly=this.readOnly)}ariaCheckedChanged(a,e){super.ariaCheckedChanged(a,e),this.ariaChecked==="mixed"?this.indeterminate=!0:(this.indeterminate=!1,this.checked=this.ariaChecked==="true")}checkedChanged(a,e){super.checkedChanged(a,e),this.ariaChecked=e==!0?"true":"false",a!==void 0&&this.$emit("input")}}i([o.attr({attribute:"tabindex"})],n.prototype,"tabindex");i([o.attr],n.prototype,"connotation");i([o.attr({attribute:"readonly",mode:"boolean"})],n.prototype,"readOnly");i([o.observable],n.prototype,"defaultSlottedNodes");i([o.attr({attribute:"indeterminate",mode:"boolean"})],n.prototype,"indeterminate");i([o.observable],n.prototype,"slottedContent");const q=({connotation:r,readOnly:a,checked:e,disabled:c,indeterminate:t,errorValidationMessage:l,successText:s,label:u,slottedContent:m})=>g.classNames("base",[`connotation-${r}`,!!r],["readonly",!!a],["checked",!!e||!!t],["disabled",!!c],["error connotation-alert",!!l],["success connotation-success",!!s],["hide-label",!u&&!m?.length]),z=r=>{const a=r.tagFor(v.Icon);return o.html`<template>
 		<div
 			class="${q}"
 			aria-describedby="${e=>e._feedbackDescribedBy}"

package/bundled/definition8.js

@@ -1,6 +1,6 @@
 import { I as m, i as u } from "./definition2.js";
-import { V as f, a as d, o as p, h as s, c as x, d as y } from "./vivid-element.js";
-import { W as k, f as _ } from "./mixins.js";
+import { V as f, a as d, o as p, h as s, c as x, d as k } from "./vivid-element.js";
+import { W as y, f as _ } from "./mixins.js";
 import { D as g, d as C } from "./delegates-aria.js";
 import { C as w } from "./form-associated.js";
 import { W as $ } from "./with-error-text.js";
@@ -9,7 +9,7 @@ import { F as O } from "./form-element.js";
 import { w as v } from "./when.js";
 import { s as F } from "./slotted.js";
 import { c as T } from "./class-names.js";
-const B = ':host{display:inline-flex;flex-direction:column;gap:4px;vertical-align:middle;--_low-ink-color: var(--vvd-color-neutral-600)}:host([disabled]){cursor:not-allowed}.base.connotation-cta{--_connotation-color-primary: var(--vvd-checkbox-cta-primary, var(--vvd-color-cta-500));--_connotation-color-primary-text: var(--vvd-checkbox-cta-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-checkbox-cta-primary-increment, var(--vvd-color-cta-600));--_connotation-color-fierce: var(--vvd-checkbox-cta-fierce, var(--vvd-color-cta-700));--_connotation-color-intermediate: var(--vvd-checkbox-cta-intermediate, var(--vvd-color-cta-500));--_connotation-color-firm: var(--vvd-checkbox-cta-firm, var(--vvd-color-cta-600))}.base:not(.connotation-cta){--_connotation-color-primary: var(--vvd-checkbox-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-checkbox-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-checkbox-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-fierce: var(--vvd-checkbox-accent-fierce, var(--vvd-color-neutral-700));--_connotation-color-intermediate: var(--vvd-checkbox-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-firm: var(--vvd-checkbox-accent-firm, var(--vvd-color-canvas-text))}.base{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-500)}@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-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-700)}.base:checked:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: var(--_connotation-color-primary)}.base.checked:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: var(--_connotation-color-primary)}@media (hover: hover){.base:checked:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary-increment);--_appearance-color-outline: var(--_connotation-color-primary-increment)}}.base.checked.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary-increment);--_appearance-color-outline: var(--_connotation-color-primary-increment)}.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-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.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{display:inline-flex;align-items:center;gap:8px;vertical-align:middle}.base:focus-visible{outline:none}@supports (user-select: none){.base{user-select:none}}.base:not(.disabled){cursor:pointer}.base.disabled{pointer-events:none}.control{position:relative;display:flex;flex-shrink:0;align-items:center;justify-content:center;border-radius:4px;background-color:var(--_appearance-color-fill);block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));box-shadow:inset 0 0 0 2px var(--_appearance-color-outline);color:var(--_appearance-color-text);inline-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.base:focus-visible .control{--focus-stroke-gap-color: transparent}.base:focus-visible .control: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));position:absolute;display:block;border-radius:var(--focus-border-radius, inherit);block-size:calc(100% + var(--focus-block-size-addition, 4px));content:"";inline-size:calc(100% + var(--focus-block-size-addition, 4px));inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%)}.base.error:not(.checked) .control{background-color:var(--vvd-color-canvas);box-shadow:inset 0 0 0 2px var(--vvd-color-alert-500)}.indicator{font-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)) - 4px)}.base:not(.checked) .indicator.checkmark{display:none}.base.checked .indicator.minus,.base:not(.indeterminate) .indicator.minus{display:none}label{display:flex;flex-wrap:wrap;align-items:center;color:var(--vvd-color-canvas-text);column-gap:4px;cursor:pointer;font:var(--vvd-typography-base)}.hide-label label{display:none}.icon{font-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2))*.6);line-height:1}';
+const B = ':host{display:inline-flex;flex-direction:column;gap:4px;vertical-align:middle;--_low-ink-color: var(--vvd-color-neutral-600)}:host([disabled]){cursor:not-allowed}.base.connotation-cta{--_connotation-color-primary: var(--vvd-checkbox-cta-primary, var(--vvd-color-cta-500));--_connotation-color-primary-text: var(--vvd-checkbox-cta-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-checkbox-cta-primary-increment, var(--vvd-color-cta-600));--_connotation-color-fierce: var(--vvd-checkbox-cta-fierce, var(--vvd-color-cta-700));--_connotation-color-intermediate: var(--vvd-checkbox-cta-intermediate, var(--vvd-color-cta-500));--_connotation-color-firm: var(--vvd-checkbox-cta-firm, var(--vvd-color-cta-600))}.base:not(.connotation-cta){--_connotation-color-primary: var(--vvd-checkbox-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-checkbox-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-checkbox-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-fierce: var(--vvd-checkbox-accent-fierce, var(--vvd-color-neutral-700));--_connotation-color-intermediate: var(--vvd-checkbox-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-firm: var(--vvd-checkbox-accent-firm, var(--vvd-color-canvas-text))}.base{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-500)}@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-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-700)}.base:checked:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: var(--_connotation-color-primary)}.base.checked:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: var(--_connotation-color-primary)}@media (hover: hover){.base:checked:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary-increment);--_appearance-color-outline: var(--_connotation-color-primary-increment)}}.base.checked.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary-increment);--_appearance-color-outline: var(--_connotation-color-primary-increment)}.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-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.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{display:inline-flex;align-items:start;gap:8px;vertical-align:middle}.base:focus-visible{outline:none}@supports (user-select: none){.base{user-select:none}}.base:not(.disabled){cursor:pointer}.base.disabled{pointer-events:none}.control{position:relative;display:flex;flex-shrink:0;align-items:center;justify-content:center;border-radius:4px;background-color:var(--_appearance-color-fill);block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));box-shadow:inset 0 0 0 2px var(--_appearance-color-outline);color:var(--_appearance-color-text);inline-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.base:focus-visible .control{--focus-stroke-gap-color: transparent}.base:focus-visible .control:after{box-shadow:0 0 0 4px color-mix(in srgb,var(--focus-stroke-color, 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;display:block;border-radius:var(--focus-border-radius, inherit);block-size:calc(100% + var(--focus-block-size-addition, 4px));content:"";inline-size:calc(100% + var(--focus-block-size-addition, 4px));inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%)}.base.error:not(.checked) .control{background-color:var(--vvd-color-canvas);box-shadow:inset 0 0 0 2px var(--vvd-color-alert-500)}.indicator{font-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)) - 4px)}.base:not(.checked) .indicator.checkmark{display:none}.base.checked .indicator.minus,.base:not(.indeterminate) .indicator.minus{display:none}label{display:flex;flex-wrap:wrap;align-items:center;color:var(--vvd-color-canvas-text);column-gap:4px;cursor:pointer;font:var(--vvd-typography-base)}.hide-label label{display:none}.icon{font-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2))*.6);line-height:1}';
 var D = Object.defineProperty, c = (o, a, e, n) => {
   for (var r = void 0, i = o.length - 1, l; i >= 0; i--)
     (l = o[i]) && (r = l(a, e, r) || r);
@@ -17,7 +17,7 @@ var D = Object.defineProperty, c = (o, a, e, n) => {
 };
 const E = " ";
 class t extends g(
-  k(
+  y(
     $(
       z(O(w(f)))
     )
@@ -127,7 +127,7 @@ const H = ({
 		</div>
 		${(e) => e._getFeedbackTemplate(o)}
 	</template>`;
-}, W = y(
+}, W = k(
   "checkbox",
   t,
   A,

package/bundled/listbox.cjs

@@ -1 +1 @@
-"use strict";const p=require("./definition12.cjs"),o=require("./vivid-element.cjs"),d=require("./key-codes.cjs"),u=require("./strings.cjs");function f(r,e){let t=r.length;for(;t--;)if(e(r[t],t,r))return t;return-1}var x=Object.defineProperty,a=(r,e,t,i)=>{for(var s=void 0,n=r.length-1,c;n>=0;n--)(c=r[n])&&(s=c(e,t,s)||s);return s&&x(e,t,s),s};const l=class h extends o.VividElement{constructor(){super(...arguments),this._options=[],this.selectedIndex=-1,this.selectedOptions=[],this.shouldSkipFocus=!1,this.typeaheadBuffer="",this.typeaheadExpired=!0,this.typeaheadTimeout=-1,this._activeDescendant=null}get firstSelectedOption(){return this.selectedOptions[0]??null}get length(){return this.options.length}get options(){return o.Observable.track(this,"options"),this._options}set options(e){const t=this._options;if(this._options=e,o.Observable.notify(this,"options"),this.$fastController.isConnected){const i=this._newDefaultSelectedIndex(t,e,this.selectedIndex);i!==null&&(this.selectedIndex=i)}}static{this.slottedOptionFilter=e=>p.isListboxOption(e)&&!e.hidden}static{this.TYPE_AHEAD_TIMEOUT_MS=1e3}clickHandler(e){const t=e.target.closest("option,[role=option],[data-vvd-component=option]");if(t&&!t.disabled)return this.selectedIndex=this.options.indexOf(t),!0}focusAndScrollOptionIntoView(e=this.firstSelectedOption){this.contains(document.activeElement)&&e!==null&&(e.focus(),requestAnimationFrame(()=>{e.scrollIntoView({block:"nearest"})}))}focusinHandler(e){!this.shouldSkipFocus&&e.target===e.currentTarget&&(this.setSelectedOptions(),this.focusAndScrollOptionIntoView()),this.shouldSkipFocus=!1}getTypeaheadMatches(){const e=this.typeaheadBuffer.replace(/[.*+\-?^${}()|[\]\\]/g,"\\$&"),t=new RegExp(`^${e}`,"gi");return this.options.filter(i=>i.text.trim().match(t))}getNextSelectableIndex(e){const t=this.options.reduce((i,s,n)=>!i&&!s.disabled&&n>=e?s:i,null);return this.options.indexOf(t)}handleChange(e,t){switch(t){case"selected":{/* v8 ignore else -- @preserve */h.slottedOptionFilter(e)&&(this.selectedIndex=this.options.indexOf(e)),this.setSelectedOptions();break}}}handleTypeAhead(e){/* v8 ignore else -- @preserve */this.typeaheadTimeout&&window.clearTimeout(this.typeaheadTimeout),this.typeaheadTimeout=window.setTimeout(()=>this.typeaheadExpired=!0,h.TYPE_AHEAD_TIMEOUT_MS),this.typeaheadBuffer=`${this.typeaheadExpired?"":this.typeaheadBuffer}${e}`}keydownHandler(e){if(this.disabled)return!0;this.shouldSkipFocus=!1;const t=e.key;switch(t){case d.keyHome:{/* v8 ignore else -- @preserve */e.shiftKey||(e.preventDefault(),this.selectFirstOption());break}case d.keyArrowDown:{/* v8 ignore else -- @preserve */e.shiftKey||(e.preventDefault(),this.selectNextOption());break}case d.keyArrowUp:{/* v8 ignore else -- @preserve */e.shiftKey||(e.preventDefault(),this.selectPreviousOption());break}case d.keyEnd:{e.preventDefault(),this.selectLastOption();break}case d.keyTab:return this.focusAndScrollOptionIntoView(),!0;case d.keyEnter:case d.keyEscape:return!0;case d.keySpace:{/* v8 ignore else -- @preserve */if(this.typeaheadExpired)return!0}default:{/* v8 ignore else -- @preserve */return t.length===1&&this.handleTypeAhead(`${t}`),!0}}}mousedownHandler(e){return this.shouldSkipFocus=!this.contains(document.activeElement),!0}selectedIndexChanged(e,t){const i=this._validSelectedIndex(t);if(t!==i){this.selectedIndex=i;return}this.setSelectedOptions()}_validSelectedIndex(e){return e>this.options.length-1||e<-1?-1:e}selectedOptionsChanged(e,t){const i=t.filter(h.slottedOptionFilter);this.options.forEach(s=>{const n=o.Observable.getNotifier(s);n.unsubscribe(this,"selected"),s.selected=i.includes(s),n.subscribe(this,"selected")})}selectFirstOption(){/* v8 ignore else -- @preserve */this.disabled||(this.selectedIndex=this.options.findIndex(e=>!e.disabled))}selectLastOption(){/* v8 ignore else -- @preserve */this.disabled||(this.selectedIndex=f(this.options,e=>!e.disabled))}selectNextOption(){/* v8 ignore else -- @preserve */!this.disabled&&this.selectedIndex<this.options.length-1&&(this.selectedIndex+=1)}selectPreviousOption(){/* v8 ignore else -- @preserve */!this.disabled&&this.selectedIndex>0&&(this.selectedIndex=this.selectedIndex-1)}_newDefaultSelectedIndex(e,t,i){for(const[s,n]of t.entries())if(this._isDefaultSelected(n)&&!e.includes(n))return s;return null}_isDefaultSelected(e){return e.defaultSelected}setSelectedOptions(){this.selectedOptions=this.selectedIndex!==-1?[this.options[this.selectedIndex]]:[],this._activeDescendant=this.firstSelectedOption?.id??"",this.focusAndScrollOptionIntoView()}slottedOptionsChanged(e,t){this.options=t.reduce((s,n)=>{/* v8 ignore else -- @preserve */return p.isListboxOption(n)&&s.push(n),s},[]);const i=`${this.options.length}`;this.options.forEach((s,n)=>{s.id||(s.id=u.uniqueId("option-")),s.ariaPosInSet=`${n+1}`,s.ariaSetSize=i})}typeaheadBufferChanged(e,t){if(this.$fastController.isConnected){const i=this.getTypeaheadMatches();/* v8 ignore else -- @preserve */if(i.length){const s=this.options.indexOf(i[0]);/* v8 ignore else -- @preserve */s>-1&&(this.selectedIndex=s)}this.typeaheadExpired=!1}}};a([o.attr({mode:"boolean"})],l.prototype,"disabled");a([o.observable],l.prototype,"selectedIndex");a([o.observable],l.prototype,"selectedOptions");a([o.observable],l.prototype,"slottedOptions");a([o.observable],l.prototype,"typeaheadBuffer");a([o.observable],l.prototype,"_activeDescendant");let b=l;exports.Listbox=b;
+"use strict";const p=require("./definition12.cjs"),o=require("./vivid-element.cjs"),d=require("./key-codes.cjs"),u=require("./strings.cjs");function f(r,e){let t=r.length;for(;t--;)if(e(r[t],t,r))return t;return-1}var x=Object.defineProperty,a=(r,e,t,i)=>{for(var s=void 0,n=r.length-1,h;n>=0;n--)(h=r[n])&&(s=h(e,t,s)||s);return s&&x(e,t,s),s};const l=class c extends o.VividElement{constructor(){super(...arguments),this._options=[],this.selectedIndex=-1,this.selectedOptions=[],this.shouldSkipFocus=!1,this.typeaheadBuffer="",this.typeaheadExpired=!0,this.typeaheadTimeout=-1,this._activeDescendant=null}get firstSelectedOption(){return this.selectedOptions[0]??null}get length(){return this.options.length}get options(){return o.Observable.track(this,"options"),this._options}set options(e){const t=this._options;if(this._options=e,o.Observable.notify(this,"options"),this.$fastController.isConnected){const i=this._newDefaultSelectedIndex(t,e,this.selectedIndex);i!==null&&(this.selectedIndex=i)}}static{this.slottedOptionFilter=e=>p.isListboxOption(e)&&!e.hidden}static{this.TYPE_AHEAD_TIMEOUT_MS=1e3}clickHandler(e){const t=e.target.closest("option,[role=option],[data-vvd-component=option]");if(t&&!t.disabled)return this.selectedIndex=this.options.indexOf(t),!0}focusAndScrollOptionIntoView(e=this.firstSelectedOption){this.contains(document.activeElement)&&e!==null&&(e.focus(),requestAnimationFrame(()=>{e.scrollIntoView({block:"nearest"})}))}focusinHandler(e){!this.shouldSkipFocus&&e.target===e.currentTarget&&(this.setSelectedOptions(),this.focusAndScrollOptionIntoView()),this.shouldSkipFocus=!1}getTypeaheadMatches(){const e=this.typeaheadBuffer.replace(/[.*+\-?^${}()|[\]\\]/g,"\\$&"),t=new RegExp(`^${e}`,"gi");return this.options.filter(i=>i.text.trim().match(t))}getNextSelectableIndex(e){const t=this.options.reduce((i,s,n)=>!i&&!s.disabled&&n>=e?s:i,null);return this.options.indexOf(t)}getPreviousSelectableIndex(e){const t=this.options.reduceRight((i,s,n)=>!i&&!s.disabled&&n<=e?s:i,null);return this.options.indexOf(t)}handleChange(e,t){switch(t){case"selected":{/* v8 ignore else -- @preserve */c.slottedOptionFilter(e)&&(this.selectedIndex=this.options.indexOf(e)),this.setSelectedOptions();break}}}handleTypeAhead(e){/* v8 ignore else -- @preserve */this.typeaheadTimeout&&window.clearTimeout(this.typeaheadTimeout),this.typeaheadTimeout=window.setTimeout(()=>this.typeaheadExpired=!0,c.TYPE_AHEAD_TIMEOUT_MS),this.typeaheadBuffer=`${this.typeaheadExpired?"":this.typeaheadBuffer}${e}`}keydownHandler(e){if(this.disabled)return!0;this.shouldSkipFocus=!1;const t=e.key;switch(t){case d.keyHome:{/* v8 ignore else -- @preserve */e.shiftKey||(e.preventDefault(),this.selectFirstOption());break}case d.keyArrowDown:{/* v8 ignore else -- @preserve */e.shiftKey||(e.preventDefault(),this.selectNextOption());break}case d.keyArrowUp:{/* v8 ignore else -- @preserve */e.shiftKey||(e.preventDefault(),this.selectPreviousOption());break}case d.keyEnd:{e.preventDefault(),this.selectLastOption();break}case d.keyTab:return this.focusAndScrollOptionIntoView(),!0;case d.keyEnter:case d.keyEscape:return!0;case d.keySpace:{/* v8 ignore else -- @preserve */if(this.typeaheadExpired)return!0}default:{/* v8 ignore else -- @preserve */return t.length===1&&this.handleTypeAhead(`${t}`),!0}}}mousedownHandler(e){return this.shouldSkipFocus=!this.contains(document.activeElement),!0}selectedIndexChanged(e,t){const i=this._validSelectedIndex(t);if(t!==i){this.selectedIndex=i;return}this.setSelectedOptions()}_validSelectedIndex(e){return e>this.options.length-1||e<-1?-1:e}selectedOptionsChanged(e,t){const i=t.filter(c.slottedOptionFilter);this.options.forEach(s=>{const n=o.Observable.getNotifier(s);n.unsubscribe(this,"selected"),s.selected=i.includes(s),n.subscribe(this,"selected")})}selectFirstOption(){/* v8 ignore else -- @preserve */this.disabled||(this.selectedIndex=this.options.findIndex(e=>!e.disabled))}selectLastOption(){/* v8 ignore else -- @preserve */this.disabled||(this.selectedIndex=f(this.options,e=>!e.disabled))}selectNextOption(){/* v8 ignore else -- @preserve */if(!this.disabled&&this.selectedIndex<this.options.length-1){const e=this.getNextSelectableIndex(this.selectedIndex+1);e!==-1&&(this.selectedIndex=e)}}selectPreviousOption(){/* v8 ignore else -- @preserve */if(!this.disabled&&this.selectedIndex>0){const e=this.getPreviousSelectableIndex(this.selectedIndex-1);e!==-1&&(this.selectedIndex=e)}}_newDefaultSelectedIndex(e,t,i){for(const[s,n]of t.entries())if(this._isDefaultSelected(n)&&!e.includes(n))return s;return null}_isDefaultSelected(e){return e.defaultSelected}setSelectedOptions(){this.selectedOptions=this.selectedIndex!==-1?[this.options[this.selectedIndex]]:[],this._activeDescendant=this.firstSelectedOption?.id??"",this.focusAndScrollOptionIntoView()}slottedOptionsChanged(e,t){this.options=t.reduce((s,n)=>{/* v8 ignore else -- @preserve */return p.isListboxOption(n)&&s.push(n),s},[]);const i=`${this.options.length}`;this.options.forEach((s,n)=>{s.id||(s.id=u.uniqueId("option-")),s.ariaPosInSet=`${n+1}`,s.ariaSetSize=i})}typeaheadBufferChanged(e,t){if(this.$fastController.isConnected){const i=this.getTypeaheadMatches();/* v8 ignore else -- @preserve */if(i.length){const s=this.options.indexOf(i[0]);/* v8 ignore else -- @preserve */s>-1&&(this.selectedIndex=s)}this.typeaheadExpired=!1}}};a([o.attr({mode:"boolean"})],l.prototype,"disabled");a([o.observable],l.prototype,"selectedIndex");a([o.observable],l.prototype,"selectedOptions");a([o.observable],l.prototype,"slottedOptions");a([o.observable],l.prototype,"typeaheadBuffer");a([o.observable],l.prototype,"_activeDescendant");let b=l;exports.Listbox=b;

package/bundled/listbox.js

@@ -1,20 +1,20 @@
 import { i as p } from "./definition12.js";
-import { V as u, O as h, a as f, o as a } from "./vivid-element.js";
-import { l as x, d as O, f as y, m as I, k as b, c as S, b as g, a as m } from "./key-codes.js";
-import { u as _ } from "./strings.js";
-function k(d, e) {
+import { V as u, O as h, a as f, o as r } from "./vivid-element.js";
+import { l as x, d as I, f as O, m as y, k as b, c as S, b as g, a as v } from "./key-codes.js";
+import { u as m } from "./strings.js";
+function _(d, e) {
   let t = d.length;
   for (; t--; )
     if (e(d[t], t, d))
       return t;
   return -1;
 }
-var v = Object.defineProperty, l = (d, e, t, i) => {
+var k = Object.defineProperty, l = (d, e, t, i) => {
   for (var s = void 0, n = d.length - 1, c; n >= 0; n--)
     (c = d[n]) && (s = c(e, t, s) || s);
-  return s && v(e, t, s), s;
+  return s && k(e, t, s), s;
 };
-const o = class r extends u {
+const o = class a extends u {
   constructor() {
     super(...arguments), this._options = [], this.selectedIndex = -1, this.selectedOptions = [], this.shouldSkipFocus = !1, this.typeaheadBuffer = "", this.typeaheadExpired = !0, this.typeaheadTimeout = -1, this._activeDescendant = null;
   }
@@ -104,6 +104,13 @@ const o = class r extends u {
     ), t = new RegExp(`^${e}`, "gi");
     return this.options.filter((i) => i.text.trim().match(t));
   }
+  /**
+   * Finds the index of the next non-disabled option starting from the given index.
+   *
+   * @param fromIndex - The index to start searching from (inclusive)
+   * @returns The index of the next selectable option, or -1 if none found
+   * @internal
+   */
   getNextSelectableIndex(e) {
     const t = this.options.reduce(
       (i, s, n) => !i && !s.disabled && n >= e ? s : i,
@@ -111,6 +118,20 @@ const o = class r extends u {
     );
     return this.options.indexOf(t);
   }
+  /**
+   * Finds the index of the previous non-disabled option starting from the given index.
+   *
+   * @param fromIndex - The index to start searching from (inclusive)
+   * @returns The index of the previous selectable option, or -1 if none found
+   * @internal
+   */
+  getPreviousSelectableIndex(e) {
+    const t = this.options.reduceRight(
+      (i, s, n) => !i && !s.disabled && n <= e ? s : i,
+      null
+    );
+    return this.options.indexOf(t);
+  }
   /**
    * Handles external changes to child options.
    *
@@ -123,7 +144,7 @@ const o = class r extends u {
     switch (t) {
       case "selected": {
         /* v8 ignore else -- @preserve */
-        r.slottedOptionFilter(e) && (this.selectedIndex = this.options.indexOf(e)), this.setSelectedOptions();
+        a.slottedOptionFilter(e) && (this.selectedIndex = this.options.indexOf(e)), this.setSelectedOptions();
         break;
       }
     }
@@ -142,7 +163,7 @@ const o = class r extends u {
     /* v8 ignore else -- @preserve */
     this.typeaheadTimeout && window.clearTimeout(this.typeaheadTimeout), this.typeaheadTimeout = window.setTimeout(
       () => this.typeaheadExpired = !0,
-      r.TYPE_AHEAD_TIMEOUT_MS
+      a.TYPE_AHEAD_TIMEOUT_MS
     ), this.typeaheadBuffer = `${this.typeaheadExpired ? "" : this.typeaheadBuffer}${e}`;
   }
   /**
@@ -156,7 +177,7 @@ const o = class r extends u {
     this.shouldSkipFocus = !1;
     const t = e.key;
     switch (t) {
-      case m: {
+      case v: {
         /* v8 ignore else -- @preserve */
         e.shiftKey || (e.preventDefault(), this.selectFirstOption());
         break;
@@ -175,10 +196,10 @@ const o = class r extends u {
         e.preventDefault(), this.selectLastOption();
         break;
       }
-      case I:
-        return this.focusAndScrollOptionIntoView(), !0;
       case y:
+        return this.focusAndScrollOptionIntoView(), !0;
       case O:
+      case I:
         return !0;
       case x: {
         /* v8 ignore else -- @preserve */
@@ -225,7 +246,7 @@ const o = class r extends u {
    * @internal
    */
   selectedOptionsChanged(e, t) {
-    const i = t.filter(r.slottedOptionFilter);
+    const i = t.filter(a.slottedOptionFilter);
     this.options.forEach((s) => {
       const n = h.getNotifier(s);
       n.unsubscribe(this, "selected"), s.selected = i.includes(s), n.subscribe(this, "selected");
@@ -247,7 +268,7 @@ const o = class r extends u {
    */
   selectLastOption() {
     /* v8 ignore else -- @preserve */
-    this.disabled || (this.selectedIndex = k(this.options, (e) => !e.disabled));
+    this.disabled || (this.selectedIndex = _(this.options, (e) => !e.disabled));
   }
   /**
    * Moves focus to the next selectable option.
@@ -256,7 +277,10 @@ const o = class r extends u {
    */
   selectNextOption() {
     /* v8 ignore else -- @preserve */
-    !this.disabled && this.selectedIndex < this.options.length - 1 && (this.selectedIndex += 1);
+    if (!this.disabled && this.selectedIndex < this.options.length - 1) {
+      const e = this.getNextSelectableIndex(this.selectedIndex + 1);
+      e !== -1 && (this.selectedIndex = e);
+    }
   }
   /**
    * Moves focus to the previous selectable option.
@@ -265,7 +289,10 @@ const o = class r extends u {
    */
   selectPreviousOption() {
     /* v8 ignore else -- @preserve */
-    !this.disabled && this.selectedIndex > 0 && (this.selectedIndex = this.selectedIndex - 1);
+    if (!this.disabled && this.selectedIndex > 0) {
+      const e = this.getPreviousSelectableIndex(this.selectedIndex - 1);
+      e !== -1 && (this.selectedIndex = e);
+    }
   }
   /// For this options change, determine if selectedIndex should change based on defaultSelected. Otherwise, returns null.
   _newDefaultSelectedIndex(e, t, i) {
@@ -298,7 +325,7 @@ const o = class r extends u {
     }, []);
     const i = `${this.options.length}`;
     this.options.forEach((s, n) => {
-      s.id || (s.id = _("option-")), s.ariaPosInSet = `${n + 1}`, s.ariaSetSize = i;
+      s.id || (s.id = m("option-")), s.ariaPosInSet = `${n + 1}`, s.ariaSetSize = i;
     });
   }
   /**
@@ -323,19 +350,19 @@ l([
   f({ mode: "boolean" })
 ], o.prototype, "disabled");
 l([
-  a
+  r
 ], o.prototype, "selectedIndex");
 l([
-  a
+  r
 ], o.prototype, "selectedOptions");
 l([
-  a
+  r
 ], o.prototype, "slottedOptions");
 l([
-  a
+  r
 ], o.prototype, "typeaheadBuffer");
 l([
-  a
+  r
 ], o.prototype, "_activeDescendant");
 let A = o;
 export {

package/bundled/localized.cjs

@@ -1 +1 @@
-"use strict";const s=require("./vivid-element.cjs"),l="Play",c="Pause",d="Replay",u="Duration",p="LIVE",b="Loaded",g="Progress",h="Fullscreen",m="Mute",y="Unmute",L="Subtitles",f="Captions",C="Chapters",k="Descriptions",S="Close",v="Text",P="White",T="Black",w="Red",M="Green",D="Blue",B="Yellow",x="Magenta",E="Cyan",A="Background",$="Window",F="Transparent",O="Opaque",R="None",I="Raised",N="Depressed",U="Uniform",W="Casual",Y="Script",z="Reset",V="Done",G="Color",_="Opacity",q={"Audio Player":"Audio Player","Video Player":"Video Player",Play:l,Pause:c,Replay:d,"Current Time":"Current Time",Duration:u,"Remaining Time":"Remaining Time","Stream Type":"Stream Type",LIVE:p,"Seek to live, currently behind live":"Seek to live, currently behind live","Seek to live, currently playing live":"Seek to live, currently playing live",Loaded:b,Progress:g,"Progress Bar":"Progress Bar","progress bar timing: currentTime={1} duration={2}":"{1} of {2}",Fullscreen:h,"Exit Fullscreen":"Exit Fullscreen",Mute:m,Unmute:y,"Playback Rate":"Playback Rate",Subtitles:L,"subtitles off":"subtitles off",Captions:f,"captions off":"captions off",Chapters:C,Descriptions:k,"descriptions off":"descriptions off","Audio Track":"Audio Track","Volume Level":"Volume Level","You aborted the media playback":"You aborted the media playback","A network error caused the media download to fail part-way.":"A network error caused the media download to fail part-way.","The media could not be loaded, either because the server or network failed or because the format is not supported.":"The media could not be loaded, either because the server or network failed or because the format is not supported.","The media playback was aborted due to a corruption problem or because the media used features your browser did not support.":"The media playback was aborted due to a corruption problem or because the media used features your browser did not support.","No compatible source was found for this media.":"No compatible source was found for this media.","The media is encrypted and we do not have the keys to decrypt it.":"The media is encrypted and we do not have the keys to decrypt it.","Play Video":"Play Video",Close:S,"Close Modal Dialog":"Close Modal Dialog","Modal Window":"Modal Window","This is a modal window":"This is a modal window","This modal can be closed by pressing the Escape key or activating the close button.":"This modal can be closed by pressing the Escape key or activating the close button.",", opens captions settings dialog":", opens captions settings dialog",", opens subtitles settings dialog":", opens subtitles settings dialog",", opens descriptions settings dialog":", opens descriptions settings dialog",", selected":", selected","captions settings":"captions settings","subtitles settings":"subtitles settings","descriptions settings":"descriptions settings",Text:v,White:P,Black:T,Red:w,Green:M,Blue:D,Yellow:B,Magenta:x,Cyan:E,Background:A,Window:$,Transparent:F,"Semi-Transparent":"Semi-Transparent",Opaque:O,"Font Size":"Font Size","Text Edge Style":"Text Edge Style",None:R,Raised:I,Depressed:N,Uniform:U,"Drop shadow":"Drop shadow","Font Family":"Font Family","Proportional Sans-Serif":"Proportional Sans-Serif","Monospace Sans-Serif":"Monospace Sans-Serif","Proportional Serif":"Proportional Serif","Monospace Serif":"Monospace Serif",Casual:W,Script:Y,"Small Caps":"Small Caps",Reset:z,"restore all settings to the default values":"restore all settings to the default values",Done:V,"Caption Settings Dialog":"Caption Settings Dialog","Beginning of dialog window. Escape will cancel and close the window.":"Beginning of dialog window. Escape will cancel and close the window.","End of dialog window.":"End of dialog window.","{1} is loading.":"{1} is loading.","Exit Picture-in-Picture":"Exit Picture-in-Picture","Picture-in-Picture":"Picture-in-Picture","No content":"No content",Color:G,Opacity:_,"Text Background":"Text Background","Caption Area Background":"Caption Area Background","Playing in Picture-in-Picture":"Playing in Picture-in-Picture","Skip backward {1} seconds":"Skip backward {1} seconds","Skip forward {1} seconds":"Skip forward {1} seconds"},j=Object.freeze(Object.defineProperty({__proto__:null,Background:A,Black:T,Blue:D,Captions:f,Casual:W,Chapters:C,Close:S,Color:G,Cyan:E,Depressed:N,Descriptions:k,Done:V,Duration:u,Fullscreen:h,Green:M,LIVE:p,Loaded:b,Magenta:x,Mute:m,None:R,Opacity:_,Opaque:O,Pause:c,Play:l,Progress:g,Raised:I,Red:w,Replay:d,Reset:z,Script:Y,Subtitles:L,Text:v,Transparent:F,Uniform:U,Unmute:y,White:P,Window:$,Yellow:B,default:q},Symbol.toStringTag,{value:"Module"})),K={lang:"en-US",common:{useCommaAsDecimalSeparator:!1},pickerField:{clearLabel:"Clear",okLabel:"OK"},calendarPicker:{months:{name:["January","February","March","April","May","June","July","August","September","October","November","December"],shorthand:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]},weekdays:{name:["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"],shorthand:["Sun","Mon","Tue","Wed","Thu","Fri","Sat"]},firstDayOfWeek:0,dateFormat:"MM/dd/yyyy",dateFormatPlaceholder:"MM/DD/YYYY",chooseDateLabel:"Choose date",changeDateLabel:e=>`Change date, ${e}`,chooseDatesLabel:"Choose dates",changeDatesLabel:e=>`Change dates, ${e}`,prevYearLabel:"Previous year",prevMonthLabel:"Previous month",nextMonthLabel:"Next month",nextYearLabel:"Next year",todayLabel:"today",selectedLabel:"selected",currentLabel:"current",changeMonthLabel:e=>`Change month, ${e} selected`,showCalendarForMonthLabel:e=>`Show calendar for ${e}`,invalidDateError:"Please enter a valid date.",invalidDateRangeError:"Please enter a valid date range.",startDateAfterMinDateError:e=>`The start date must be ${e} or later.`,endDateBeforeMaxDateError:e=>`The end date must be ${e} or earlier.`},timePicker:{defaultTo12HourClock:!0,chooseTimeLabel:"Choose time",changeTimeLabel:e=>`Change time, ${e}`,hoursLabel:"hours",minutesLabel:"minutes",secondsLabel:"seconds",meridiesLabel:"AM/PM",invalidTimeError:"Please enter a valid time."},dateTimePicker:{chooseDateTimeLabel:"Choose date and time",changeDateTimeLabel:e=>`Change date and time, ${e}`,invalidDateTimeError:"Please enter a valid date and time.",dateBeforeMinDateError:e=>`Date must be ${e} or later.`,dateAfterMaxDateError:e=>`Date must be ${e} or earlier.`,timeBeforeMinTimeError:e=>`Time must be ${e} or later.`,timeAfterMaxTimeError:e=>`Time must be ${e} or earlier.`},filePicker:{invalidFileTypeError:"You can't select files of this type.",maxFilesExceededError:"You can't select any more files.",fileTooBigError:"File is too big ({{filesize}}MiB). Max filesize: {{maxFilesize}}MiB.",removeFileLabel:"Remove file",invalidFilesError:"One or more selected files are invalid. Please, upload only valid file types under the size limit.",uploadFilesLabel:"Upload files"},audioPlayer:{playButtonLabel:"Play",pauseButtonLabel:"Pause",sliderLabel:"Audio progress bar",skipForwardButton:"Skip Forward",skipBackwardButton:"Skip Backward"},alert:{dismissButtonLabel:"Close"},dialog:{dismissButtonLabel:"Close"},banner:{dismissButtonLabel:"Close"},numberField:{incrementButtonLabel:e=>e===1?"Increase value":`Increase value by ${e}`,decrementButtonLabel:e=>e===1?"Decrease value":`Decrease value by ${e}`,updatedValueAnnouncement:e=>`Updated value: ${e}`},splitButton:{showMoreActionsLabel:"Show more actions"},videoPlayer:j,rangeSlider:{startThumbLabel:"min",endThumbLabel:"max"},dialPad:{inputLabel:"Phone number",deleteButtonLabel:"Delete last digit",callButtonLabel:"Call",endCallButtonLabel:"End call",digitOneLabel:"1",digitTwoLabel:"2 ABC",digitThreeLabel:"3 DEF",digitFourLabel:"4 GHI",digitFiveLabel:"5 JKL",digitSixLabel:"6 MNO",digitSevenLabel:"7 PQRS",digitEightLabel:"8 TUV",digitNineLabel:"9 WXYZ",digitAsteriskLabel:"*",digitZeroLabel:"0",digitHashtagLabel:"#",errorLabel:"Error:"},tab:{dismissButtonLabel:"Press the DELETE key to close this tab"},searchableSelect:{clearButtonLabel:"Clear selection",noOptionsMessage:"No options",noMatchesMessage:"No options found",selectAllLabel:"Select All",deselectAllLabel:"Deselect All",selectedAllMessage:"All options selected",deselectedAllMessage:"All options deselected",loadingOptionsMessage:"Loading...",removeTagButtonLabel:e=>`Remove ${e}`,optionSelectedMessage:e=>`Option ${e} selected.`,optionDeselectedMessage:e=>`Option ${e} deselected.`,optionFocusedMessage:(e,t,o,n)=>`Option ${e} focused, ${n?"selected, ":""}${t} of ${o}.`,maxSelectedMessage:(e,t)=>`${e} of ${t} selected.`},richTextEditor:{paragraphStyles:"Paragraph styles",textSize:"Text size",bold:"Bold",italic:"Italic",underline:"Underline",strikethrough:"Strikethrough",monospace:"Monospace",textColor:"Text color",undo:"Undo",redo:"Redo",bulletList:"Bullet list",numberedList:"Numbered list",alignment:"Alignment",alignments:{left:"Left",center:"Center",right:"Right"},hyperlink:"Hyperlink",linkText:"Text",linkUrl:"URL",linkTextPlaceholder:"Type text to convert into link",linkUrlPlaceholder:"Insert link URL",cancel:"Cancel",apply:"Apply",close:"Close",edit:"Edit",delete:"Delete",clickHere:"Click here",imageSizes:{small:"Small",fit:"Fit",original:"Original size"}},button:{pendingLabel:"Loading..."},feedbackMessage:{errorIconText:"Error:",successIconText:"Success:"},connotationAnnoncement:{accentIcon:"Accent:",alertIcon:"Alert:",informationIcon:"Information:",successIcon:"Success:",warningIcon:"Warning:",announcementIcon:"Announcement:",ctaIcon:"Call to action:"},charCount:{charactersLimitMessage:e=>`You can enter up to ${e} characters`,charactersRemainingMessage:e=>`You have ${e} characters remaining`},dataGrid:{cell:{selected:"Selected",button:"(button)",sortStatus:{ascending:"Sorted ascending.",descending:"Sorted descending.",none:"Not sorted.",other:"Custom sort applied."},sortInstruction:{ascending:"Click to sort descending.",descending:"Click to un-sort.",none:"Click to sort ascending.",other:"Click to reset sorting."}}},pagination:{previousPageLabel:"Go to previous page",nextPageLabel:"Go to next page",goToPageLabel:e=>`Go to page ${e}`},tag:{remove:e=>`Remove ${e}`},toggletip:{anchorLabel:e=>e?`Show more information about ${e}`:"Show more information"},baseColorPicker:{colorSwatchLabel:(e,t,o)=>{let n=t?`Select ${t}, hex: ${e}`:`Select ${e}`;return o&&(n+=", selected."),n}},simpleColorPicker:{colorPaletteLabel:"Color palette"},colorPicker:{popupLabel:"Color Picker",swatchesLabel:"Saved colors",pickerButtonLabel:"Color Picker",hexInputLabel:"HEX color code",saveButtonLabel:"Save current color",closeButtonLabel:"Close Color Picker",copyButtonLabel:"Copy color to clipboard",copyErrorText:"Copy failed. Clipboard access was blocked. Try again.",copySuccessMessage:e=>`Color ${e} copied to clipboard.`,selectionSuccessMessage:e=>`Color ${e} selected.`,maxSwatchesMessage:(e,t)=>`${e} of ${t} colors saved.`}};var X=Object.defineProperty,Z=(e,t,o,n)=>{for(var a=void 0,i=e.length-1,r;i>=0;i--)(r=e[i])&&(a=r(t,o,a)||a);return a&&X(t,o,a),a};class H{constructor(){this.locale=K}}Z([s.observable],H.prototype,"locale");const Q=new H,J=e=>{class t extends e{get locale(){return Q.locale}}return t},ee=e=>{class t extends J(e){localeChanged(){}connectedCallback(){super.connectedCallback(),this.#o()}disconnectedCallback(){super.disconnectedCallback(),this.#a()}#t={handleChange:()=>{this.localeChanged()}};#e;#o(){this.#e=s.Observable.binding(()=>this.locale,this.#t),this.#e.observe(this,s.ExecutionContext.default)}#a(){this.#e.dispose()}}return t};exports.Localized=J;exports.WithObservableLocale=ee;
+"use strict";const i=require("./vivid-element.cjs"),l="Play",c="Pause",d="Replay",u="Duration",p="LIVE",b="Loaded",g="Progress",h="Fullscreen",m="Mute",y="Unmute",L="Subtitles",f="Captions",C="Chapters",S="Descriptions",k="Close",v="Text",P="White",T="Black",w="Red",M="Green",D="Blue",B="Yellow",x="Magenta",E="Cyan",A="Background",$="Window",F="Transparent",O="Opaque",R="None",I="Raised",N="Depressed",U="Uniform",W="Casual",Y="Script",z="Reset",V="Done",G="Color",_="Opacity",q={"Audio Player":"Audio Player","Video Player":"Video Player",Play:l,Pause:c,Replay:d,"Current Time":"Current Time",Duration:u,"Remaining Time":"Remaining Time","Stream Type":"Stream Type",LIVE:p,"Seek to live, currently behind live":"Seek to live, currently behind live","Seek to live, currently playing live":"Seek to live, currently playing live",Loaded:b,Progress:g,"Progress Bar":"Progress Bar","progress bar timing: currentTime={1} duration={2}":"{1} of {2}",Fullscreen:h,"Exit Fullscreen":"Exit Fullscreen",Mute:m,Unmute:y,"Playback Rate":"Playback Rate",Subtitles:L,"subtitles off":"subtitles off",Captions:f,"captions off":"captions off",Chapters:C,Descriptions:S,"descriptions off":"descriptions off","Audio Track":"Audio Track","Volume Level":"Volume Level","You aborted the media playback":"You aborted the media playback","A network error caused the media download to fail part-way.":"A network error caused the media download to fail part-way.","The media could not be loaded, either because the server or network failed or because the format is not supported.":"The media could not be loaded, either because the server or network failed or because the format is not supported.","The media playback was aborted due to a corruption problem or because the media used features your browser did not support.":"The media playback was aborted due to a corruption problem or because the media used features your browser did not support.","No compatible source was found for this media.":"No compatible source was found for this media.","The media is encrypted and we do not have the keys to decrypt it.":"The media is encrypted and we do not have the keys to decrypt it.","Play Video":"Play Video",Close:k,"Close Modal Dialog":"Close Modal Dialog","Modal Window":"Modal Window","This is a modal window":"This is a modal window","This modal can be closed by pressing the Escape key or activating the close button.":"This modal can be closed by pressing the Escape key or activating the close button.",", opens captions settings dialog":", opens captions settings dialog",", opens subtitles settings dialog":", opens subtitles settings dialog",", opens descriptions settings dialog":", opens descriptions settings dialog",", selected":", selected","captions settings":"captions settings","subtitles settings":"subtitles settings","descriptions settings":"descriptions settings",Text:v,White:P,Black:T,Red:w,Green:M,Blue:D,Yellow:B,Magenta:x,Cyan:E,Background:A,Window:$,Transparent:F,"Semi-Transparent":"Semi-Transparent",Opaque:O,"Font Size":"Font Size","Text Edge Style":"Text Edge Style",None:R,Raised:I,Depressed:N,Uniform:U,"Drop shadow":"Drop shadow","Font Family":"Font Family","Proportional Sans-Serif":"Proportional Sans-Serif","Monospace Sans-Serif":"Monospace Sans-Serif","Proportional Serif":"Proportional Serif","Monospace Serif":"Monospace Serif",Casual:W,Script:Y,"Small Caps":"Small Caps",Reset:z,"restore all settings to the default values":"restore all settings to the default values",Done:V,"Caption Settings Dialog":"Caption Settings Dialog","Beginning of dialog window. Escape will cancel and close the window.":"Beginning of dialog window. Escape will cancel and close the window.","End of dialog window.":"End of dialog window.","{1} is loading.":"{1} is loading.","Exit Picture-in-Picture":"Exit Picture-in-Picture","Picture-in-Picture":"Picture-in-Picture","No content":"No content",Color:G,Opacity:_,"Text Background":"Text Background","Caption Area Background":"Caption Area Background","Playing in Picture-in-Picture":"Playing in Picture-in-Picture","Skip backward {1} seconds":"Skip backward {1} seconds","Skip forward {1} seconds":"Skip forward {1} seconds"},j=Object.freeze(Object.defineProperty({__proto__:null,Background:A,Black:T,Blue:D,Captions:f,Casual:W,Chapters:C,Close:k,Color:G,Cyan:E,Depressed:N,Descriptions:S,Done:V,Duration:u,Fullscreen:h,Green:M,LIVE:p,Loaded:b,Magenta:x,Mute:m,None:R,Opacity:_,Opaque:O,Pause:c,Play:l,Progress:g,Raised:I,Red:w,Replay:d,Reset:z,Script:Y,Subtitles:L,Text:v,Transparent:F,Uniform:U,Unmute:y,White:P,Window:$,Yellow:B,default:q},Symbol.toStringTag,{value:"Module"})),K={lang:"en-US",common:{useCommaAsDecimalSeparator:!1},pickerField:{clearLabel:"Clear",okLabel:"OK"},calendarPicker:{months:{name:["January","February","March","April","May","June","July","August","September","October","November","December"],shorthand:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]},weekdays:{name:["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"],shorthand:["Sun","Mon","Tue","Wed","Thu","Fri","Sat"]},firstDayOfWeek:0,dateFormat:"MM/dd/yyyy",dateFormatPlaceholder:"MM/DD/YYYY",chooseDateLabel:"Choose date",changeDateLabel:e=>`Change date, ${e}`,chooseDatesLabel:"Choose dates",changeDatesLabel:e=>`Change dates, ${e}`,prevYearLabel:"Previous year",prevMonthLabel:"Previous month",nextMonthLabel:"Next month",nextYearLabel:"Next year",todayLabel:"today",selectedLabel:"selected",currentLabel:"current",changeMonthLabel:e=>`Change month, ${e} selected`,showCalendarForMonthLabel:e=>`Show calendar for ${e}`,invalidDateError:"Please enter a valid date.",invalidDateRangeError:"Please enter a valid date range.",startDateAfterMinDateError:e=>`The start date must be ${e} or later.`,endDateBeforeMaxDateError:e=>`The end date must be ${e} or earlier.`},timePicker:{defaultTo12HourClock:!0,chooseTimeLabel:"Choose time",changeTimeLabel:e=>`Change time, ${e}`,hoursLabel:"hours",minutesLabel:"minutes",secondsLabel:"seconds",meridiesLabel:"AM/PM",invalidTimeError:"Please enter a valid time."},dateTimePicker:{chooseDateTimeLabel:"Choose date and time",changeDateTimeLabel:e=>`Change date and time, ${e}`,invalidDateTimeError:"Please enter a valid date and time.",dateBeforeMinDateError:e=>`Date must be ${e} or later.`,dateAfterMaxDateError:e=>`Date must be ${e} or earlier.`,timeBeforeMinTimeError:e=>`Time must be ${e} or later.`,timeAfterMaxTimeError:e=>`Time must be ${e} or earlier.`},filePicker:{invalidFileTypeError:"You can't select files of this type.",maxFilesExceededError:"You can't select any more files.",fileTooBigError:"File is too big ({{filesize}}MiB). Max filesize: {{maxFilesize}}MiB.",removeFileLabel:"Remove file",invalidFilesError:"One or more selected files are invalid. Please, upload only valid file types under the size limit.",uploadFilesLabel:"Upload files"},audioPlayer:{playButtonLabel:"Play",pauseButtonLabel:"Pause",sliderLabel:"Audio progress bar",skipForwardButton:"Skip Forward",skipBackwardButton:"Skip Backward"},alert:{dismissButtonLabel:"Close"},dialog:{dismissButtonLabel:"Close"},banner:{dismissButtonLabel:"Close"},numberField:{incrementButtonLabel:e=>e===1?"Increase value":`Increase value by ${e}`,decrementButtonLabel:e=>e===1?"Decrease value":`Decrease value by ${e}`,updatedValueAnnouncement:e=>`Updated value: ${e}`},splitButton:{showMoreActionsLabel:"Show more actions"},videoPlayer:j,rangeSlider:{startThumbLabel:"min",endThumbLabel:"max"},dialPad:{inputLabel:"Phone number",deleteButtonLabel:"Delete last digit",callButtonLabel:"Call",endCallButtonLabel:"End call",digitOneLabel:"1",digitTwoLabel:"2 ABC",digitThreeLabel:"3 DEF",digitFourLabel:"4 GHI",digitFiveLabel:"5 JKL",digitSixLabel:"6 MNO",digitSevenLabel:"7 PQRS",digitEightLabel:"8 TUV",digitNineLabel:"9 WXYZ",digitAsteriskLabel:"*",digitZeroLabel:"0",digitHashtagLabel:"#",errorLabel:"Error:"},tab:{dismissButtonLabel:"Press the DELETE key to close this tab"},searchableSelect:{clearButtonLabel:"Clear selection",noOptionsMessage:"No options",noMatchesMessage:"No options found",selectAllLabel:"Select All",deselectAllLabel:"Deselect All",selectedAllMessage:"All options selected",deselectedAllMessage:"All options deselected",loadingOptionsMessage:"Loading...",removeTagButtonLabel:e=>`Remove ${e}`,optionSelectedMessage:e=>`Option ${e} selected.`,optionDeselectedMessage:e=>`Option ${e} deselected.`,optionFocusedMessage:(e,t,o,n)=>`Option ${e} focused, ${n?"selected, ":""}${t} of ${o}.`,maxSelectedMessage:(e,t)=>`${e} of ${t} selected.`},richTextEditor:{paragraphStyles:"Paragraph styles",textSize:"Text size",bold:"Bold",italic:"Italic",underline:"Underline",strikethrough:"Strikethrough",monospace:"Monospace",textColor:"Text color",undo:"Undo",redo:"Redo",bulletList:"Bullet list",numberedList:"Numbered list",alignment:"Alignment",alignments:{left:"Left",center:"Center",right:"Right"},hyperlink:"Hyperlink",linkText:"Text",linkUrl:"URL",linkTextPlaceholder:"Type text to convert into link",linkUrlPlaceholder:"Insert link URL",cancel:"Cancel",apply:"Apply",close:"Close",edit:"Edit",delete:"Delete",imageSizes:{small:"Small",fit:"Fit",original:"Original size"}},button:{pendingLabel:"Loading..."},feedbackMessage:{errorIconText:"Error:",successIconText:"Success:"},connotationAnnoncement:{accentIcon:"Accent:",alertIcon:"Alert:",informationIcon:"Information:",successIcon:"Success:",warningIcon:"Warning:",announcementIcon:"Announcement:",ctaIcon:"Call to action:"},charCount:{charactersLimitMessage:e=>`You can enter up to ${e} characters`,charactersRemainingMessage:e=>`You have ${e} characters remaining`},dataGrid:{cell:{selected:"Selected",button:"(button)",sortStatus:{ascending:"Sorted ascending.",descending:"Sorted descending.",none:"Not sorted.",other:"Custom sort applied."},sortInstruction:{ascending:"Click to sort descending.",descending:"Click to un-sort.",none:"Click to sort ascending.",other:"Click to reset sorting."}}},pagination:{previousPageLabel:"Go to previous page",nextPageLabel:"Go to next page",goToPageLabel:e=>`Go to page ${e}`},tag:{remove:e=>`Remove ${e}`},toggletip:{anchorLabel:e=>e?`Show more information about ${e}`:"Show more information"},baseColorPicker:{colorSwatchLabel:(e,t,o)=>{let n=t?`Select ${t}, hex: ${e}`:`Select ${e}`;return o&&(n+=", selected."),n}},simpleColorPicker:{colorPaletteLabel:"Color palette"},colorPicker:{popupLabel:"Color Picker",swatchesLabel:"Saved colors",pickerButtonLabel:"Color Picker",hexInputLabel:"HEX color code",saveButtonLabel:"Save current color",closeButtonLabel:"Close Color Picker",copyButtonLabel:"Copy color to clipboard",copyErrorText:"Copy failed. Clipboard access was blocked. Try again.",copySuccessMessage:e=>`Color ${e} copied to clipboard.`,selectionSuccessMessage:e=>`Color ${e} selected.`,maxSwatchesMessage:(e,t)=>`${e} of ${t} colors saved.`}};var X=Object.defineProperty,Z=(e,t,o,n)=>{for(var a=void 0,s=e.length-1,r;s>=0;s--)(r=e[s])&&(a=r(t,o,a)||a);return a&&X(t,o,a),a};class J{constructor(){this.locale=K}}Z([i.observable],J.prototype,"locale");const Q=new J,H=e=>{class t extends e{get locale(){return Q.locale}}return t},ee=e=>{class t extends H(e){localeChanged(){}connectedCallback(){super.connectedCallback(),this.#o()}disconnectedCallback(){super.disconnectedCallback(),this.#a()}#t={handleChange:()=>{this.localeChanged()}};#e;#o(){this.#e=i.Observable.binding(()=>this.locale,this.#t),this.#e.observe(this,i.ExecutionContext.default)}#a(){this.#e.dispose()}}return t};exports.Localized=H;exports.WithObservableLocale=ee;

package/bundled/localized.js

@@ -1,5 +1,5 @@
-import { o as H, O as J, E as j } from "./vivid-element.js";
-const r = "Play", l = "Pause", c = "Replay", d = "Duration", u = "LIVE", p = "Loaded", b = "Progress", g = "Fullscreen", h = "Mute", m = "Unmute", y = "Subtitles", L = "Captions", f = "Chapters", C = "Descriptions", k = "Close", S = "Text", P = "White", v = "Black", T = "Red", w = "Green", M = "Blue", D = "Yellow", B = "Magenta", x = "Cyan", E = "Background", A = "Window", $ = "Transparent", F = "Opaque", O = "None", R = "Raised", I = "Depressed", N = "Uniform", U = "Casual", W = "Script", Y = "Reset", z = "Done", V = "Color", G = "Opacity", q = {
+import { o as J, O as H, E as j } from "./vivid-element.js";
+const r = "Play", l = "Pause", c = "Replay", d = "Duration", u = "LIVE", p = "Loaded", b = "Progress", g = "Fullscreen", h = "Mute", m = "Unmute", y = "Subtitles", L = "Captions", f = "Chapters", C = "Descriptions", S = "Close", k = "Text", P = "White", v = "Black", T = "Red", w = "Green", M = "Blue", D = "Yellow", B = "Magenta", x = "Cyan", E = "Background", A = "Window", $ = "Transparent", F = "Opaque", O = "None", R = "Raised", I = "Depressed", N = "Uniform", U = "Casual", W = "Script", Y = "Reset", z = "Done", V = "Color", G = "Opacity", q = {
   "Audio Player": "Audio Player",
   "Video Player": "Video Player",
   Play: r,
@@ -37,7 +37,7 @@ const r = "Play", l = "Pause", c = "Replay", d = "Duration", u = "LIVE", p = "Lo
   "No compatible source was found for this media.": "No compatible source was found for this media.",
   "The media is encrypted and we do not have the keys to decrypt it.": "The media is encrypted and we do not have the keys to decrypt it.",
   "Play Video": "Play Video",
-  Close: k,
+  Close: S,
   "Close Modal Dialog": "Close Modal Dialog",
   "Modal Window": "Modal Window",
   "This is a modal window": "This is a modal window",
@@ -49,7 +49,7 @@ const r = "Play", l = "Pause", c = "Replay", d = "Duration", u = "LIVE", p = "Lo
   "captions settings": "captions settings",
   "subtitles settings": "subtitles settings",
   "descriptions settings": "descriptions settings",
-  Text: S,
+  Text: k,
   White: P,
   Black: v,
   Red: T,
@@ -103,7 +103,7 @@ const r = "Play", l = "Pause", c = "Replay", d = "Duration", u = "LIVE", p = "Lo
   Captions: L,
   Casual: U,
   Chapters: f,
-  Close: k,
+  Close: S,
   Color: V,
   Cyan: x,
   Depressed: I,
@@ -128,7 +128,7 @@ const r = "Play", l = "Pause", c = "Replay", d = "Duration", u = "LIVE", p = "Lo
   Reset: Y,
   Script: W,
   Subtitles: y,
-  Text: S,
+  Text: k,
   Transparent: $,
   Uniform: N,
   Unmute: m,
@@ -391,7 +391,6 @@ const r = "Play", l = "Pause", c = "Replay", d = "Duration", u = "LIVE", p = "Lo
     close: "Close",
     edit: "Edit",
     delete: "Delete",
-    clickHere: "Click here",
     imageSizes: {
       small: "Small",
       fit: "Fit",
@@ -508,7 +507,7 @@ class _ {
   }
 }
 Q([
-  H
+  J
 ], _.prototype, "locale");
 const ee = new _(), te = (e) => {
   class t extends e {
@@ -541,7 +540,7 @@ const ee = new _(), te = (e) => {
     };
     #e;
     #o() {
-      this.#e = J.binding(
+      this.#e = H.binding(
         () => this.locale,
         this.#t
       ), this.#e.observe(this, j.default);

package/bundled/text-field.cjs

@@ -1 +1 @@
-"use strict";const e='.label-wrapper{display:flex;flex-direction:row;align-items:center;gap:var(--label-wrapper-gap, 4px)}.label-wrapper[hidden]{display:none}.label:not(slot),.label::slotted(label){flex:0 1 auto}: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;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)}.label-wrapper{grid-column:1/4;grid-row:1}.char-count+.label-wrapper{grid-column:1/3}.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}';exports.styles=e;
+"use strict";const e='.label-wrapper{display:flex;flex-direction:row;align-items:center;gap:var(--label-wrapper-gap, 4px)}.label-wrapper[hidden]{display:none}.label:not(slot),.label::slotted(label){flex:0 1 auto}: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;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)}.label-wrapper{grid-column:1/4;grid-row:1}.char-count+.label-wrapper{grid-column:1/3}.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(--focus-stroke-color, 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(--focus-stroke-color, 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}';exports.styles=e;

package/bundled/text-field.js

@@ -1,4 +1,4 @@
-const e = '.label-wrapper{display:flex;flex-direction:row;align-items:center;gap:var(--label-wrapper-gap, 4px)}.label-wrapper[hidden]{display:none}.label:not(slot),.label::slotted(label){flex:0 1 auto}: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;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)}.label-wrapper{grid-column:1/4;grid-row:1}.char-count+.label-wrapper{grid-column:1/3}.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}';
+const e = '.label-wrapper{display:flex;flex-direction:row;align-items:center;gap:var(--label-wrapper-gap, 4px)}.label-wrapper[hidden]{display:none}.label:not(slot),.label::slotted(label){flex:0 1 auto}: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;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)}.label-wrapper{grid-column:1/4;grid-row:1}.char-count+.label-wrapper{grid-column:1/3}.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(--focus-stroke-color, 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(--focus-stroke-color, 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}';
 export {
   e as s
 };