@vonage/vivid 5.0.0 → 5.2.0

package/bundled/definition7.cjs

@@ -0,0 +1,30 @@
+"use strict";const u=require("./definition2.cjs"),a=require("./vivid-element.cjs"),p=require("./key-codes.cjs"),h=require("./affix.cjs"),b=require("./host-semantics.cjs"),v=require("./slotted.cjs"),k=require("./class-names.cjs"),s=require("./when.cjs"),g=":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)}",m={menuitem:"menuitem",menuitemcheckbox:"menuitemcheckbox",menuitemradio:"menuitemradio",presentation:"presentation"};var w=Object.defineProperty,c=(e,o,i,t)=>{for(var n=void 0,l=e.length-1,d;l>=0;l--)(d=e[l])&&(n=d(o,i,n)||n);return n&&w(o,i,n),n};class r extends b.HostSemantics(h.AffixIcon(a.VividElement)){constructor(){super(),this.role=m.menuitem,this.checked=!1,this.handleMenuItemClick=o=>this._isSyntheticClickEvent(o)?!0:(this.invoke(),!!this._isPresentational),this.handleMouseOver=o=>(this.disabled||!this.submenu||this.expanded||(this.expanded=!0),!1),this.handleMouseOut=o=>(!this.expanded||this.contains(document.activeElement)||(this.expanded=!1),!1),this.invoke=()=>{if(!(this.disabled||this._isPresentational))switch(this.controlType){case"checkbox":this.checked=!this.checked;break;case"radio":this.checked||(this.checked=!0);break;default:this.submenu?this.expanded=!0:this.$emit("change");break}},this.checkTrailing=!1,this.handleMenuItemKeyDown=o=>{if(o.defaultPrevented)return!1;switch(o.key){case p.keyEnter:case p.keySpace:return this.invoke(),this.disabled||this.#t(),!1;case p.keyArrowRight:return this.submenu&&(this.expanded=!0,this.#t()),!1;case p.keyArrowLeft:if(this.expanded)return this.#t(),this.expanded=!1,this.focus(),!1}return!0},this.#e=new WeakSet,this.addEventListener("expanded-change",this.#n)}expandedChanged(){this.$fastController.isConnected&&(this.submenu&&!this.expanded&&this.submenu.collapseExpandedItem(),this.$emit("expanded-change",this,{bubbles:!1}))}#a(){this._isPresentational?this.role==="menuitem"&&(this.role="presentation"):this.role==="presentation"&&(this.role=m.menuitem)}_isPresentationalChanged(){this.$fastController.isConnected&&this.#a()}checkedChanged(){this.$fastController.isConnected&&this.$emit("change")}connectedCallback(){super.connectedCallback(),a.DOM.queueUpdate(()=>{this._isPresentational=this._isPresentational??!0,this.#a()})}slottedSubmenuChanged(){this.submenu&&(this.submenu.anchor=this,this.submenu.placement="right-start",this.submenu.collapseExpandedItem=()=>this.#o(),this.submenu._popupOffset=5)}get submenu(){return this.slottedSubmenu?.length?this.slottedSubmenu[0]:null}get hasSubmenu(){return this.submenu!==null}#o(){this.expanded=!1}#n(){this.submenu&&(this.submenu.open=this.expanded)}#e;_isSyntheticClickEvent(o){return this.#e.has(o)}#t(){const o=new MouseEvent("click",{bubbles:!0,composed:!0});this.#e.add(o),this.dispatchEvent(o)}}c([a.attr({mode:"boolean"})],r.prototype,"disabled");c([a.attr({mode:"boolean"})],r.prototype,"expanded");c([a.observable],r.prototype,"_isPresentational");c([a.replaces({deprecatedPropertyName:"role",fromDeprecated:e=>{switch(e){case"menuitemcheckbox":return"checkbox";case"menuitemradio":return"radio";default:return}},toDeprecated:e=>{switch(e){case"checkbox":return"menuitemcheckbox";case"radio":return"menuitemradio";default:return"menuitem"}}}),a.attr({attribute:"control-type"})],r.prototype,"controlType");c([a.attr({mode:"boolean"})],r.prototype,"checked");c([a.attr],r.prototype,"text");c([a.attr({attribute:"text-secondary"})],r.prototype,"textSecondary");c([a.attr],r.prototype,"connotation");c([a.attr({mode:"boolean",attribute:"check-trailing"})],r.prototype,"checkTrailing");c([a.attr({attribute:"check-appearance"})],r.prototype,"checkedAppearance");c([a.observable],r.prototype,"metaSlottedContent");c([a.observable],r.prototype,"trailingMetaSlottedContent");c([a.observable],r.prototype,"slottedSubmenu");const f="menu",$=e=>{if(e.checkedAppearance==="tick-only")return e.checked?"check-line":"";const o=e.controlType==="checkbox"?"checkbox":"radio",i=e.checked?"checked":"unchecked";return`${o}-${i}-2-line`},C=({connotation:e,disabled:o,checked:i,controlType:t,text:n,textSecondary:l,icon:d,metaSlottedContent:y,checkTrailing:_})=>k.classNames("base",[`connotation-${e}`,!!e],["disabled",!!o],["selected",!!(t&&i)],["trailing",!!(t&&(_||d))],["item-checkbox",t==="checkbox"],["item-radio",t==="radio"],["two-lines",!!n?.length&&!!l?.length],["has-meta",!!y?.length]);function S(e){const o=e.tagFor(u.Icon);return a.html`${s.when(i=>!!i.controlType,a.html`<span class="action"><${o} class="icon" name="${i=>$(i)}"></${o}></span>`)}`}function I(){return a.html`${s.when(e=>e.text||e.textSecondary,a.html`<span class="text">
+			${s.when(e=>e.text,a.html`<span class="text-primary">${e=>e.text}</span>`)}
+			${s.when(e=>e.textSecondary,a.html`<span class="text-secondary">${e=>e.textSecondary}</span>`)}
+		</span>`)}`}const M=e=>{const o=h.affixIconTemplateFactory(e),i=e.tagFor(u.Icon);return a.html`
+		<template
+			${b.applyHostSemantics({role:m.menuitem,ariaHasPopup:t=>t.hasSubmenu?"menu":void 0,ariaChecked:t=>t.controlType?t.checked:void 0,ariaDisabled:t=>t.disabled,ariaExpanded:t=>t.expanded})}
+			@keydown="${(t,n)=>t.handleMenuItemKeyDown(n.event)}"
+			@click="${(t,n)=>t.handleMenuItemClick(n.event)}"
+			@mouseover="${(t,n)=>t.handleMouseOver(n.event)}"
+			@mouseout="${(t,n)=>t.handleMouseOut(n.event)}"
+		>
+			<div class="${C}">
+				<slot name="meta" ${v.slotted("metaSlottedContent")}></slot>
+				${S(e)}
+				${s.when(t=>t.icon,a.html`<span class="decorative"
+						>${t=>o(t.icon)}</span
+					>`)}
+				${I()}
+				<slot
+					name="trailing-meta"
+					${v.slotted("trailingMetaSlottedContent")}
+				></slot>
+				${s.when(t=>t.hasSubmenu,a.html`<${i} class="chevron" name="chevron-right-line"></${i}>`)}
+			</div>
+			<slot
+				name="submenu"
+				${v.slotted({property:"slottedSubmenu",filter:v.elements(e.tagForNonDependency(f))})}
+			></slot>
+		</template>
+	`},x=a.defineVividComponent("menu-item",r,M,[u.iconDefinition],{styles:g}),E=a.createRegisterFunction(x);exports.MenuItem=r;exports.MenuItemRole=m;exports.menuItemDefinition=x;exports.menuName=f;exports.registerMenuItem=E;

package/bundled/definition7.js

@@ -0,0 +1,288 @@
+import { I as h, i as x } from "./definition2.js";
+import { V as y, D as _, a as s, o as v, r as k, h as c, c as g, d as $ } from "./vivid-element.js";
+import { h as w, g as C, l as S, f as I } from "./key-codes.js";
+import { b as M, a as E } from "./affix.js";
+import { H as P, a as z } from "./host-semantics.js";
+import { s as m, e as B } from "./slotted.js";
+import { c as D } from "./class-names.js";
+import { w as l } from "./when.js";
+const T = ":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 = {
+  menuitem: "menuitem",
+  menuitemcheckbox: "menuitemcheckbox",
+  menuitemradio: "menuitemradio",
+  presentation: "presentation"
+};
+var O = Object.defineProperty, i = (e, a, r, t) => {
+  for (var o = void 0, d = e.length - 1, p; d >= 0; d--)
+    (p = e[d]) && (o = p(a, r, o) || o);
+  return o && O(a, r, o), o;
+};
+class n extends P(M(y)) {
+  constructor() {
+    super(), this.role = u.menuitem, this.checked = !1, this.handleMenuItemClick = (a) => this._isSyntheticClickEvent(a) ? !0 : (this.invoke(), !!this._isPresentational), this.handleMouseOver = (a) => (this.disabled || !this.submenu || this.expanded || (this.expanded = !0), !1), this.handleMouseOut = (a) => (!this.expanded || this.contains(document.activeElement) || (this.expanded = !1), !1), this.invoke = () => {
+      if (!(this.disabled || this._isPresentational))
+        switch (this.controlType) {
+          case "checkbox":
+            this.checked = !this.checked;
+            break;
+          case "radio":
+            this.checked || (this.checked = !0);
+            break;
+          default:
+            this.submenu ? this.expanded = !0 : this.$emit("change");
+            break;
+        }
+    }, this.checkTrailing = !1, this.handleMenuItemKeyDown = (a) => {
+      if (a.defaultPrevented)
+        return !1;
+      switch (a.key) {
+        case I:
+        case S:
+          return this.invoke(), this.disabled || this.#t(), !1;
+        case C:
+          return this.submenu && (this.expanded = !0, this.#t()), !1;
+        case w:
+          if (this.expanded)
+            return this.#t(), this.expanded = !1, this.focus(), !1;
+      }
+      return !0;
+    }, this.#e = /* @__PURE__ */ new WeakSet(), this.addEventListener("expanded-change", this.#n);
+  }
+  /**
+   * @internal
+   */
+  expandedChanged() {
+    this.$fastController.isConnected && (this.submenu && !this.expanded && this.submenu.collapseExpandedItem(), this.$emit("expanded-change", this, { bubbles: !1 }));
+  }
+  #a() {
+    this._isPresentational ? this.role === "menuitem" && (this.role = "presentation") : this.role === "presentation" && (this.role = u.menuitem);
+  }
+  /**
+   * @internal
+   */
+  _isPresentationalChanged() {
+    this.$fastController.isConnected && this.#a();
+  }
+  /**
+   * @internal
+   */
+  checkedChanged() {
+    this.$fastController.isConnected && this.$emit("change");
+  }
+  /**
+   * @internal
+   */
+  connectedCallback() {
+    super.connectedCallback(), _.queueUpdate(() => {
+      this._isPresentational = this._isPresentational ?? !0, this.#a();
+    });
+  }
+  /**
+   * @internal
+   */
+  slottedSubmenuChanged() {
+    this.submenu && (this.submenu.anchor = this, this.submenu.placement = "right-start", this.submenu.collapseExpandedItem = () => this.#o(), this.submenu._popupOffset = 5);
+  }
+  /**
+   * @internal
+   */
+  get submenu() {
+    return this.slottedSubmenu?.length ? this.slottedSubmenu[0] : null;
+  }
+  /**
+   * @internal
+   */
+  get hasSubmenu() {
+    return this.submenu !== null;
+  }
+  #o() {
+    this.expanded = !1;
+  }
+  #n() {
+    this.submenu && (this.submenu.open = this.expanded);
+  }
+  #e;
+  /**
+   * @internal
+   */
+  _isSyntheticClickEvent(a) {
+    return this.#e.has(a);
+  }
+  #t() {
+    const a = new MouseEvent("click", {
+      bubbles: !0,
+      composed: !0
+    });
+    this.#e.add(a), this.dispatchEvent(a);
+  }
+}
+i([
+  s({ mode: "boolean" })
+], n.prototype, "disabled");
+i([
+  s({ mode: "boolean" })
+], n.prototype, "expanded");
+i([
+  v
+], n.prototype, "_isPresentational");
+i([
+  k({
+    deprecatedPropertyName: "role",
+    fromDeprecated: (e) => {
+      switch (e) {
+        case "menuitemcheckbox":
+          return "checkbox";
+        case "menuitemradio":
+          return "radio";
+        default:
+          return;
+      }
+    },
+    toDeprecated: (e) => {
+      switch (e) {
+        case "checkbox":
+          return "menuitemcheckbox";
+        case "radio":
+          return "menuitemradio";
+        default:
+          return "menuitem";
+      }
+    }
+  }),
+  s({ attribute: "control-type" })
+], n.prototype, "controlType");
+i([
+  s({ mode: "boolean" })
+], n.prototype, "checked");
+i([
+  s
+], n.prototype, "text");
+i([
+  s({ attribute: "text-secondary" })
+], n.prototype, "textSecondary");
+i([
+  s
+], n.prototype, "connotation");
+i([
+  s({ mode: "boolean", attribute: "check-trailing" })
+], n.prototype, "checkTrailing");
+i([
+  s({ attribute: "check-appearance" })
+], n.prototype, "checkedAppearance");
+i([
+  v
+], n.prototype, "metaSlottedContent");
+i([
+  v
+], n.prototype, "trailingMetaSlottedContent");
+i([
+  v
+], n.prototype, "slottedSubmenu");
+const A = "menu", F = (e) => {
+  if (e.checkedAppearance === "tick-only")
+    return e.checked ? "check-line" : "";
+  const a = e.controlType === "checkbox" ? "checkbox" : "radio", r = e.checked ? "checked" : "unchecked";
+  return `${a}-${r}-2-line`;
+}, H = ({
+  connotation: e,
+  disabled: a,
+  checked: r,
+  controlType: t,
+  text: o,
+  textSecondary: d,
+  icon: p,
+  metaSlottedContent: b,
+  checkTrailing: f
+}) => D(
+  "base",
+  [`connotation-${e}`, !!e],
+  ["disabled", !!a],
+  ["selected", !!(t && r)],
+  ["trailing", !!(t && (f || p))],
+  ["item-checkbox", t === "checkbox"],
+  ["item-radio", t === "radio"],
+  ["two-lines", !!o?.length && !!d?.length],
+  ["has-meta", !!b?.length]
+);
+function N(e) {
+  const a = e.tagFor(h);
+  return c`${l(
+    (r) => !!r.controlType,
+    c`<span class="action"><${a} class="icon" name="${(r) => F(r)}"></${a}></span>`
+  )}`;
+}
+function R() {
+  return c`${l(
+    (e) => e.text || e.textSecondary,
+    c`<span class="text">
+			${l(
+      (e) => e.text,
+      c`<span class="text-primary">${(e) => e.text}</span>`
+    )}
+			${l(
+      (e) => e.textSecondary,
+      c`<span class="text-secondary">${(e) => e.textSecondary}</span>`
+    )}
+		</span>`
+  )}`;
+}
+const V = (e) => {
+  const a = E(e), r = e.tagFor(h);
+  return c`
+		<template
+			${z({
+    role: u.menuitem,
+    ariaHasPopup: (t) => t.hasSubmenu ? "menu" : void 0,
+    ariaChecked: (t) => t.controlType ? t.checked : void 0,
+    ariaDisabled: (t) => t.disabled,
+    ariaExpanded: (t) => t.expanded
+  })}
+			@keydown="${(t, o) => t.handleMenuItemKeyDown(o.event)}"
+			@click="${(t, o) => t.handleMenuItemClick(o.event)}"
+			@mouseover="${(t, o) => t.handleMouseOver(o.event)}"
+			@mouseout="${(t, o) => t.handleMouseOut(o.event)}"
+		>
+			<div class="${H}">
+				<slot name="meta" ${m("metaSlottedContent")}></slot>
+				${N(e)}
+				${l(
+    (t) => t.icon,
+    c`<span class="decorative"
+						>${(t) => a(t.icon)}</span
+					>`
+  )}
+				${R()}
+				<slot
+					name="trailing-meta"
+					${m("trailingMetaSlottedContent")}
+				></slot>
+				${l(
+    (t) => t.hasSubmenu,
+    c`<${r} class="chevron" name="chevron-right-line"></${r}>`
+  )}
+			</div>
+			<slot
+				name="submenu"
+				${m({
+    property: "slottedSubmenu",
+    filter: B(e.tagForNonDependency(A))
+  })}
+			></slot>
+		</template>
+	`;
+}, K = $(
+  "menu-item",
+  n,
+  V,
+  [x],
+  {
+    styles: T
+  }
+), X = g(K);
+export {
+  n as M,
+  u as a,
+  A as b,
+  K as m,
+  X as r
+};

