@vonage/vivid 5.15.0 → 5.16.0

package/bundled/definition11.js

@@ -1,94 +1,78 @@
-import { P as d, p as l } from "./definition9.js";
-import { V as h, a, h as v, c as m, d as u } from "./vivid-element.js";
-import { A as f, a as E } from "./anchored.js";
-import { h as b } from "./index.js";
-import { c as x } from "./class-names.js";
-var y = Object.defineProperty, p = (n, e, s, t) => {
-  for (var o = void 0, r = n.length - 1, c; r >= 0; r--)
-    (c = n[r]) && (o = c(e, s, o) || o);
-  return o && y(e, s, o), o;
-};
-class i extends f(h) {
-  constructor() {
-    super(...arguments), this.open = !1, this.#t = () => {
-      this.open = !0, this.#s();
-    }, this.#e = () => {
-      this.open = !1, this.#s();
-    }, this.#n = (e) => {
-      /* v8 ignore else -- @preserve */
-      e.key === "Escape" && this.#e();
-    };
-  }
-  connectedCallback() {
-    super.connectedCallback(), this.#o();
-  }
-  disconnectedCallback() {
-    super.disconnectedCallback(), this.#o();
-  }
-  /**
-   * @internal
-   */
-  _anchorElChanged(e, s) {
-    e && this.#r(e), s && this.#i(s);
-  }
-  #i(e) {
-    e.addEventListener("mouseover", this.#t), e.addEventListener("mouseout", this.#e), e.addEventListener("focusin", this.#t), e.addEventListener("focusout", this.#e), e.setAttribute("aria-haspopup", "true"), e.setAttribute("aria-expanded", String(this.open));
-  }
-  #r(e) {
-    e.removeEventListener("mouseover", this.#t), e.removeEventListener("mouseout", this.#e), e.removeEventListener("focusin", this.#t), e.removeEventListener("focusout", this.#e), e.removeAttribute("aria-haspopup"), e.removeAttribute("aria-expanded");
-  }
-  #t;
-  #e;
-  #s() {
-    this._anchorEl && this._anchorEl.setAttribute("aria-expanded", String(this.open));
-  }
-  #o() {
-    document.removeEventListener("keydown", this.#n), this.open && this.isConnected && document.addEventListener("keydown", this.#n);
-  }
-  #n;
-  /**
-   * @internal
-   */
-  openChanged(e) {
-    e !== void 0 && this.#o();
-  }
-}
-p([
-  a
-], i.prototype, "text");
-p([
-  a({ mode: "fromView" })
-], i.prototype, "placement");
-p([
-  a({ mode: "boolean" })
-], i.prototype, "open");
-const g = ":host :host{display:var(--_popup-display, inline)}:host :host([slotted-anchor]){--_popup-display: contents}.control{pointer-events:none}.tooltip{width:var(--tooltip-inline-size, auto);box-sizing:border-box;padding:8px 12px;color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base-bold);max-inline-size:var(--tooltip-max-inline-size, 30ch)}", A = ({ open: n }) => x("control", ["open", !!n]), L = (n) => {
-  const e = n.tagFor(d), s = E();
-  return v`
-${s}
-<${e} class="${A}" arrow alternate
-	:placement=${(t) => t.placement}
-	:anchor="${(t) => t._anchorEl}"
-	:open="${(t) => t.open}"
-	@keydown="${(t, o) => {
-    t.open && b(o.event) && (t.open = !1);
-  }}"
-  exportparts="vvd-theme-alternate">
-  <div part="vvd-theme-alternate" class="tooltip" role="tooltip">
-		${(t) => t.text}
-  </div>
-</${e}>`;
-}, C = u(
-  "tooltip",
-  i,
-  L,
-  [l],
-  {
-    styles: g
-  }
-), P = m(C);
-export {
-  i as T,
-  P as r,
-  C as t
+import { T as e, d as t, l as n, o as r, s as i, t as a } from "./vivid-element.js";
+import { t as o } from "./when.js";
+import { t as s } from "./slotted.js";
+import { r as c, t as l } from "./definition2.js";
+import { t as u } from "./decorate.js";
+import { t as d } from "./class-names.js";
+import { n as f, t as p } from "./delegates-aria.js";
+import { t as m } from "./form-associated.js";
+import { t as h } from "./form-element.js";
+import { t as g } from "./with-success-text.js";
+import { t as _ } from "./with-error-text.js";
+import { a as v, t as y } from "./mixins.js";
+//#region src/lib/checkbox/checkbox.scss?inline
+var b = ":host{vertical-align:middle;--_low-ink-color:var(--vvd-color-neutral-600);flex-direction:column;gap:4px;display:inline-flex}: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)),.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,.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{vertical-align:middle;align-items:start;gap:8px;display:inline-flex}.base:focus-visible{outline:none}@supports (user-select:none){.base{user-select:none}}.base:not(.disabled){cursor:pointer}.base.disabled{pointer-events:none}.control{background-color:var(--_appearance-color-fill);block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 20));box-shadow:inset 0 0 0 2px var(--_appearance-color-outline);color:var(--_appearance-color-text);inline-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 20));border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;display:flex;position:relative}.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));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));display:block;position:absolute;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(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 20)) - 4px)}.base:not(.checked) .indicator.checkmark,.base.checked .indicator.minus,.base:not(.indeterminate) .indicator.minus{display:none}label{color:var(--vvd-color-canvas-text);cursor:pointer;font:var(--vvd-typography-base);flex-wrap:wrap;align-items:center;column-gap:4px;display:flex}.hide-label label{display:none}.icon{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 20)) * .6);line-height:1}", x = class extends p(y(_(g(h(m(a)))))) {
+	readOnlyChanged() {
+		/* v8 ignore if -- @preserve */
+		this.proxy instanceof HTMLInputElement && (this.proxy.readOnly = this.readOnly);
+	}
+	constructor() {
+		super(), this.tabindex = null, this.proxy = document.createElement("input"), this.initialValue = "on", this.defaultSlottedNodes = [], this.indeterminate = !1, this.keypressHandler = (e) => {
+			if (e.target instanceof HTMLAnchorElement) return !0;
+			if (!this.disabled && !this.readOnly) switch (e.key) {
+				case " ":
+					this.indeterminate &&= !1, this.checked = !this.checked;
+					break;
+			}
+			return !1;
+		}, this.clickHandler = (e) => e.target instanceof HTMLAnchorElement ? !0 : (!this.disabled && !this.readOnly && (this.indeterminate &&= !1, this.checked = !this.checked), !1), this.proxy.setAttribute("type", "checkbox");
+	}
+	ariaCheckedChanged(e, t) {
+		super.ariaCheckedChanged(e, t), this.ariaChecked === "mixed" ? this.indeterminate = !0 : (this.indeterminate = !1, this.checked = this.ariaChecked === "true");
+	}
+	checkedChanged(e, t) {
+		super.checkedChanged(e, t), this.ariaChecked = t == 1 ? "true" : "false", e !== void 0 && this.$emit("input");
+	}
 };
+u([n({ attribute: "tabindex" })], x.prototype, "tabindex", void 0), u([n], x.prototype, "connotation", void 0), u([n({
+	attribute: "readonly",
+	mode: "boolean"
+})], x.prototype, "readOnly", void 0), u([e], x.prototype, "defaultSlottedNodes", void 0), u([n({
+	attribute: "indeterminate",
+	mode: "boolean"
+})], x.prototype, "indeterminate", void 0), u([e], x.prototype, "slottedContent", void 0);
+//#endregion
+//#region src/lib/checkbox/checkbox.template.ts
+var S = ({ connotation: e, readOnly: t, checked: n, disabled: r, indeterminate: i, errorValidationMessage: a, successText: o, label: s, slottedContent: c }) => d("base", [`connotation-${e}`, !!e], ["readonly", !!t], ["checked", !!n || !!i], ["disabled", !!r], ["error connotation-alert", !!a], ["success connotation-success", !!o], ["hide-label", !s && !c?.length]), C = r("checkbox", x, (e) => {
+	let n = e.tagFor(c);
+	return t`<template>
+		<div
+			class="${S}"
+			aria-describedby="${(e) => e._feedbackDescribedBy}"
+			${f({
+		role: "checkbox",
+		ariaChecked: (e) => e.indeterminate ? "mixed" : e.checked,
+		ariaRequired: (e) => e.required,
+		ariaDisabled: (e) => e.disabled,
+		ariaReadOnly: (e) => e.readOnly
+	})}
+			tabindex="${(e) => e.tabindex === null ? e.disabled ? null : 0 : e.tabindex}"
+			@keypress="${(e, t) => e.keypressHandler(t.event)}"
+			@click="${(e, t) => e.clickHandler(t.event)}"
+		>
+			<div class="control">
+				${o((e) => e.checked && !e.indeterminate, t`<${n} name="check-solid" class="icon"></${n}>`)}
+				${o((e) => e.indeterminate, t`<${n} name="minus-solid" class="icon"></${n}>`)}
+			</div>
+			${t`<label
+				>${(e) => e.label}<slot ${s("slottedContent")}></slot
+			></label>`}
+		</div>
+		${(t) => t._getFeedbackTemplate(e)}
+	</template>`;
+}, [l, v], {
+	styles: b,
+	shadowOptions: { delegatesFocus: !0 }
+}), w = i(C);
+//#endregion
+export { w as n, x as r, C as t };

package/bundled/definition12.cjs

@@ -1,19 +1,19 @@
-"use strict";const v=require("./definition2.cjs"),t=require("./vivid-element.cjs"),p=require("./affix.cjs"),h=require("./host-semantics.cjs"),f=require("./dom.cjs"),l=require("./when.cjs"),m=require("./class-names.cjs");var x=Object.defineProperty,_=Object.getOwnPropertyDescriptor,n=(e,o,i,a)=>{for(var c=a>1?void 0:a?_(o,i):o,s=e.length-1,d;s>=0;s--)(d=e[s])&&(c=(a?d(o,i,c):d(c))||c);return a&&c&&x(o,i,c),c};function u(e){return f.isHTMLElement(e)&&(e.getAttribute("role")==="option"||e instanceof HTMLOptionElement||e instanceof r)}class r extends h.HostSemantics(p.AffixIconWithTrailing(t.VividElement)){constructor(o,i,a,c){super(),this.defaultSelected=!1,this.dirtySelected=!1,this.value="",this._highlighted=!1,this._displayCheckmark=!1,this._vvdSearchText="",this._isNotMatching=!1,o&&(this.text=o),i&&(this.value=i),a&&(this.defaultSelected=a),c&&(this.selected=c),this.proxy=new Option(this.text,this.value,this.defaultSelected,this.selected),this.proxy.disabled=this.disabled}defaultSelectedChanged(){this.dirtySelected||(this.selected=this.defaultSelected,this.proxy instanceof HTMLOptionElement&&(this.proxy.selected=this.defaultSelected)),this.proxy instanceof HTMLOptionElement&&(this.proxy.defaultSelected=this.defaultSelected)}disabledChanged(){/* v8 ignore if -- @preserve */this.proxy instanceof HTMLOptionElement&&(this.proxy.disabled=this.disabled)}get selectedAttribute(){return this.defaultSelected}set selectedAttribute(o){this.defaultSelected=o}selectedChanged(){this.dirtySelected||(this.dirtySelected=!0),this.proxy instanceof HTMLOptionElement&&(this.proxy.selected=this.selected)}valueChanged(){if(typeof this.value!="string"){this.value="";return}this.proxy instanceof HTMLOptionElement&&(this.proxy.value=this.value)}get label(){return this._label??this.text}set label(o){this._label=o}set text(o){this._text=o}get text(){return this._text??""}_getAccessibleName(){return this.ariaLabel||`${this.text}${this.textSecondary?` ${this.textSecondary}`:""}`}get form(){return null}get _hasMatchedText(){return!!(this.matchedText??this._vvdSearchText)}get _matchedRange(){const o=this.matchedText??this._vvdSearchText;if(o){const i=this.text.toLowerCase().indexOf(o.toLowerCase());return i===-1?{from:0,to:0}:{from:i,to:i+o.length}}return{from:0,to:0}}connectedCallback(){super.connectedCallback(),this.dirtySelected||(this.selected=this.defaultSelected,this.dirtySelected=!1)}}n([t.attr({converter:{fromView:e=>{if(e===!0||e==="true")return!0;if(e===!1||e==="false")return!1},toView:e=>e}})],r.prototype,"checked",2);n([t.attr({attribute:"selected",mode:"boolean"})],r.prototype,"defaultSelected",2);n([t.attr({mode:"boolean"})],r.prototype,"disabled",2);n([t.attr({attribute:"current-selected",mode:"boolean"})],r.prototype,"selected",2);n([t.attr({attribute:"value"})],r.prototype,"value",2);n([t.attr({attribute:"label"})],r.prototype,"_label",2);n([t.attr({attribute:"text"})],r.prototype,"_text",2);n([t.attr({attribute:"text-secondary"})],r.prototype,"textSecondary",2);n([t.observable],r.prototype,"_highlighted",2);n([t.observable],r.prototype,"_displayCheckmark",2);n([t.attr({attribute:"matched-text"})],r.prototype,"matchedText",2);n([t.observable],r.prototype,"_vvdSearchText",2);n([t.volatile],r.prototype,"_hasMatchedText",1);n([t.observable],r.prototype,"_isNotMatching",2);n([t.volatile],r.prototype,"_matchedRange",1);n([t.attr({attribute:"tag-connotation"})],r.prototype,"tagConnotation",2);const y=e=>m.classNames("base",["disabled",e.disabled],["selected",!!e.selected],["hover",!!e._highlighted],["active",!!e.checked],["icon",!!e.icon],["two-lines",!!e.text?.length&&!!e.textSecondary?.length]);function g(){return t.html`${l.when(e=>e.text||e.textSecondary,t.html`<span class="text">
-			${l.when(e=>e.text,t.html`<span class="text-primary">
-					${l.when(e=>e._hasMatchedText,t.html`${e=>e.text.slice(0,e._matchedRange.from)}<span class="match"
+const e=require(`./vivid-element.cjs`),t=require(`./when.cjs`),n=require(`./definition2.cjs`),r=require(`./decorate.cjs`),i=require(`./class-names.cjs`),a=require(`./dom.cjs`),o=require(`./affix.cjs`),s=require(`./host-semantics.cjs`);function c(e){return a.t(e)&&(e.getAttribute(`role`)===`option`||e instanceof HTMLOptionElement||e instanceof l)}var l=class extends s.t(o.n(e.t)){defaultSelectedChanged(){this.dirtySelected||(this.selected=this.defaultSelected,this.proxy instanceof HTMLOptionElement&&(this.proxy.selected=this.defaultSelected)),this.proxy instanceof HTMLOptionElement&&(this.proxy.defaultSelected=this.defaultSelected)}disabledChanged(){this.proxy instanceof HTMLOptionElement&&(this.proxy.disabled=this.disabled)}get selectedAttribute(){return this.defaultSelected}set selectedAttribute(e){this.defaultSelected=e}selectedChanged(){this.dirtySelected||=!0,this.proxy instanceof HTMLOptionElement&&(this.proxy.selected=this.selected)}valueChanged(){if(typeof this.value!=`string`){this.value=``;return}this.proxy instanceof HTMLOptionElement&&(this.proxy.value=this.value)}get label(){return this._label??this.text}set label(e){this._label=e}set text(e){this._text=e}get text(){return this._text??``}_getAccessibleName(){return this.ariaLabel||`${this.text}${this.textSecondary?` ${this.textSecondary}`:``}`}get form(){return null}get _hasMatchedText(){return!!(this.matchedText??this._vvdSearchText)}get _matchedRange(){let e=this.matchedText??this._vvdSearchText;if(e){let t=this.text.toLowerCase().indexOf(e.toLowerCase());return t===-1?{from:0,to:0}:{from:t,to:t+e.length}}return{from:0,to:0}}constructor(e,t,n,r){super(),this.defaultSelected=!1,this.dirtySelected=!1,this.value=``,this._highlighted=!1,this._displayCheckmark=!1,this._vvdSearchText=``,this._isNotMatching=!1,e&&(this.text=e),t&&(this.value=t),n&&(this.defaultSelected=n),r&&(this.selected=r),this.proxy=new Option(this.text,this.value,this.defaultSelected,this.selected),this.proxy.disabled=this.disabled}connectedCallback(){super.connectedCallback(),this.dirtySelected||=(this.selected=this.defaultSelected,!1)}};r.t([e.l({converter:{fromView:e=>{if(e===!0||e===`true`)return!0;if(e===!1||e===`false`)return!1},toView:e=>e}})],l.prototype,`checked`,void 0),r.t([e.l({attribute:`selected`,mode:`boolean`})],l.prototype,`defaultSelected`,void 0),r.t([e.l({mode:`boolean`})],l.prototype,`disabled`,void 0),r.t([e.l({attribute:`current-selected`,mode:`boolean`})],l.prototype,`selected`,void 0),r.t([e.l({attribute:`value`})],l.prototype,`value`,void 0),r.t([e.l({attribute:`label`})],l.prototype,`_label`,void 0),r.t([e.l({attribute:`text`})],l.prototype,`_text`,void 0),r.t([e.l({attribute:`text-secondary`})],l.prototype,`textSecondary`,void 0),r.t([e.T],l.prototype,`_highlighted`,void 0),r.t([e.T],l.prototype,`_displayCheckmark`,void 0),r.t([e.l({attribute:`matched-text`})],l.prototype,`matchedText`,void 0),r.t([e.T],l.prototype,`_vvdSearchText`,void 0),r.t([e.E],l.prototype,`_hasMatchedText`,null),r.t([e.T],l.prototype,`_isNotMatching`,void 0),r.t([e.E],l.prototype,`_matchedRange`,null),r.t([e.l],l.prototype,`connotation`,void 0),r.t([e.l({attribute:`tag-connotation`})],l.prototype,`tagConnotation`,void 0);var u=e=>i.t(`base`,[`connotation-${e.connotation}`,!!e.connotation],[`disabled`,e.disabled],[`selected`,!!e.selected],[`hover`,!!e._highlighted],[`active`,!!e.checked],[`icon`,!!e.icon],[`two-lines`,!!e.text?.length&&!!e.textSecondary?.length]);function d(){return e.d`${t.t(e=>e.text||e.textSecondary,e.d`<span class="text">
+			${t.t(e=>e.text,e.d`<span class="text-primary">
+					${t.t(e=>e._hasMatchedText,e.d`${e=>e.text.slice(0,e._matchedRange.from)}<span class="match"
 								>${e=>e.text.slice(e._matchedRange.from,e._matchedRange.to)}</span
 							>`)}${e=>e.text.slice(e._matchedRange.to)}
 				</span>`)}
-			${l.when(e=>e.textSecondary,t.html`<span class="text-secondary">${e=>e.textSecondary}</span>`)}
-		</span>`)}`}const S=e=>{const o=p.affixIconTemplateFactory(e),i=e.tagFor(v.Icon);return t.html`
+			${t.t(e=>e.textSecondary,e.d`<span class="text-secondary">${e=>e.textSecondary}</span>`)}
+		</span>`)}`}var f=e.o(`option`,l,r=>{let i=o.a(r),a=r.tagFor(n.r);return e.d`
 		<template
-			${h.applyHostSemantics({role:"option",ariaChecked:a=>a.checked,ariaSelected:a=>a.selected,ariaDisabled:a=>a.disabled})}
-			style="${a=>a._isNotMatching?"display: none":""}"
+			${s.n({role:`option`,ariaChecked:e=>e.checked,ariaSelected:e=>e.selected,ariaDisabled:e=>e.disabled})}
+			style="${e=>e._isNotMatching?`display: none`:``}"
 		>
-			<div class="${y}">
-				${a=>o(a.icon,p.IconWrapper.Slot)} ${g()}
+			<div class="${u}">
+				${e=>i(e.icon,o.i.Slot)} ${d()}
 				<slot name="trailing-meta"></slot>
-				${l.when(a=>a._displayCheckmark&&a.selected,t.html`<${i} class="checkmark" name="check-line"></${i}>`)}
+				${t.t(e=>e._displayCheckmark&&e.selected,e.d`<${a} class="checkmark" name="check-line"></${a}>`)}
 			</div>
 		</template>
-	`},w=":host([disabled]){cursor:not-allowed}.base{--_connotation-color-primary: var(--vvd-option-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-option-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-option-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-firm: var(--vvd-option-accent-firm, var(--vvd-color-canvas-text));--_connotation-color-faint: var(--vvd-option-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-option-accent-soft, var(--vvd-color-neutral-100));--_connotation-color-pale: var(--vvd-option-accent-pale, var(--vvd-color-neutral-300));--_connotation-color-dim: var(--vvd-option-accent-dim, var(--vvd-color-neutral-200))}.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{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);color:var(--_option-appearance-color-text, var(--_appearance-color-text));font:var(--vvd-typography-base);gap:var(--_option-gap);hyphens:auto;inline-size:100%;min-block-size:var(--_option-min-block-size);padding-inline:var(--_option-padding-inline);vertical-align:middle;word-break:break-word}.base{--_option-min-block-size: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))) ;--_option-padding-inline: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4) ;--_option-icon-size: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2) }.base:not(.two-lines){--_option-gap: calc( calc(1px*(36 + 4*clamp(-1, var(--vvd-size-density, 0), 2))) / 3);padding-block:calc(1px*(40 + 4*clamp(-1,var(--vvd-size-density, 0),2))/4)}.base.two-lines{gap:calc(1px*(40 + 4*clamp(-1,var(--vvd-size-density, 0),2))*.4);padding-block:calc(1px*(24 + 4*clamp(-1,var(--vvd-size-density, 0),2))/2)}@supports (user-select: none){.base{user-select:none}}.base:not(.disabled){cursor:pointer}.base.disabled{pointer-events:none}:host([scale=condensed]) .base{--_option-min-block-size: calc(1px*(32 + 4*clamp(-1, var(--vvd-size-density, 0), 2))) ;--_option-padding-inline: calc(1px*(24 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2) ;--_option-icon-size: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4) }:host([scale=condensed]) .base:not(.two-lines){--_option-gap: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/5) ;padding-block:calc(calc(1px*(36 + 4*clamp(-1,var(--vvd-size-density, 0),2))) / 6)}:host([scale=condensed]) .base.two-lines{gap:calc(calc(1px*(36 + 4*clamp(-1,var(--vvd-size-density, 0),2))) / 3);padding-block:calc(1px*(32 + 4*clamp(-1,var(--vvd-size-density, 0),2))/4)}.base.active{--focus-stroke-color: var(--vvd-color-cta-500);--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))}.base.hidden{display:none}.text{display:flex;flex-direction:column;font:var(--vvd-typography-base);gap:4px;margin-inline-end:auto}.text-primary,.text-secondary{display:block;font:var(--vvd-typography-base)}.text-primary{font:var(--vvd-typography-base)}.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)}.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)}.match{color:var(--vvd-color-cta-600);font:var(--vvd-typography-base-bold)}slot[name=icon]{font-size:var(--_option-icon-size);line-height:1}.base:not(.disabled,.selected) slot[name=icon]{color:var(--vvd-color-neutral-600)}.checkmark{font-size:var(--_option-icon-size)}",b=t.defineVividComponent("option",r,S,[v.iconDefinition],{styles:w}),k=t.createRegisterFunction(b);exports.ListboxOption=r;exports.isListboxOption=u;exports.listboxOptionDefinition=b;exports.registerOption=k;
+	`},[n.t],{styles:`:host([disabled]){cursor:not-allowed}.base.connotation-cta{--_connotation-color-primary:var(--vvd-option-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-option-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-option-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-firm:var(--vvd-option-cta-firm,var(--vvd-color-cta-600));--_connotation-color-faint:var(--vvd-option-cta-faint,var(--vvd-color-cta-50));--_connotation-color-soft:var(--vvd-option-cta-soft,var(--vvd-color-cta-100));--_connotation-color-pale:var(--vvd-option-cta-pale,var(--vvd-color-cta-300));--_connotation-color-dim:var(--vvd-option-cta-dim,var(--vvd-color-cta-200))}.base:not(.connotation-cta){--_connotation-color-primary:var(--vvd-option-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-option-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-option-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-firm:var(--vvd-option-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-faint:var(--vvd-option-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-soft:var(--vvd-option-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-pale:var(--vvd-option-accent-pale,var(--vvd-color-neutral-300));--_connotation-color-dim:var(--vvd-option-accent-dim,var(--vvd-color-neutral-200))}.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,.base.disabled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.base:active:where(:not(.disabled,:disabled)),.base.active:where(:not(.disabled,:disabled)),.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{box-sizing:border-box;background-color:var(--_appearance-color-fill);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_option-appearance-color-text,var(--_appearance-color-text));font:var(--vvd-typography-base);align-items:center;gap:var(--_option-gap);hyphens:auto;inline-size:100%;min-block-size:var(--_option-min-block-size);padding-inline:var(--_option-padding-inline);vertical-align:middle;word-break:break-word;--_option-min-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));--_option-padding-inline:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) / 2.5);--_option-icon-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) / 2);border-radius:8px;display:flex}.base:not(.two-lines){--_option-gap:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 4)) / 3);padding-block:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) / 4)}.base.two-lines{gap:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) / 2.5);padding-block:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16)) / 2)}@supports (user-select:none){.base{user-select:none}}.base:not(.disabled){cursor:pointer}.base.disabled{pointer-events:none}:host([scale=condensed]) .base{--_option-min-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));--_option-padding-inline:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16)) / 2);--_option-icon-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) / 2.5)}:host([scale=condensed]) .base:not(.two-lines){--_option-gap:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) / 5);padding-block:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 4)) / 6)}:host([scale=condensed]) .base.two-lines{gap:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 4)) / 3);padding-block:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8)) / 4)}.base.active{--focus-stroke-color:var(--vvd-color-cta-500);--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))}.base.hidden{display:none}.text{font:var(--vvd-typography-base);flex-direction:column;gap:4px;margin-inline-end:auto;display:flex}.text-primary,.text-secondary{font:var(--vvd-typography-base);display:block}.text-primary{font:var(--vvd-typography-base)}.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)}.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)}.match{color:var(--vvd-color-cta-600);font:var(--vvd-typography-base-bold)}slot[name=icon]{font-size:var(--_option-icon-size);line-height:1}.base:not(.disabled,.selected) slot[name=icon]{color:var(--vvd-color-neutral-600)}.checkmark{font-size:var(--_option-icon-size)}`}),p=e.s(f);Object.defineProperty(exports,`i`,{enumerable:!0,get:function(){return c}}),Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return p}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return l}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return f}});