package/bundled/definition8.cjs

@@ -0,0 +1,19 @@
+"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"),_=require("./class-names.cjs"),d=require("./when.cjs"),g=require("./slotted.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(){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})=>_.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}"
+			${h.delegateAria({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.tabindex:e.disabled?null:0}"
+			@keypress="${(e,c)=>e.keypressHandler(c.event)}"
+			@click="${(e,c)=>e.clickHandler(c.event)}"
+		>
+			<div class="control">
+				${d.when(e=>e.checked&&!e.indeterminate,o.html`<${a} name="check-solid" class="icon"></${a}>`)}
+				${d.when(e=>e.indeterminate,o.html`<${a} name="minus-solid" class="icon"></${a}>`)}
+			</div>
+			${o.html`<label
+				>${e=>e.label}<slot ${g.slotted("slottedContent")}></slot
+			></label>`}
+		</div>
+		${e=>e._getFeedbackTemplate(r)}
+	</template>`},b=o.defineVividComponent("checkbox",n,z,[v.iconDefinition,p.feedbackMessageDefinition],{styles:C,shadowOptions:{delegatesFocus:!0}}),E=o.createRegisterFunction(b);exports.Checkbox=n;exports.checkboxDefinition=b;exports.registerCheckbox=E;

package/bundled/definition8.js

@@ -0,0 +1,145 @@
+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 { 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";
+import { W as z } from "./with-success-text.js";
+import { F as O } from "./form-element.js";
+import { c as F } from "./class-names.js";
+import { w as v } from "./when.js";
+import { s as T } from "./slotted.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}';
+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);
+  return r && D(a, e, r), r;
+};
+const E = " ";
+class t extends g(
+  k(
+    $(
+      z(O(w(f)))
+    )
+  )
+) {
+  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 E:
+            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");
+  }
+  // Map to proxy element
+  /**
+   * @internal
+   */
+  readOnlyChanged() {
+    this.proxy instanceof HTMLInputElement && (this.proxy.readOnly = this.readOnly);
+  }
+  /**
+   * @internal
+   */
+  ariaCheckedChanged(a, e) {
+    super.ariaCheckedChanged(a, e), this.ariaChecked === "mixed" ? this.indeterminate = !0 : (this.indeterminate = !1, this.checked = this.ariaChecked === "true");
+  }
+  /**
+   * @internal
+   */
+  checkedChanged(a, e) {
+    super.checkedChanged(a, e), this.ariaChecked = e == !0 ? "true" : "false", a !== void 0 && this.$emit("input");
+  }
+}
+c([
+  d({ attribute: "tabindex" })
+], t.prototype, "tabindex");
+c([
+  d
+], t.prototype, "connotation");
+c([
+  d({ attribute: "readonly", mode: "boolean" })
+], t.prototype, "readOnly");
+c([
+  p
+], t.prototype, "defaultSlottedNodes");
+c([
+  d({ attribute: "indeterminate", mode: "boolean" })
+], t.prototype, "indeterminate");
+c([
+  p
+], t.prototype, "slottedContent");
+const H = ({
+  connotation: o,
+  readOnly: a,
+  checked: e,
+  disabled: n,
+  indeterminate: r,
+  errorValidationMessage: i,
+  successText: l,
+  label: b,
+  slottedContent: h
+}) => F(
+  "base",
+  [`connotation-${o}`, !!o],
+  ["readonly", !!a],
+  ["checked", !!e || !!r],
+  ["disabled", !!n],
+  ["error connotation-alert", !!i],
+  ["success connotation-success", !!l],
+  ["hide-label", !b && !h?.length]
+), A = (o) => {
+  const a = o.tagFor(m);
+  return s`<template>
+		<div
+			class="${H}"
+			aria-describedby="${(e) => e._feedbackDescribedBy}"
+			${C({
+    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.tabindex : e.disabled ? null : 0}"
+			@keypress="${(e, n) => e.keypressHandler(n.event)}"
+			@click="${(e, n) => e.clickHandler(n.event)}"
+		>
+			<div class="control">
+				${v(
+    (e) => e.checked && !e.indeterminate,
+    s`<${a} name="check-solid" class="icon"></${a}>`
+  )}
+				${v(
+    (e) => e.indeterminate,
+    s`<${a} name="minus-solid" class="icon"></${a}>`
+  )}
+			</div>
+			${s`<label
+				>${(e) => e.label}<slot ${T("slottedContent")}></slot
+			></label>`}
+		</div>
+		${(e) => e._getFeedbackTemplate(o)}
+	</template>`;
+}, W = y(
+  "checkbox",
+  t,
+  A,
+  [u, _],
+  {
+    styles: B,
+    shadowOptions: {
+      delegatesFocus: !0
+    }
+  }
+), J = x(W);
+export {
+  t as C,
+  W as c,
+  J as r
+};

package/bundled/definition9.cjs

@@ -0,0 +1,14 @@
+"use strict";const Vt=require("./definition3.cjs"),Ht=require("./definition4.cjs"),S=require("./vivid-element.cjs"),ht=require("./ref.cjs"),Jt=require("./class-names.cjs"),Pt=require("./when.cjs"),Mt=["top","right","bottom","left"],At=["start","end"],Et=Mt.reduce((t,e)=>t.concat(e,e+"-"+At[0],e+"-"+At[1]),[]),N=Math.min,C=Math.max,ct=Math.round,lt=Math.floor,Y=t=>({x:t,y:t}),Qt={left:"right",right:"left",bottom:"top",top:"bottom"},Zt={start:"end",end:"start"};function te(t,e,n){return C(t,N(e,n))}function J(t,e){return typeof t=="function"?t(e):t}function _(t){return t.split("-")[0]}function M(t){return t.split("-")[1]}function ee(t){return t==="x"?"y":"x"}function wt(t){return t==="y"?"height":"width"}const ne=new Set(["top","bottom"]);function X(t){return ne.has(_(t))?"y":"x"}function vt(t){return ee(X(t))}function Nt(t,e,n){n===void 0&&(n=!1);const o=M(t),i=vt(t),r=wt(i);let s=i==="x"?o===(n?"end":"start")?"right":"left":o==="start"?"bottom":"top";return e.reference[r]>e.floating[r]&&(s=ft(s)),[s,ft(s)]}function oe(t){const e=ft(t);return[at(t),e,at(e)]}function at(t){return t.replace(/start|end/g,e=>Zt[e])}const Ct=["left","right"],St=["right","left"],ie=["top","bottom"],re=["bottom","top"];function se(t,e,n){switch(t){case"top":case"bottom":return n?e?St:Ct:e?Ct:St;case"left":case"right":return e?ie:re;default:return[]}}function le(t,e,n,o){const i=M(t);let r=se(_(t),n==="start",o);return i&&(r=r.map(s=>s+"-"+i),e&&(r=r.concat(r.map(at)))),r}function ft(t){return t.replace(/left|right|bottom|top/g,e=>Qt[e])}function ce(t){return{top:0,right:0,bottom:0,left:0,...t}}function yt(t){return typeof t!="number"?ce(t):{top:t,right:t,bottom:t,left:t}}function tt(t){const{x:e,y:n,width:o,height:i}=t;return{width:o,height:i,top:n,left:e,right:e+o,bottom:n+i,x:e,y:n}}function Tt(t,e,n){let{reference:o,floating:i}=t;const r=X(e),s=vt(e),l=wt(s),c=_(e),a=r==="y",p=o.x+o.width/2-i.width/2,f=o.y+o.height/2-i.height/2,d=o[l]/2-i[l]/2;let u;switch(c){case"top":u={x:p,y:o.y-i.height};break;case"bottom":u={x:p,y:o.y+o.height};break;case"right":u={x:o.x+o.width,y:f};break;case"left":u={x:o.x-i.width,y:f};break;default:u={x:o.x,y:o.y}}switch(M(e)){case"start":u[s]-=d*(n&&a?-1:1);break;case"end":u[s]+=d*(n&&a?-1:1);break}return u}const ae=async(t,e,n)=>{const{placement:o="bottom",strategy:i="absolute",middleware:r=[],platform:s}=n,l=r.filter(Boolean),c=await(s.isRTL==null?void 0:s.isRTL(e));let a=await s.getElementRects({reference:t,floating:e,strategy:i}),{x:p,y:f}=Tt(a,o,c),d=o,u={},m=0;for(let h=0;h<l.length;h++){const{name:g,fn:w}=l[h],{x:y,y:x,data:R,reset:b}=await w({x:p,y:f,initialPlacement:o,placement:d,strategy:i,middlewareData:u,rects:a,platform:s,elements:{reference:t,floating:e}});p=y??p,f=x??f,u={...u,[g]:{...u[g],...R}},b&&m<=50&&(m++,typeof b=="object"&&(b.placement&&(d=b.placement),b.rects&&(a=b.rects===!0?await s.getElementRects({reference:t,floating:e,strategy:i}):b.rects),{x:p,y:f}=Tt(a,d,c)),h=-1)}return{x:p,y:f,placement:d,strategy:i,middlewareData:u}};async function it(t,e){var n;e===void 0&&(e={});const{x:o,y:i,platform:r,rects:s,elements:l,strategy:c}=t,{boundary:a="clippingAncestors",rootBoundary:p="viewport",elementContext:f="floating",altBoundary:d=!1,padding:u=0}=J(e,t),m=yt(u),g=l[d?f==="floating"?"reference":"floating":f],w=tt(await r.getClippingRect({element:(n=await(r.isElement==null?void 0:r.isElement(g)))==null||n?g:g.contextElement||await(r.getDocumentElement==null?void 0:r.getDocumentElement(l.floating)),boundary:a,rootBoundary:p,strategy:c})),y=f==="floating"?{x:o,y:i,width:s.floating.width,height:s.floating.height}:s.reference,x=await(r.getOffsetParent==null?void 0:r.getOffsetParent(l.floating)),R=await(r.isElement==null?void 0:r.isElement(x))?await(r.getScale==null?void 0:r.getScale(x))||{x:1,y:1}:{x:1,y:1},b=tt(r.convertOffsetParentRelativeRectToViewportRelativeRect?await r.convertOffsetParentRelativeRectToViewportRelativeRect({elements:l,rect:y,offsetParent:x,strategy:c}):y);return{top:(w.top-b.top+m.top)/R.y,bottom:(b.bottom-w.bottom+m.bottom)/R.y,left:(w.left-b.left+m.left)/R.x,right:(b.right-w.right+m.right)/R.x}}const fe=t=>({name:"arrow",options:t,async fn(e){const{x:n,y:o,placement:i,rects:r,platform:s,elements:l,middlewareData:c}=e,{element:a,padding:p=0}=J(t,e)||{};if(a==null)return{};const f=yt(p),d={x:n,y:o},u=vt(i),m=wt(u),h=await s.getDimensions(a),g=u==="y",w=g?"top":"left",y=g?"bottom":"right",x=g?"clientHeight":"clientWidth",R=r.reference[m]+r.reference[u]-d[u]-r.floating[m],b=d[u]-r.reference[u],P=await(s.getOffsetParent==null?void 0:s.getOffsetParent(a));let O=P?P[x]:0;(!O||!await(s.isElement==null?void 0:s.isElement(P)))&&(O=l.floating[x]||r.floating[m]);const B=R/2-b/2,T=O/2-h[m]/2-1,v=N(f[w],T),A=N(f[y],T),L=v,D=O-h[m]-A,E=O/2-h[m]/2+B,H=te(L,E,D),V=!c.arrow&&M(i)!=null&&E!==H&&r.reference[m]/2-(E<L?v:A)-h[m]/2<0,k=V?E<L?E-L:E-D:0;return{[u]:d[u]+k,data:{[u]:H,centerOffset:E-H-k,...V&&{alignmentOffset:k}},reset:V}}});function ue(t,e,n){return(t?[...n.filter(i=>M(i)===t),...n.filter(i=>M(i)!==t)]:n.filter(i=>_(i)===i)).filter(i=>t?M(i)===t||(e?at(i)!==i:!1):!0)}const pe=function(t){return t===void 0&&(t={}),{name:"autoPlacement",options:t,async fn(e){var n,o,i;const{rects:r,middlewareData:s,placement:l,platform:c,elements:a}=e,{crossAxis:p=!1,alignment:f,allowedPlacements:d=Et,autoAlignment:u=!0,...m}=J(t,e),h=f!==void 0||d===Et?ue(f||null,u,d):d,g=await it(e,m),w=((n=s.autoPlacement)==null?void 0:n.index)||0,y=h[w];if(y==null)return{};const x=Nt(y,r,await(c.isRTL==null?void 0:c.isRTL(a.floating)));if(l!==y)return{reset:{placement:h[0]}};const R=[g[_(y)],g[x[0]],g[x[1]]],b=[...((o=s.autoPlacement)==null?void 0:o.overflows)||[],{placement:y,overflows:R}],P=h[w+1];if(P)return{data:{index:w+1,overflows:b},reset:{placement:P}};const O=b.map(v=>{const A=M(v.placement);return[v.placement,A&&p?v.overflows.slice(0,2).reduce((L,D)=>L+D,0):v.overflows[0],v.overflows]}).sort((v,A)=>v[1]-A[1]),T=((i=O.filter(v=>v[2].slice(0,M(v[0])?2:3).every(A=>A<=0))[0])==null?void 0:i[0])||O[0][0];return T!==l?{data:{index:w+1,overflows:b},reset:{placement:T}}:{}}}},de=function(t){return t===void 0&&(t={}),{name:"flip",options:t,async fn(e){var n,o;const{placement:i,middlewareData:r,rects:s,initialPlacement:l,platform:c,elements:a}=e,{mainAxis:p=!0,crossAxis:f=!0,fallbackPlacements:d,fallbackStrategy:u="bestFit",fallbackAxisSideDirection:m="none",flipAlignment:h=!0,...g}=J(t,e);if((n=r.arrow)!=null&&n.alignmentOffset)return{};const w=_(i),y=X(l),x=_(l)===l,R=await(c.isRTL==null?void 0:c.isRTL(a.floating)),b=d||(x||!h?[ft(l)]:oe(l)),P=m!=="none";!d&&P&&b.push(...le(l,h,m,R));const O=[l,...b],B=await it(e,g),T=[];let v=((o=r.flip)==null?void 0:o.overflows)||[];if(p&&T.push(B[w]),f){const E=Nt(i,s,R);T.push(B[E[0]],B[E[1]])}if(v=[...v,{placement:i,overflows:T}],!T.every(E=>E<=0)){var A,L;const E=(((A=r.flip)==null?void 0:A.index)||0)+1,H=O[E];if(H&&(!(f==="alignment"?y!==X(H):!1)||v.every($=>X($.placement)===y?$.overflows[0]>0:!0)))return{data:{index:E,overflows:v},reset:{placement:H}};let V=(L=v.filter(k=>k.overflows[0]<=0).sort((k,$)=>k.overflows[1]-$.overflows[1])[0])==null?void 0:L.placement;if(!V)switch(u){case"bestFit":{var D;const k=(D=v.filter($=>{if(P){const K=X($.placement);return K===y||K==="y"}return!0}).map($=>[$.placement,$.overflows.filter(K=>K>0).reduce((K,Gt)=>K+Gt,0)]).sort(($,K)=>$[1]-K[1])[0])==null?void 0:D[0];k&&(V=k);break}case"initialPlacement":V=l;break}if(i!==V)return{reset:{placement:V}}}return{}}}};function Lt(t,e){return{top:t.top-e.height,right:t.right-e.width,bottom:t.bottom-e.height,left:t.left-e.width}}function Dt(t){return Mt.some(e=>t[e]>=0)}const he=function(t){return t===void 0&&(t={}),{name:"hide",options:t,async fn(e){const{rects:n}=e,{strategy:o="referenceHidden",...i}=J(t,e);switch(o){case"referenceHidden":{const r=await it(e,{...i,elementContext:"reference"}),s=Lt(r,n.reference);return{data:{referenceHiddenOffsets:s,referenceHidden:Dt(s)}}}case"escaped":{const r=await it(e,{...i,altBoundary:!0}),s=Lt(r,n.floating);return{data:{escapedOffsets:s,escaped:Dt(s)}}}default:return{}}}}};function _t(t){const e=N(...t.map(r=>r.left)),n=N(...t.map(r=>r.top)),o=C(...t.map(r=>r.right)),i=C(...t.map(r=>r.bottom));return{x:e,y:n,width:o-e,height:i-n}}function me(t){const e=t.slice().sort((i,r)=>i.y-r.y),n=[];let o=null;for(let i=0;i<e.length;i++){const r=e[i];!o||r.y-o.y>o.height/2?n.push([r]):n[n.length-1].push(r),o=r}return n.map(i=>tt(_t(i)))}const ge=function(t){return t===void 0&&(t={}),{name:"inline",options:t,async fn(e){const{placement:n,elements:o,rects:i,platform:r,strategy:s}=e,{padding:l=2,x:c,y:a}=J(t,e),p=Array.from(await(r.getClientRects==null?void 0:r.getClientRects(o.reference))||[]),f=me(p),d=tt(_t(p)),u=yt(l);function m(){if(f.length===2&&f[0].left>f[1].right&&c!=null&&a!=null)return f.find(g=>c>g.left-u.left&&c<g.right+u.right&&a>g.top-u.top&&a<g.bottom+u.bottom)||d;if(f.length>=2){if(X(n)==="y"){const v=f[0],A=f[f.length-1],L=_(n)==="top",D=v.top,E=A.bottom,H=L?v.left:A.left,V=L?v.right:A.right,k=V-H,$=E-D;return{top:D,bottom:E,left:H,right:V,width:k,height:$,x:H,y:D}}const g=_(n)==="left",w=C(...f.map(v=>v.right)),y=N(...f.map(v=>v.left)),x=f.filter(v=>g?v.left===y:v.right===w),R=x[0].top,b=x[x.length-1].bottom,P=y,O=w,B=O-P,T=b-R;return{top:R,bottom:b,left:P,right:O,width:B,height:T,x:P,y:R}}return d}const h=await r.getElementRects({reference:{getBoundingClientRect:m},floating:o.floating,strategy:s});return i.reference.x!==h.reference.x||i.reference.y!==h.reference.y||i.reference.width!==h.reference.width||i.reference.height!==h.reference.height?{reset:{rects:h}}:{}}}},we=new Set(["left","top"]);async function ve(t,e){const{placement:n,platform:o,elements:i}=t,r=await(o.isRTL==null?void 0:o.isRTL(i.floating)),s=_(n),l=M(n),c=X(n)==="y",a=we.has(s)?-1:1,p=r&&c?-1:1,f=J(e,t);let{mainAxis:d,crossAxis:u,alignmentAxis:m}=typeof f=="number"?{mainAxis:f,crossAxis:0,alignmentAxis:null}:{mainAxis:f.mainAxis||0,crossAxis:f.crossAxis||0,alignmentAxis:f.alignmentAxis};return l&&typeof m=="number"&&(u=l==="end"?m*-1:m),c?{x:u*p,y:d*a}:{x:d*a,y:u*p}}const ye=function(t){return t===void 0&&(t=0),{name:"offset",options:t,async fn(e){var n,o;const{x:i,y:r,placement:s,middlewareData:l}=e,c=await ve(e,t);return s===((n=l.offset)==null?void 0:n.placement)&&(o=l.arrow)!=null&&o.alignmentOffset?{}:{x:i+c.x,y:r+c.y,data:{...c,placement:s}}}}},xe=function(t){return t===void 0&&(t={}),{name:"size",options:t,async fn(e){var n,o;const{placement:i,rects:r,platform:s,elements:l}=e,{apply:c=()=>{},...a}=J(t,e),p=await it(e,a),f=_(i),d=M(i),u=X(i)==="y",{width:m,height:h}=r.floating;let g,w;f==="top"||f==="bottom"?(g=f,w=d===(await(s.isRTL==null?void 0:s.isRTL(l.floating))?"start":"end")?"left":"right"):(w=f,g=d==="end"?"top":"bottom");const y=h-p.top-p.bottom,x=m-p.left-p.right,R=N(h-p[g],y),b=N(m-p[w],x),P=!e.middlewareData.shift;let O=R,B=b;if((n=e.middlewareData.shift)!=null&&n.enabled.x&&(B=x),(o=e.middlewareData.shift)!=null&&o.enabled.y&&(O=y),P&&!d){const v=C(p.left,0),A=C(p.right,0),L=C(p.top,0),D=C(p.bottom,0);u?B=m-2*(v!==0||A!==0?v+A:C(p.left,p.right)):O=h-2*(L!==0||D!==0?L+D:C(p.top,p.bottom))}await c({...e,availableWidth:B,availableHeight:O});const T=await s.getDimensions(l.floating);return m!==T.width||h!==T.height?{reset:{rects:!0}}:{}}}};function ut(){return typeof window<"u"}function nt(t){return Wt(t)?(t.nodeName||"").toLowerCase():"#document"}function F(t){var e;return(t==null||(e=t.ownerDocument)==null?void 0:e.defaultView)||window}function I(t){var e;return(e=(Wt(t)?t.ownerDocument:t.document)||window.document)==null?void 0:e.documentElement}function Wt(t){return ut()?t instanceof Node||t instanceof F(t).Node:!1}function W(t){return ut()?t instanceof Element||t instanceof F(t).Element:!1}function q(t){return ut()?t instanceof HTMLElement||t instanceof F(t).HTMLElement:!1}function kt(t){return!ut()||typeof ShadowRoot>"u"?!1:t instanceof ShadowRoot||t instanceof F(t).ShadowRoot}const be=new Set(["inline","contents"]);function st(t){const{overflow:e,overflowX:n,overflowY:o,display:i}=z(t);return/auto|scroll|overlay|hidden|clip/.test(e+o+n)&&!be.has(i)}const Re=new Set(["table","td","th"]);function Oe(t){return Re.has(nt(t))}const Pe=[":popover-open",":modal"];function pt(t){return Pe.some(e=>{try{return t.matches(e)}catch{return!1}})}const Ae=["transform","translate","scale","rotate","perspective"],Ee=["transform","translate","scale","rotate","perspective","filter"],Ce=["paint","layout","strict","content"];function xt(t){const e=bt(),n=W(t)?z(t):t;return Ae.some(o=>n[o]?n[o]!=="none":!1)||(n.containerType?n.containerType!=="normal":!1)||!e&&(n.backdropFilter?n.backdropFilter!=="none":!1)||!e&&(n.filter?n.filter!=="none":!1)||Ee.some(o=>(n.willChange||"").includes(o))||Ce.some(o=>(n.contain||"").includes(o))}function Se(t){let e=G(t);for(;q(e)&&!et(e);){if(xt(e))return e;if(pt(e))return null;e=G(e)}return null}function bt(){return typeof CSS>"u"||!CSS.supports?!1:CSS.supports("-webkit-backdrop-filter","none")}const Te=new Set(["html","body","#document"]);function et(t){return Te.has(nt(t))}function z(t){return F(t).getComputedStyle(t)}function dt(t){return W(t)?{scrollLeft:t.scrollLeft,scrollTop:t.scrollTop}:{scrollLeft:t.scrollX,scrollTop:t.scrollY}}function G(t){if(nt(t)==="html")return t;const e=t.assignedSlot||t.parentNode||kt(t)&&t.host||I(t);return kt(e)?e.host:e}function zt(t){const e=G(t);return et(e)?t.ownerDocument?t.ownerDocument.body:t.body:q(e)&&st(e)?e:zt(e)}function rt(t,e,n){var o;e===void 0&&(e=[]),n===void 0&&(n=!0);const i=zt(t),r=i===((o=t.ownerDocument)==null?void 0:o.body),s=F(i);if(r){const l=gt(s);return e.concat(s,s.visualViewport||[],st(i)?i:[],l&&n?rt(l):[])}return e.concat(i,rt(i,[],n))}function gt(t){return t.parent&&Object.getPrototypeOf(t.parent)?t.frameElement:null}function jt(t){const e=z(t);let n=parseFloat(e.width)||0,o=parseFloat(e.height)||0;const i=q(t),r=i?t.offsetWidth:n,s=i?t.offsetHeight:o,l=ct(n)!==r||ct(o)!==s;return l&&(n=r,o=s),{width:n,height:o,$:l}}function Rt(t){return W(t)?t:t.contextElement}function Z(t){const e=Rt(t);if(!q(e))return Y(1);const n=e.getBoundingClientRect(),{width:o,height:i,$:r}=jt(e);let s=(r?ct(n.width):n.width)/o,l=(r?ct(n.height):n.height)/i;return(!s||!Number.isFinite(s))&&(s=1),(!l||!Number.isFinite(l))&&(l=1),{x:s,y:l}}const Le=Y(0);function Yt(t){const e=F(t);return!bt()||!e.visualViewport?Le:{x:e.visualViewport.offsetLeft,y:e.visualViewport.offsetTop}}function De(t,e,n){return e===void 0&&(e=!1),!n||e&&n!==F(t)?!1:e}function Q(t,e,n,o){e===void 0&&(e=!1),n===void 0&&(n=!1);const i=t.getBoundingClientRect(),r=Rt(t);let s=Y(1);e&&(o?W(o)&&(s=Z(o)):s=Z(t));const l=De(r,n,o)?Yt(r):Y(0);let c=(i.left+l.x)/s.x,a=(i.top+l.y)/s.y,p=i.width/s.x,f=i.height/s.y;if(r){const d=F(r),u=o&&W(o)?F(o):o;let m=d,h=gt(m);for(;h&&o&&u!==m;){const g=Z(h),w=h.getBoundingClientRect(),y=z(h),x=w.left+(h.clientLeft+parseFloat(y.paddingLeft))*g.x,R=w.top+(h.clientTop+parseFloat(y.paddingTop))*g.y;c*=g.x,a*=g.y,p*=g.x,f*=g.y,c+=x,a+=R,m=F(h),h=gt(m)}}return tt({width:p,height:f,x:c,y:a})}function Ot(t,e){const n=dt(t).scrollLeft;return e?e.left+n:Q(I(t)).left+n}function qt(t,e,n){n===void 0&&(n=!1);const o=t.getBoundingClientRect(),i=o.left+e.scrollLeft-(n?0:Ot(t,o)),r=o.top+e.scrollTop;return{x:i,y:r}}function ke(t){let{elements:e,rect:n,offsetParent:o,strategy:i}=t;const r=i==="fixed",s=I(o),l=e?pt(e.floating):!1;if(o===s||l&&r)return n;let c={scrollLeft:0,scrollTop:0},a=Y(1);const p=Y(0),f=q(o);if((f||!f&&!r)&&((nt(o)!=="body"||st(s))&&(c=dt(o)),q(o))){const u=Q(o);a=Z(o),p.x=u.x+o.clientLeft,p.y=u.y+o.clientTop}const d=s&&!f&&!r?qt(s,c,!0):Y(0);return{width:n.width*a.x,height:n.height*a.y,x:n.x*a.x-c.scrollLeft*a.x+p.x+d.x,y:n.y*a.y-c.scrollTop*a.y+p.y+d.y}}function $e(t){return Array.from(t.getClientRects())}function Fe(t){const e=I(t),n=dt(t),o=t.ownerDocument.body,i=C(e.scrollWidth,e.clientWidth,o.scrollWidth,o.clientWidth),r=C(e.scrollHeight,e.clientHeight,o.scrollHeight,o.clientHeight);let s=-n.scrollLeft+Ot(t);const l=-n.scrollTop;return z(o).direction==="rtl"&&(s+=C(e.clientWidth,o.clientWidth)-i),{width:i,height:r,x:s,y:l}}function Be(t,e){const n=F(t),o=I(t),i=n.visualViewport;let r=o.clientWidth,s=o.clientHeight,l=0,c=0;if(i){r=i.width,s=i.height;const a=bt();(!a||a&&e==="fixed")&&(l=i.offsetLeft,c=i.offsetTop)}return{width:r,height:s,x:l,y:c}}const Ve=new Set(["absolute","fixed"]);function He(t,e){const n=Q(t,!0,e==="fixed"),o=n.top+t.clientTop,i=n.left+t.clientLeft,r=q(t)?Z(t):Y(1),s=t.clientWidth*r.x,l=t.clientHeight*r.y,c=i*r.x,a=o*r.y;return{width:s,height:l,x:c,y:a}}function $t(t,e,n){let o;if(e==="viewport")o=Be(t,n);else if(e==="document")o=Fe(I(t));else if(W(e))o=He(e,n);else{const i=Yt(t);o={x:e.x-i.x,y:e.y-i.y,width:e.width,height:e.height}}return tt(o)}function It(t,e){const n=G(t);return n===e||!W(n)||et(n)?!1:z(n).position==="fixed"||It(n,e)}function Me(t,e){const n=e.get(t);if(n)return n;let o=rt(t,[],!1).filter(l=>W(l)&&nt(l)!=="body"),i=null;const r=z(t).position==="fixed";let s=r?G(t):t;for(;W(s)&&!et(s);){const l=z(s),c=xt(s);!c&&l.position==="fixed"&&(i=null),(r?!c&&!i:!c&&l.position==="static"&&!!i&&Ve.has(i.position)||st(s)&&!c&&It(t,s))?o=o.filter(p=>p!==s):i=l,s=G(s)}return e.set(t,o),o}function Ne(t){let{element:e,boundary:n,rootBoundary:o,strategy:i}=t;const s=[...n==="clippingAncestors"?pt(e)?[]:Me(e,this._c):[].concat(n),o],l=s[0],c=s.reduce((a,p)=>{const f=$t(e,p,i);return a.top=C(f.top,a.top),a.right=N(f.right,a.right),a.bottom=N(f.bottom,a.bottom),a.left=C(f.left,a.left),a},$t(e,l,i));return{width:c.right-c.left,height:c.bottom-c.top,x:c.left,y:c.top}}function _e(t){const{width:e,height:n}=jt(t);return{width:e,height:n}}function We(t,e,n){const o=q(e),i=I(e),r=n==="fixed",s=Q(t,!0,r,e);let l={scrollLeft:0,scrollTop:0};const c=Y(0);function a(){c.x=Ot(i)}if(o||!o&&!r)if((nt(e)!=="body"||st(i))&&(l=dt(e)),o){const u=Q(e,!0,r,e);c.x=u.x+e.clientLeft,c.y=u.y+e.clientTop}else i&&a();r&&!o&&i&&a();const p=i&&!o&&!r?qt(i,l):Y(0),f=s.left+l.scrollLeft-c.x-p.x,d=s.top+l.scrollTop-c.y-p.y;return{x:f,y:d,width:s.width,height:s.height}}function mt(t){return z(t).position==="static"}function Ft(t,e){if(!q(t)||z(t).position==="fixed")return null;if(e)return e(t);let n=t.offsetParent;return I(t)===n&&(n=n.ownerDocument.body),n}function Xt(t,e){const n=F(t);if(pt(t))return n;if(!q(t)){let i=G(t);for(;i&&!et(i);){if(W(i)&&!mt(i))return i;i=G(i)}return n}let o=Ft(t,e);for(;o&&Oe(o)&&mt(o);)o=Ft(o,e);return o&&et(o)&&mt(o)&&!xt(o)?n:o||Se(t)||n}const ze=async function(t){const e=this.getOffsetParent||Xt,n=this.getDimensions,o=await n(t.floating);return{reference:We(t.reference,await e(t.floating),t.strategy),floating:{x:0,y:0,width:o.width,height:o.height}}};function je(t){return z(t).direction==="rtl"}const Ye={convertOffsetParentRelativeRectToViewportRelativeRect:ke,getDocumentElement:I,getClippingRect:Ne,getOffsetParent:Xt,getElementRects:ze,getClientRects:$e,getDimensions:_e,getScale:Z,isElement:W,isRTL:je};function Ut(t,e){return t.x===e.x&&t.y===e.y&&t.width===e.width&&t.height===e.height}function qe(t,e){let n=null,o;const i=I(t);function r(){var l;clearTimeout(o),(l=n)==null||l.disconnect(),n=null}function s(l,c){l===void 0&&(l=!1),c===void 0&&(c=1),r();const a=t.getBoundingClientRect(),{left:p,top:f,width:d,height:u}=a;if(l||e(),!d||!u)return;const m=lt(f),h=lt(i.clientWidth-(p+d)),g=lt(i.clientHeight-(f+u)),w=lt(p),x={rootMargin:-m+"px "+-h+"px "+-g+"px "+-w+"px",threshold:C(0,N(1,c))||1};let R=!0;function b(P){const O=P[0].intersectionRatio;if(O!==c){if(!R)return s();O?s(!1,O):o=setTimeout(()=>{s(!1,1e-7)},1e3)}O===1&&!Ut(a,t.getBoundingClientRect())&&s(),R=!1}try{n=new IntersectionObserver(b,{...x,root:i.ownerDocument})}catch{n=new IntersectionObserver(b,x)}n.observe(t)}return s(!0),r}function Ie(t,e,n,o){o===void 0&&(o={});const{ancestorScroll:i=!0,ancestorResize:r=!0,elementResize:s=typeof ResizeObserver=="function",layoutShift:l=typeof IntersectionObserver=="function",animationFrame:c=!1}=o,a=Rt(t),p=i||r?[...a?rt(a):[],...rt(e)]:[];p.forEach(w=>{i&&w.addEventListener("scroll",n,{passive:!0}),r&&w.addEventListener("resize",n)});const f=a&&l?qe(a,n):null;let d=-1,u=null;s&&(u=new ResizeObserver(w=>{let[y]=w;y&&y.target===a&&u&&(u.unobserve(e),cancelAnimationFrame(d),d=requestAnimationFrame(()=>{var x;(x=u)==null||x.observe(e)})),n()}),a&&!c&&u.observe(a),u.observe(e));let m,h=c?Q(t):null;c&&g();function g(){const w=Q(t);h&&!Ut(h,w)&&n(),h=w,m=requestAnimationFrame(g)}return n(),()=>{var w;p.forEach(y=>{i&&y.removeEventListener("scroll",n),r&&y.removeEventListener("resize",n)}),f?.(),(w=u)==null||w.disconnect(),u=null,c&&cancelAnimationFrame(m)}}const Xe=ye,Bt=pe,Ue=de,Ke=xe,Ge=he,Je=fe,Qe=ge,Ze=(t,e,n)=>{const o=new Map,i={platform:Ye,...n},r={...i.platform,_c:o};return ae(t,e,{...i,platform:r})};var tn=Object.defineProperty,U=(t,e,n,o)=>{for(var i=void 0,r=t.length-1,s;r>=0;r--)(s=t[r])&&(i=s(e,n,i)||i);return i&&tn(e,n,i),i};const ot={Flip:"flip",AutoPlacementHorizontal:"auto-placement-horizontal",AutoPlacementVertical:"auto-placement-vertical"},en={[ot.Flip]:Ue(),[ot.AutoPlacementHorizontal]:Bt({allowedPlacements:["bottom","top","bottom-start","bottom-end","top-start","top-end"]}),[ot.AutoPlacementVertical]:Bt({allowedPlacements:["left","right","left-start","left-end","right-start","right-end"]})};class j extends S.VividElement{constructor(){super(...arguments),this.open=!1,this.dismissible=!1,this.arrow=!1,this.alternate=!1,this.placementStrategy=ot.Flip,this.animationFrame=!1,this.strategy="fixed",this.offset=null,this.#i=()=>(this.#n=this.updatePosition(),this.#n)}get#r(){let e=[Qe(),en[this.placementStrategy],Ge(),Ke({apply({availableWidth:o,availableHeight:i,elements:r}){Object.assign(r.floating.style,{maxWidth:`${o}px`,maxHeight:`${i}px`})}})],n=this.offset??0;return this.arrow&&(n+=12,e=[...e,Je({element:this.arrowEl,padding:10})]),n>0&&e.unshift(Xe(n)),e}#o;openChanged(e,n){this.#e(),this.#t(),this.$emit(n?"vwc-popup:open":"vwc-popup:close")}animationFrameChanged(){this.#t()}anchorChanged(){this.#t()}strategyChanged(){this.#e()}connectedCallback(){super.connectedCallback(),this.#e(),this.#t()}disconnectedCallback(){super.disconnectedCallback(),this.#t()}#t(){this.#o?.(),this.open&&this.controlEl&&this.controlEl.classList.add("open"),this.anchorEl&&this.open&&this.popupEl&&(this.#o=Ie(this.anchorEl,this.popupEl,this.#i,{animationFrame:this.animationFrame}))}#e(){this.popupEl&&this.strategy==="fixed"&&(this.open?this.popupEl.showPopover():this.popupEl.hidePopover())}#n;#i;async updatePosition(){if(!this.open||!this.anchorEl)return;const e=await Ze(this.anchorEl,this.popupEl,{placement:this.placement,strategy:this.strategy,middleware:this.#r});this.#s(e),this.arrow&&this.#l(e)}#s(e){const{x:n,y:o}=e,{referenceHidden:i}=e.middlewareData.hide;Object.assign(this.popupEl.style,{left:`${n}px`,top:`${o}px`,visibility:i?"hidden":"visible"})}#l(e){const{x:n,y:o}=e.middlewareData.arrow,i={left:"calc(100% - 4px)",right:"-4px",top:"calc(100% - 4px)",bottom:"-4px"},r=e.placement.split("-")[0];Object.assign(this.arrowEl.style,{left:n?`${n}px`:i[r],top:o?`${o}px`:i[r]})}get anchorEl(){return this.anchor??null}show(){return this.open=!0,this.#n??Promise.resolve()}hide(){this.open=!1}}U([S.attr({mode:"boolean"})],j.prototype,"open");U([S.attr({mode:"boolean"})],j.prototype,"dismissible");U([S.attr({mode:"boolean"})],j.prototype,"arrow");U([S.attr({mode:"boolean"})],j.prototype,"alternate");U([S.attr({mode:"fromView"})],j.prototype,"placement");U([S.attr({mode:"boolean",attribute:"animation-frame"})],j.prototype,"animationFrame");U([S.attr({mode:"fromView"})],j.prototype,"strategy");U([S.attr({attribute:"offset",converter:S.nullableNumberConverter})],j.prototype,"offset");U([S.observable],j.prototype,"anchor");const nn=":host{display:var(--_popup-display, inline)}.control{border-radius:inherit;background:var(--vvd-color-surface-4dp);contain:layout}.control:not(.open){display:none}.popup-wrapper{white-space:initial;--scrollbar-track-color: transparent;--scrollbar-thumb-color: color-mix(in srgb, var(--vvd-color-neutral-950), transparent 70%)}.popup-wrapper{scrollbar-color:var(--scrollbar-thumb-color) var(--scrollbar-track-color);scrollbar-width:thin}.popup-wrapper ::-webkit-scrollbar{width:4px}.popup-wrapper ::-webkit-scrollbar-track{background:var(--scrollbar-track-color)}.popup-wrapper ::-webkit-scrollbar-thumb{border:0;border-radius:4px;background-color:var(--scrollbar-fallback-track-color, var(--scrollbar-thumb-color))}.popup-wrapper{z-index:var(--_popup-z-index, 10);overflow:visible;padding:0;border:none;border-radius:8px;margin:0;inline-size:max-content}.popup-wrapper:not(.absolute){position:fixed}.popup-wrapper.absolute{position:absolute;top:0;left:0}.popup-content{display:grid;color:var(--vvd-color-canvas-text)}.dismissible .popup-content{align-content:start;grid-template-columns:1fr auto}.arrow{position:absolute;z-index:-1;width:8px;height:8px;background:var(--vvd-color-surface-4dp);transform:rotate(45deg)}.dismissible-button{align-self:flex-start;margin-block-start:4px;margin-inline-end:4px}",on=({open:t,dismissible:e,alternate:n})=>Jt.classNames("control",["open",!!t],["dismissible",!!e],["alternate",!!n]);function rn(t){return t.strategy&&t.strategy==="fixed"?"manual":null}const sn=t=>{const e=t.tagFor(Ht.Elevation),n=t.tagFor(Vt.Button);return S.html`
+  <${e}>
+		<div popover="${rn}" class="popup-wrapper ${o=>o.strategy}" ${ht.ref("popupEl")} part="popup-base">
+			<div ${ht.ref("controlEl")} class="${on}" aria-hidden="${o=>o.open?"false":"true"}"
+				part="${o=>o.alternate?"vvd-theme-alternate":""}">
+				<div class="popup-content">
+					<slot></slot>
+					${Pt.when(o=>o.dismissible,S.html`<${n} size="condensed" @click="${o=>o.open=!1}"
+						class="dismissible-button" icon="close-small-solid" shape="pill"></${n}>`)}
+				</div>
+				${Pt.when(o=>o.arrow,S.html`<div class="arrow" ${ht.ref("arrowEl")}></div>`)}
+			</div>
+    </div>
+  </${e}>`},Kt=S.defineVividComponent("popup",j,sn,[Ht.elevationDefinition,Vt.buttonDefinition],{styles:nn}),ln=S.createRegisterFunction(Kt);exports.PlacementStrategy=ot;exports.Popup=j;exports.popupDefinition=Kt;exports.registerPopup=ln;