@vonage/vivid 5.24.0 → 5.27.0

package/bundled/definition4.js

@@ -1,92 +1,54 @@
-import { A as e, d as t, m as n, p as r, t as i, u as a } from "./vivid-element.js";
-import { r as o, t as s } from "./slotted.js";
-import { t as c } from "./children.js";
-import { t as l } from "./ref.js";
-import { t as u } from "./when.js";
-import { t as d } from "./decorate.js";
-import { t as f } from "./class-names.js";
-import { t as p } from "./dom.js";
-import { r as m, t as h } from "./definition3.js";
-import { a as g, i as _, t as v } from "./affix.js";
-import { n as y, t as b } from "./host-semantics.js";
-//#region src/lib/tree-item/tree-item.scss?inline
-var x = ":host(:focus-visible){outline:none}:host([disabled]){cursor:not-allowed}.control{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control:disabled,.control.disabled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}@media (hover:hover){.control:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}}.control.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)),.control.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control.selected:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}@media (hover:hover){.control.selected: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:transparent}}.control.selected.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:transparent}.control{--_connotation-color-primary:var(--vvd-tree-item-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-tree-item-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-tree-item-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-faint:var(--vvd-tree-item-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-soft:var(--vvd-tree-item-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-firm:var(--vvd-tree-item-accent-firm,var(--vvd-color-canvas-text));box-sizing:border-box;background-color:var(--_appearance-color-fill);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);font:var(--vvd-typography-base);hyphens:auto;inline-size:100%;min-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));vertical-align:middle;word-break:break-word;user-select:none;border-radius:8px;align-items:center;gap:12px;padding-inline:16px;text-decoration:none;display:inline-flex;position:relative}.control:not(.disabled){cursor:pointer}.control.disabled{pointer-events:none}:host(:focus-visible) .control{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))}:host(:focus-visible) .control:not(.selected){--focus-stroke-gap-color:transparent}.control .text{font:var(--vvd-typography-base)}.expandCollapseButton{border-radius:8px;align-items:center;font-size:20px;display:flex}.expandCollapseButton .expandCollapseIcon{margin:4px}@media (hover:hover){.expandCollapseButton:hover{background-color:var(--vvd-color-neutral-100)}.selected .expandCollapseButton:hover{background-color:var(--vvd-color-neutral-700)}}.items{flex-direction:column;gap:4px;margin-block-start:4px;padding-inline-start:48px;display:flex}slot[name=icon]{font-size:20px;line-height:1}.control:not(.disabled,.selected) slot[name=icon]{color:var(--vvd-color-neutral-600)}";
+import { d as e, m as t, p as n, u as r } from "./vivid-element.js";
+import { t as i } from "./when.js";
+import { t as a } from "./decorate.js";
+import { t as o } from "./class-names.js";
+import { t as s } from "./base-progress.js";
+import { n as c, t as l } from "./delegates-aria.js";
+import { t as u } from "./component-enum.js";
+//#region src/lib/progress-ring/progress-ring.scss?inline
+var d = ":host{--_vvd-progress-ring-accent-firm-wrapper:var(--vvd-progress-ring-accent-firm);--_vvd-progress-ring-cta-firm-wrapper:var(--vvd-progress-ring-cta-firm);--_vvd-progress-ring-alert-firm-wrapper:var(--vvd-progress-ring-alert-firm);--_vvd-progress-ring-success-firm-wrapper:var(--vvd-progress-ring-success-firm)}.base{--vvd-progress-ring-accent-firm:var(--_vvd-progress-ring-accent-firm-wrapper,var(--vvd-progress-ring-accent-primary));--vvd-progress-ring-cta-firm:var(--_vvd-progress-ring-cta-firm-wrapper,var(--vvd-progress-ring-cta-primary));--vvd-progress-ring-alert-firm:var(--_vvd-progress-ring-alert-firm-wrapper,var(--vvd-progress-ring-alert-primary));--vvd-progress-ring-success-firm:var(--_vvd-progress-ring-success-firm-wrapper,var(--vvd-progress-ring-success-primary))}.base.size--6{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)) - 1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16))}.base.size--5{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 20))}.base.size--4{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16))}.base.size--3{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 12))}.base.size--2{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8))}.base.size--1{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 4))}.base.size-1{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 4))}.base.size-2{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8))}.base.size-3{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 12))}.base.size-4{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 16))}.base.size-5{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 20))}.base:not(.size--6,.size--5,.size--4,.size--3,.size--2,.size--1,.size-1,.size-2,.size-3,.size-4,.size-5){--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)))}.base{block-size:var(--_size);color:var(--_appearance-color-text);inline-size:var(--_size);outline:none;align-items:center}.progress{width:100%;height:100%}.background{fill:none;stroke:#0000;stroke-width:1px}.determinate{fill:none;stroke:currentColor;stroke-linecap:round;stroke-width:1px;transform-origin:50%;transition:all .2s ease-in-out;transform:rotate(-90deg)}.indeterminate-indicator-1{fill:none;stroke:currentColor;stroke-linecap:round;stroke-width:1px;transform-origin:50%;transition:all .2s ease-in-out;animation:2s linear infinite spin-infinite;transform:rotate(-90deg)}.base.paused .indeterminate-indicator-1{animation-play-state:paused}@keyframes spin-infinite{0%{stroke-dasharray:.01 43.97;transform:rotate(0)}50%{stroke-dasharray:21.99 21.99;transform:rotate(450deg)}to{stroke-dasharray:.01 43.97;transform:rotate(1080deg)}}", f = u([
+	"accent",
+	"success",
+	"alert",
+	"cta"
+], "accent"), p = class extends l(s) {};
+a([t], p.prototype, "connotation", void 0), a([t], p.prototype, "size", void 0);
 //#endregion
-//#region src/lib/tree-item/tree-item.ts
-function S(e) {
-	return p(e) && (e.getAttribute("role") === "treeitem" || e instanceof C);
-}
-var C = class extends b(v(i)) {
-	constructor(...e) {
-		super(...e), this.expanded = !1, this.selected = !1, this.disabled = !1, this.focusable = !1, this.isNestedItem = () => S(this.parentElement), this.handleExpandCollapseButtonClick = (e) => {
-			!this.disabled && !e.defaultPrevented && (this.expanded = !this.expanded);
-		}, this.handleFocus = (e) => {
-			this.setAttribute("tabindex", "0");
-		}, this.handleBlur = (e) => {
-			this.setAttribute("tabindex", "-1");
-		};
-	}
-	expandedChanged() {
-		this.$fastController.isConnected && this.$emit("expanded-change", this);
-	}
-	selectedChanged() {
-		this.$fastController.isConnected && this.$emit("selected-change", this);
-	}
-	itemsChanged() {
-		this.$fastController.isConnected && this.items.forEach((e) => {
-			/* v8 ignore else -- @preserve */
-			S(e) && (e.nested = !0);
-		});
-	}
-	static focusItem(e) {
-		e.focusable = !0, e.focus();
-	}
-	childItemLength() {
-		return this.childItems.filter((e) => S(e)).length;
-	}
-};
-d([n], C.prototype, "text", void 0), d([n({ mode: "boolean" })], C.prototype, "expanded", void 0), d([n({ mode: "boolean" })], C.prototype, "selected", void 0), d([n({ mode: "boolean" })], C.prototype, "disabled", void 0), d([e], C.prototype, "focusable", void 0), d([e], C.prototype, "childItems", void 0), d([e], C.prototype, "items", void 0), d([e], C.prototype, "nested", void 0), d([e], C.prototype, "renderCollapsedChildren", void 0);
-//#endregion
-//#region src/lib/tree-item/tree-item.template.ts
-var w = (e) => {
-	let t = e.tagFor(m);
-	return r`
-	<div aria-hidden="true"
-		class="expandCollapseButton"
-		@click="${(e, t) => e.handleExpandCollapseButtonClick(t.event)}"
-			${l("expandCollapseButton")}
-	>
-		<${t} class="expandCollapseIcon" name="${(e) => e.expanded ? "chevron-down-line" : "chevron-right-line"}"></${t}>
-	</div>`;
-}, T = a("tree-item", C, (e) => {
-	let t = g(e), n = e.tagFor(C, !0);
-	return r` <template
-		slot="${(e) => e.isNestedItem() ? "item" : void 0}"
-		tabindex="-1"
-		${y({
-		role: "treeitem",
-		ariaExpanded: (e) => e.childItems && e.childItems.length > 0 ? e.expanded : void 0,
-		ariaSelected: (e) => e.selected,
-		ariaDisabled: (e) => e.disabled
-	})}
-		@focusin="${(e, t) => e.handleFocus(t.event)}"
-		@focusout="${(e, t) => e.handleBlur(t.event)}"
+//#region src/lib/progress-ring/progress-ring.template.ts
+var m = 44, h = n`<template>
+	<div
+		class="${(e) => e.paused ? "paused" : ""} ${(e) => o("base", ["disabled", e.paused], `connotation-${f.parse(e.connotation)}`, "appearance-ghost", "with-idle", "with-disabled", [`size-${e.size}`, !!e.size])}"
 		${c({
-		property: "childItems",
-		filter: o(n)
-	})}
+	role: "progressbar",
+	ariaValueNow: (e) => e.value,
+	ariaValueMin: (e) => e.min,
+	ariaValueMax: (e) => e.max
+})}
 	>
-		<div
-			class="${(e) => f("control", ["disabled", e.disabled], ["selected", e.selected])}"
-		>
-			${u((e) => e.childItems && e.childItems.length > 0, w(e))}
-			${(e) => t(e.icon, _.Slot)}
-			${(e) => e.text}
-		</div>
-		${u((e) => e.childItems && e.childItems.length > 0 && e.expanded, r` <div role="group" class="items">
-				<slot name="item" ${s("items")}></slot>
-			</div>`)}
-	</template>`;
-}, [h], { styles: x }), E = t(T);
+		${i((e) => typeof e.value == "number", n`
+				<svg class="progress" viewBox="0 0 16 16">
+					<circle class="background" cx="8px" cy="8px" r="7px"></circle>
+					<circle
+						class="determinate"
+						style="stroke-dasharray: ${(e) => m * e.percentComplete / 100}px ${m}px"
+						cx="8px"
+						cy="8px"
+						r="7px"
+					></circle>
+				</svg>
+			`)}
+		${i((e) => typeof e.value != "number", n`
+				<svg class="progress" viewBox="0 0 16 16">
+					<circle class="background" cx="8px" cy="8px" r="7px"></circle>
+					<circle
+						class="indeterminate-indicator-1"
+						cx="8px"
+						cy="8px"
+						r="7px"
+					></circle>
+				</svg>
+			`)}
+	</div>
+</template>`, g = r("progress-ring", p, h, [], { styles: d }), _ = e(g);
 //#endregion
-export { S as i, T as n, C as r, E as t };
+export { _ as n, p as r, g as t };

package/bundled/definition5.cjs

@@ -1,30 +1,29 @@
-const e=require(`./vivid-element.cjs`),t=require(`./when.cjs`),n=require(`./decorate.cjs`),r=require(`./class-names.cjs`),i=require(`./base-progress.cjs`),a=require(`./delegates-aria.cjs`);var o=`:host{--_vvd-progress-ring-accent-firm-wrapper:var(--vvd-progress-ring-accent-firm);--_vvd-progress-ring-cta-firm-wrapper:var(--vvd-progress-ring-cta-firm);--_vvd-progress-ring-alert-firm-wrapper:var(--vvd-progress-ring-alert-firm);--_vvd-progress-ring-success-firm-wrapper:var(--vvd-progress-ring-success-firm)}.base{--vvd-progress-ring-accent-firm:var(--_vvd-progress-ring-accent-firm-wrapper,var(--vvd-progress-ring-accent-primary));--vvd-progress-ring-cta-firm:var(--_vvd-progress-ring-cta-firm-wrapper,var(--vvd-progress-ring-cta-primary));--vvd-progress-ring-alert-firm:var(--_vvd-progress-ring-alert-firm-wrapper,var(--vvd-progress-ring-alert-primary));--vvd-progress-ring-success-firm:var(--_vvd-progress-ring-success-firm-wrapper,var(--vvd-progress-ring-success-primary))}.base.connotation-cta{--_connotation-color-firm:var(--vvd-progress-ring-cta-firm,var(--vvd-color-cta-600))}.base.connotation-alert{--_connotation-color-firm:var(--vvd-progress-ring-alert-firm,var(--vvd-color-alert-600))}.base.connotation-success{--_connotation-color-firm:var(--vvd-progress-ring-success-firm,var(--vvd-color-success-600))}.base:not(.connotation-cta,.connotation-alert,.connotation-success){--_connotation-color-firm:var(--vvd-progress-ring-accent-firm,var(--vvd-color-canvas-text))}.base{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_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.size--6{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)) - 1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16))}.base.size--5{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 20))}.base.size--4{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16))}.base.size--3{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 12))}.base.size--2{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8))}.base.size--1{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 4))}.base.size-1{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 4))}.base.size-2{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8))}.base.size-3{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 12))}.base.size-4{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 16))}.base.size-5{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 20))}.base:not(.size--6,.size--5,.size--4,.size--3,.size--2,.size--1,.size-1,.size-2,.size-3,.size-4,.size-5){--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)))}.base{block-size:var(--_size);color:var(--_appearance-color-text);inline-size:var(--_size);outline:none;align-items:center}.progress{width:100%;height:100%}.background{fill:none;stroke:#0000;stroke-width:1px}.determinate{fill:none;stroke:currentColor;stroke-linecap:round;stroke-width:1px;transform-origin:50%;transition:all .2s ease-in-out;transform:rotate(-90deg)}.indeterminate-indicator-1{fill:none;stroke:currentColor;stroke-linecap:round;stroke-width:1px;transform-origin:50%;transition:all .2s ease-in-out;animation:2s linear infinite spin-infinite;transform:rotate(-90deg)}.base.paused .indeterminate-indicator-1{animation-play-state:paused}@keyframes spin-infinite{0%{stroke-dasharray:.01 43.97;transform:rotate(0)}50%{stroke-dasharray:21.99 21.99;transform:rotate(450deg)}to{stroke-dasharray:.01 43.97;transform:rotate(1080deg)}}`,s=class extends a.t(i.t){};n.t([e.m],s.prototype,`connotation`,void 0),n.t([e.m],s.prototype,`size`,void 0);var c=44,l=e.p`<template>
-	<div
-		class="${e=>e.paused?`paused`:``} ${e=>r.t(`base`,[`disabled`,e.paused],[`connotation-${e.connotation}`,!!e.connotation],[`size-${e.size}`,!!e.size])}"
-		${a.n({role:`progressbar`,ariaValueNow:e=>e.value,ariaValueMin:e=>e.min,ariaValueMax:e=>e.max})}
+const e=require("./localized.cjs"),t=require("./vivid-element.cjs"),n=require("./ref.cjs"),r=require("./when.cjs"),i=require("./enums.cjs"),a=require("./decorate.cjs"),o=require("./class-names.cjs"),s=require("./definition2.cjs"),c=require("./icon.cjs"),l=require("./affix.cjs"),u=require("./definition4.cjs"),d=require("./delegates-aria.cjs"),f=require("./component-enum.cjs"),p=require("./button.cjs"),m=require("./linkable.cjs");var h=f.t([`accent`,`announcement`,`cta`,`success`,`alert`],`accent`),g=f.t([`filled`,`outlined`,`ghost`,`ghost-light`,`outlined-light`],`ghost`),_=class extends l.n(e.t(m.t(p.t))){constructor(){super(),this.stacked=!1,this.pending=!1,this.dropdownIndicator=!1,this.active=!1,this.pressed=!1,this.title=``}clickHandler(e){if(this.disabled||this.pending){e.preventDefault(),e.stopImmediatePropagation();return}return!0}};a.t([t.m({converter:{fromView:e=>e||null,toView:e=>e||null}})],_.prototype,`title`,void 0),a.t([t.m],_.prototype,`connotation`,void 0),a.t([t.m],_.prototype,`shape`,void 0),a.t([t.m],_.prototype,`appearance`,void 0),a.t([t.m],_.prototype,`size`,void 0),a.t([t.m({mode:`boolean`,attribute:`stacked`})],_.prototype,`stacked`,void 0),a.t([t.m({mode:`boolean`,attribute:`pending`})],_.prototype,`pending`,void 0),a.t([t.m({mode:`boolean`,attribute:`dropdown-indicator`})],_.prototype,`dropdownIndicator`,void 0),a.t([t.m({mode:`boolean`,attribute:`active`})],_.prototype,`active`,void 0),a.t([t.m({mode:`boolean`,attribute:`pressed`})],_.prototype,`pressed`,void 0),a.t([t.m],_.prototype,`label`,void 0);var v=`.chevron{font:var(--vvd-typography-base-extended);flex-shrink:0;display:flex;transform:rotate(0)}@media (prefers-reduced-motion:no-preference){.chevron{transition:transform .2s}}:host([data-expanded=true]) .chevron,:host([open]) .chevron{transform:rotate(180deg)}:host{--_vvd-button-accent-firm-wrapper:var(--vvd-button-accent-firm);--_vvd-button-cta-firm-wrapper:var(--vvd-button-cta-firm);--_vvd-button-success-firm-wrapper:var(--vvd-button-success-firm);--_vvd-button-alert-firm-wrapper:var(--vvd-button-alert-firm);--_vvd-button-announcement-firm-wrapper:var(--vvd-button-announcement-firm)}.control:not(.appearance-ghost-light,.appearance-filled,.appearance-outlined){--vvd-button-accent-firm:var(--_vvd-button-accent-firm-wrapper,var(--vvd-button-accent-primary));--vvd-button-cta-firm:var(--_vvd-button-cta-firm-wrapper,var(--vvd-button-cta-primary));--vvd-button-success-firm:var(--_vvd-button-success-firm-wrapper,var(--vvd-button-success-primary));--vvd-button-alert-firm:var(--_vvd-button-alert-firm-wrapper,var(--vvd-button-alert-primary));--vvd-button-announcement-firm:var(--_vvd-button-announcement-firm-wrapper,var(--vvd-button-announcement-primary))}:host{display:inline-block}.control{--focus-stroke-gap-color:transparent;box-sizing:border-box;border-radius:var(--_button-border-radius);background-color:var(--_appearance-color-fill);block-size:var(--_button-block-size);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);justify-content:space-between;align-items:center;gap:var(--_button-icon-gap);vertical-align:middle;border:0;margin:0;text-decoration:none;display:inline-flex}.control .text{-webkit-line-clamp:var(--button-line-clamp,1);text-align:start;-webkit-box-orient:vertical;max-inline-size:100%;display:-webkit-box;overflow:hidden}.control:not(.icon-only){inline-size:100%}.control:not(.disabled){cursor:var(--button-cursor,pointer)}.control.disabled{cursor:not-allowed}.control{user-select:none}.control:not(.stacked).size-super-condensed{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:4px;--_button-chevron-size:10px}.control:not(.stacked).size-super-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-super-condensed:not(.icon-only){padding-inline:8px}.control:not(.stacked).size-condensed{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:8px;--_button-chevron-size:12px}.control:not(.stacked).size-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-condensed:not(.icon-only){padding-inline:12px}.control:not(.stacked).size-expanded{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));font:var(--vvd-typography-base-extended-bold);--_button-icon-gap:10px;--_button-chevron-size:16px}.control:not(.stacked).size-expanded.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-expanded:not(.icon-only){padding-inline:20px}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed){--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));font:var(--vvd-typography-base-bold);--_button-icon-gap:8px;--_button-chevron-size:16px}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed).icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed):not(.icon-only){padding-inline:16px}.control:not(.shape-pill){--_button-border-radius:8px}.control:not(.shape-pill).size-condensed:not(.stacked),.control:not(.shape-pill).size-super-condensed:not(.stacked){--_button-border-radius:4px}.control.shape-pill:not(.icon-only,.stacked.size-super-condensed,.stacked.size-condensed,.stacked.normal){--_button-border-radius:24px}.control.shape-pill.stacked.size-condensed,.control.shape-pill.stacked.size-super-condensed{--_button-border-radius:16px}.control.shape-pill.stacked.size-normal{--_button-border-radius:20px}.control.shape-pill.icon-only{--_button-border-radius:50%}.control.stacked.size-super-condensed{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));--_button-block-size:calc(var(--stacked-size) + 20px);font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:4px;--_button-chevron-size:10px}.control.stacked.size-super-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-super-condensed:not(.icon-only){padding-inline:16px}.control.stacked.size-condensed{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));--_button-block-size:calc(var(--stacked-size) + 24px);font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:6px;--_button-chevron-size:12px}.control.stacked.size-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-condensed:not(.icon-only){padding-inline:12px}.control.stacked.size-expanded{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));--_button-block-size:calc(var(--stacked-size) + 32px);font:var(--vvd-typography-base-extended-bold);--_button-icon-gap:10px;--_button-chevron-size:16px}.control.stacked.size-expanded.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-expanded:not(.icon-only){padding-inline:20px}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed){--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));--_button-block-size:calc(var(--stacked-size) + 28px);font:var(--vvd-typography-base-bold);--_button-icon-gap:8px;--_button-chevron-size:16px}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed).icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed):not(.icon-only){padding-inline:16px}.control.appearance-filled{--focus-stroke-gap-color:transparent}.control.appearance-filled:focus-visible{outline:none;position:relative}.control.appearance-filled:focus-visible: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%)}.control:not(.appearance-filled):focus-visible{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))}slot[name=icon]{line-height:1}.icon-trailing slot[name=icon]{order:1;display:flex}.control.stacked slot[name=icon]{font-size:calc(var(--stacked-size) / 2)}.control:not(.stacked) slot[name=icon]{font-size:calc(var(--_button-block-size) / 2)}.chevron{font-size:var(--_button-chevron-size)}.content{justify-content:center;align-items:center;gap:var(--_button-icon-gap);flex:1;display:flex;overflow:hidden}.control.stacked .content{flex-direction:column}:host([dropdown-indicator]) .content{justify-content:var(--button-content-alignment,flex-start);text-align:start}:host([dropdown-indicator][stacked]) .content{align-items:var(--button-content-alignment,flex-start);justify-content:center}.pending-no-icon{position:absolute}.pending-no-icon+.text{visibility:hidden}:host([icon-trailing][pending]) .pending{order:1}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}`,y=e=>{let n=e.tagFor(c.t);return t.p`<${n} class="chevron" aria-hidden="true" name="chevron-down-line"></${n}>`};function b(e){let t=g.parse(e.appearance);if(e.pressed){if(t===`ghost`)return`subtle`;if(t===`ghost-light`)return`subtle-light`;if(t===`outlined`)return`filled`}return t}var x=e=>o.t(`control`,`connotation-${h.parse(e.connotation)}`,`appearance-${b(e)}`,`with-idle`,`with-hover`,`with-active`,`with-disabled`,[`disabled`,e.disabled||e.pending],[`shape-${e.shape}`,!!e.shape],[`size-${e.size}`,!!e.size],[`icon-only`,!e.label&&!!(e.icon||e.iconSlottedContent?.length)&&!e.dropdownIndicator],[`icon-trailing`,e.iconTrailing],[`stacked`,e.stacked],[`active`,e.ariaExpanded===`true`||e.active]);function S(e,n,r,a=i.a.Normal){if(r&&a!=i.a.SuperCondensed){let r=e.tagFor(u.r),s={[i.a.Condensed]:`-6`,[i.a.Normal]:`-5`,[i.a.Expanded]:`-4`};return t.p`<span class="${e=>{let t=e.querySelector(`[slot="icon"]`);return o.t(`icon`,`pending`,[`pending-no-icon`,!(n||t)])}}" aria-hidden="true"><${r} size="${s[a]}"></${r}></span>`}return l.a(e)(n,l.i.Slot)}var C=e=>[`submit`,`button`,`reset`].indexOf(e)>-1?e:`submit`,w=e=>{let n=y(e);return t.p`<span class="content">
+			${t=>S(e,t.icon,t.pending,t.size)}
+			${r.t(e=>e.label,t.p`<span class="text" aria-hidden="true">${e=>e.label}</span>`)}
+			<span class="sr-only"
+				>${e=>e.pending?e.locale.button.pendingLabel:e.ariaLabel??e.label}</span
+			>
+		</span>
+		${r.t(e=>e.dropdownIndicator,n)}`};function T(e){return t.p` <button
+		class="${x}"
+		?autofocus="${e=>e.autofocus}"
+		form="${e=>e.formId}"
+		formaction="${e=>e.formaction}"
+		formenctype="${e=>e.formenctype}"
+		formmethod="${e=>e.formmethod}"
+		formnovalidate="${e=>e.formnovalidate}"
+		formtarget="${e=>e.formtarget}"
+		name="${e=>e.name}"
+		type="${e=>C(e.type)}"
+		value="${e=>e.value}"
+		title="${e=>e.title}"
+		${d.n({ariaLabel:null,ariaDisabled:e=>e.disabled||e.pending,ariaPressed:e=>e.pressed?`true`:e.ariaPressed??null})}
+		${n.t(`control`)}
+		@click="${(e,t)=>e.clickHandler(t.event)}"
 	>
-		${t.t(e=>typeof e.value==`number`,e.p`
-				<svg class="progress" viewBox="0 0 16 16">
-					<circle class="background" cx="8px" cy="8px" r="7px"></circle>
-					<circle
-						class="determinate"
-						style="stroke-dasharray: ${e=>c*e.percentComplete/100}px ${c}px"
-						cx="8px"
-						cy="8px"
-						r="7px"
-					></circle>
-				</svg>
-			`)}
-		${t.t(e=>typeof e.value!=`number`,e.p`
-				<svg class="progress" viewBox="0 0 16 16">
-					<circle class="background" cx="8px" cy="8px" r="7px"></circle>
-					<circle
-						class="indeterminate-indicator-1"
-						cx="8px"
-						cy="8px"
-						r="7px"
-					></circle>
-				</svg>
-			`)}
-	</div>
-</template>`,u=e.u(`progress-ring`,s,l,[],{styles:o}),d=e.d(u);Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return d}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return s}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return u}});
+		${w(e)}
+	</button>`}function E(e){return t.p`${t=>t._renderLinkElement(w(e),x,{ariaLabel:null})}`}var D=t.u(`button`,_,e=>t.p` <template>
+		${r.t(e=>!e.href,t.p`${T(e)}`)}
+		${r.t(e=>e.href,E(e))}
+	</template>`,[s.t,u.t],{styles:v,shadowOptions:{delegatesFocus:!0}}),O=t.d(D);Object.defineProperty(exports,"i",{enumerable:!0,get:function(){return _}}),Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return O}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return y}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return D}});

package/bundled/definition5.js

@@ -1,48 +1,146 @@
-import { d as e, m as t, p as n, u as r } from "./vivid-element.js";
-import { t as i } from "./when.js";
-import { t as a } from "./decorate.js";
-import { t as o } from "./class-names.js";
-import { t as s } from "./base-progress.js";
-import { n as c, t as l } from "./delegates-aria.js";
-//#region src/lib/progress-ring/progress-ring.scss?inline
-var u = ":host{--_vvd-progress-ring-accent-firm-wrapper:var(--vvd-progress-ring-accent-firm);--_vvd-progress-ring-cta-firm-wrapper:var(--vvd-progress-ring-cta-firm);--_vvd-progress-ring-alert-firm-wrapper:var(--vvd-progress-ring-alert-firm);--_vvd-progress-ring-success-firm-wrapper:var(--vvd-progress-ring-success-firm)}.base{--vvd-progress-ring-accent-firm:var(--_vvd-progress-ring-accent-firm-wrapper,var(--vvd-progress-ring-accent-primary));--vvd-progress-ring-cta-firm:var(--_vvd-progress-ring-cta-firm-wrapper,var(--vvd-progress-ring-cta-primary));--vvd-progress-ring-alert-firm:var(--_vvd-progress-ring-alert-firm-wrapper,var(--vvd-progress-ring-alert-primary));--vvd-progress-ring-success-firm:var(--_vvd-progress-ring-success-firm-wrapper,var(--vvd-progress-ring-success-primary))}.base.connotation-cta{--_connotation-color-firm:var(--vvd-progress-ring-cta-firm,var(--vvd-color-cta-600))}.base.connotation-alert{--_connotation-color-firm:var(--vvd-progress-ring-alert-firm,var(--vvd-color-alert-600))}.base.connotation-success{--_connotation-color-firm:var(--vvd-progress-ring-success-firm,var(--vvd-color-success-600))}.base:not(.connotation-cta,.connotation-alert,.connotation-success){--_connotation-color-firm:var(--vvd-progress-ring-accent-firm,var(--vvd-color-canvas-text))}.base{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_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.size--6{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)) - 1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16))}.base.size--5{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 20))}.base.size--4{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16))}.base.size--3{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 12))}.base.size--2{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8))}.base.size--1{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 4))}.base.size-1{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 4))}.base.size-2{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8))}.base.size-3{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 12))}.base.size-4{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 16))}.base.size-5{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 20))}.base:not(.size--6,.size--5,.size--4,.size--3,.size--2,.size--1,.size-1,.size-2,.size-3,.size-4,.size-5){--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)))}.base{block-size:var(--_size);color:var(--_appearance-color-text);inline-size:var(--_size);outline:none;align-items:center}.progress{width:100%;height:100%}.background{fill:none;stroke:#0000;stroke-width:1px}.determinate{fill:none;stroke:currentColor;stroke-linecap:round;stroke-width:1px;transform-origin:50%;transition:all .2s ease-in-out;transform:rotate(-90deg)}.indeterminate-indicator-1{fill:none;stroke:currentColor;stroke-linecap:round;stroke-width:1px;transform-origin:50%;transition:all .2s ease-in-out;animation:2s linear infinite spin-infinite;transform:rotate(-90deg)}.base.paused .indeterminate-indicator-1{animation-play-state:paused}@keyframes spin-infinite{0%{stroke-dasharray:.01 43.97;transform:rotate(0)}50%{stroke-dasharray:21.99 21.99;transform:rotate(450deg)}to{stroke-dasharray:.01 43.97;transform:rotate(1080deg)}}", d = class extends l(s) {};
-a([t], d.prototype, "connotation", void 0), a([t], d.prototype, "size", void 0);
+import { t as e } from "./localized.js";
+import { d as t, m as n, p as r, u as i } from "./vivid-element.js";
+import { t as a } from "./ref.js";
+import { t as o } from "./when.js";
+import { a as s } from "./enums.js";
+import { t as c } from "./decorate.js";
+import { t as l } from "./class-names.js";
+import { t as u } from "./definition2.js";
+import { t as d } from "./icon.js";
+import { a as f, i as p, n as m } from "./affix.js";
+import { r as h, t as g } from "./definition4.js";
+import { n as _ } from "./delegates-aria.js";
+import { t as v } from "./component-enum.js";
+import { t as y } from "./button.js";
+import { t as b } from "./linkable.js";
+//#region src/lib/button/button.ts
+var x = v([
+	"accent",
+	"announcement",
+	"cta",
+	"success",
+	"alert"
+], "accent"), S = v([
+	"filled",
+	"outlined",
+	"ghost",
+	"ghost-light",
+	"outlined-light"
+], "ghost"), C = class extends m(e(b(y))) {
+	constructor() {
+		super(), this.stacked = !1, this.pending = !1, this.dropdownIndicator = !1, this.active = !1, this.pressed = !1, this.title = "";
+	}
+	clickHandler(e) {
+		/* v8 ignore else -- @preserve */
+		if (this.disabled || this.pending) {
+			e.preventDefault(), e.stopImmediatePropagation();
+			return;
+		}
+		return !0;
+	}
+};
+c([n({ converter: {
+	fromView: (e) => e || null,
+	toView: (e) => e || null
+} })], C.prototype, "title", void 0), c([n], C.prototype, "connotation", void 0), c([n], C.prototype, "shape", void 0), c([n], C.prototype, "appearance", void 0), c([n], C.prototype, "size", void 0), c([n({
+	mode: "boolean",
+	attribute: "stacked"
+})], C.prototype, "stacked", void 0), c([n({
+	mode: "boolean",
+	attribute: "pending"
+})], C.prototype, "pending", void 0), c([n({
+	mode: "boolean",
+	attribute: "dropdown-indicator"
+})], C.prototype, "dropdownIndicator", void 0), c([n({
+	mode: "boolean",
+	attribute: "active"
+})], C.prototype, "active", void 0), c([n({
+	mode: "boolean",
+	attribute: "pressed"
+})], C.prototype, "pressed", void 0), c([n], C.prototype, "label", void 0);
 //#endregion
-//#region src/lib/progress-ring/progress-ring.template.ts
-var f = 44, p = r("progress-ring", d, n`<template>
-	<div
-		class="${(e) => e.paused ? "paused" : ""} ${(e) => o("base", ["disabled", e.paused], [`connotation-${e.connotation}`, !!e.connotation], [`size-${e.size}`, !!e.size])}"
-		${c({
-	role: "progressbar",
-	ariaValueNow: (e) => e.value,
-	ariaValueMin: (e) => e.min,
-	ariaValueMax: (e) => e.max
-})}
+//#region src/lib/button/button.scss?inline
+var w = ".chevron{font:var(--vvd-typography-base-extended);flex-shrink:0;display:flex;transform:rotate(0)}@media (prefers-reduced-motion:no-preference){.chevron{transition:transform .2s}}:host([data-expanded=true]) .chevron,:host([open]) .chevron{transform:rotate(180deg)}:host{--_vvd-button-accent-firm-wrapper:var(--vvd-button-accent-firm);--_vvd-button-cta-firm-wrapper:var(--vvd-button-cta-firm);--_vvd-button-success-firm-wrapper:var(--vvd-button-success-firm);--_vvd-button-alert-firm-wrapper:var(--vvd-button-alert-firm);--_vvd-button-announcement-firm-wrapper:var(--vvd-button-announcement-firm)}.control:not(.appearance-ghost-light,.appearance-filled,.appearance-outlined){--vvd-button-accent-firm:var(--_vvd-button-accent-firm-wrapper,var(--vvd-button-accent-primary));--vvd-button-cta-firm:var(--_vvd-button-cta-firm-wrapper,var(--vvd-button-cta-primary));--vvd-button-success-firm:var(--_vvd-button-success-firm-wrapper,var(--vvd-button-success-primary));--vvd-button-alert-firm:var(--_vvd-button-alert-firm-wrapper,var(--vvd-button-alert-primary));--vvd-button-announcement-firm:var(--_vvd-button-announcement-firm-wrapper,var(--vvd-button-announcement-primary))}:host{display:inline-block}.control{--focus-stroke-gap-color:transparent;box-sizing:border-box;border-radius:var(--_button-border-radius);background-color:var(--_appearance-color-fill);block-size:var(--_button-block-size);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);justify-content:space-between;align-items:center;gap:var(--_button-icon-gap);vertical-align:middle;border:0;margin:0;text-decoration:none;display:inline-flex}.control .text{-webkit-line-clamp:var(--button-line-clamp,1);text-align:start;-webkit-box-orient:vertical;max-inline-size:100%;display:-webkit-box;overflow:hidden}.control:not(.icon-only){inline-size:100%}.control:not(.disabled){cursor:var(--button-cursor,pointer)}.control.disabled{cursor:not-allowed}.control{user-select:none}.control:not(.stacked).size-super-condensed{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:4px;--_button-chevron-size:10px}.control:not(.stacked).size-super-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-super-condensed:not(.icon-only){padding-inline:8px}.control:not(.stacked).size-condensed{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:8px;--_button-chevron-size:12px}.control:not(.stacked).size-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-condensed:not(.icon-only){padding-inline:12px}.control:not(.stacked).size-expanded{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));font:var(--vvd-typography-base-extended-bold);--_button-icon-gap:10px;--_button-chevron-size:16px}.control:not(.stacked).size-expanded.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-expanded:not(.icon-only){padding-inline:20px}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed){--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));font:var(--vvd-typography-base-bold);--_button-icon-gap:8px;--_button-chevron-size:16px}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed).icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed):not(.icon-only){padding-inline:16px}.control:not(.shape-pill){--_button-border-radius:8px}.control:not(.shape-pill).size-condensed:not(.stacked),.control:not(.shape-pill).size-super-condensed:not(.stacked){--_button-border-radius:4px}.control.shape-pill:not(.icon-only,.stacked.size-super-condensed,.stacked.size-condensed,.stacked.normal){--_button-border-radius:24px}.control.shape-pill.stacked.size-condensed,.control.shape-pill.stacked.size-super-condensed{--_button-border-radius:16px}.control.shape-pill.stacked.size-normal{--_button-border-radius:20px}.control.shape-pill.icon-only{--_button-border-radius:50%}.control.stacked.size-super-condensed{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));--_button-block-size:calc(var(--stacked-size) + 20px);font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:4px;--_button-chevron-size:10px}.control.stacked.size-super-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-super-condensed:not(.icon-only){padding-inline:16px}.control.stacked.size-condensed{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));--_button-block-size:calc(var(--stacked-size) + 24px);font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:6px;--_button-chevron-size:12px}.control.stacked.size-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-condensed:not(.icon-only){padding-inline:12px}.control.stacked.size-expanded{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));--_button-block-size:calc(var(--stacked-size) + 32px);font:var(--vvd-typography-base-extended-bold);--_button-icon-gap:10px;--_button-chevron-size:16px}.control.stacked.size-expanded.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-expanded:not(.icon-only){padding-inline:20px}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed){--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));--_button-block-size:calc(var(--stacked-size) + 28px);font:var(--vvd-typography-base-bold);--_button-icon-gap:8px;--_button-chevron-size:16px}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed).icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed):not(.icon-only){padding-inline:16px}.control.appearance-filled{--focus-stroke-gap-color:transparent}.control.appearance-filled:focus-visible{outline:none;position:relative}.control.appearance-filled:focus-visible: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%)}.control:not(.appearance-filled):focus-visible{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))}slot[name=icon]{line-height:1}.icon-trailing slot[name=icon]{order:1;display:flex}.control.stacked slot[name=icon]{font-size:calc(var(--stacked-size) / 2)}.control:not(.stacked) slot[name=icon]{font-size:calc(var(--_button-block-size) / 2)}.chevron{font-size:var(--_button-chevron-size)}.content{justify-content:center;align-items:center;gap:var(--_button-icon-gap);flex:1;display:flex;overflow:hidden}.control.stacked .content{flex-direction:column}:host([dropdown-indicator]) .content{justify-content:var(--button-content-alignment,flex-start);text-align:start}:host([dropdown-indicator][stacked]) .content{align-items:var(--button-content-alignment,flex-start);justify-content:center}.pending-no-icon{position:absolute}.pending-no-icon+.text{visibility:hidden}:host([icon-trailing][pending]) .pending{order:1}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}", T = (e) => {
+	let t = e.tagFor(d);
+	return r`<${t} class="chevron" aria-hidden="true" name="chevron-down-line"></${t}>`;
+};
+//#endregion
+//#region src/lib/button/button.template.ts
+function E(e) {
+	let t = S.parse(e.appearance);
+	if (e.pressed) {
+		if (t === "ghost") return "subtle";
+		if (t === "ghost-light") return "subtle-light";
+		if (t === "outlined") return "filled";
+	}
+	return t;
+}
+var D = (e) => l("control", `connotation-${x.parse(e.connotation)}`, `appearance-${E(e)}`, "with-idle", "with-hover", "with-active", "with-disabled", ["disabled", e.disabled || e.pending], [`shape-${e.shape}`, !!e.shape], [`size-${e.size}`, !!e.size], ["icon-only", !e.label && !!(e.icon || e.iconSlottedContent?.length) && !e.dropdownIndicator], ["icon-trailing", e.iconTrailing], ["stacked", e.stacked], ["active", e.ariaExpanded === "true" || e.active]);
+function O(e, t, n, i = s.Normal) {
+	if (n && i != s.SuperCondensed) {
+		let n = e.tagFor(h), a = {
+			[s.Condensed]: "-6",
+			[s.Normal]: "-5",
+			[s.Expanded]: "-4"
+		};
+		return r`<span class="${(e) => {
+			let n = e.querySelector("[slot=\"icon\"]");
+			return l("icon", "pending", ["pending-no-icon", !(t || n)]);
+		}}" aria-hidden="true"><${n} size="${a[i]}"></${n}></span>`;
+	}
+	return f(e)(t, p.Slot);
+}
+var k = (e) => [
+	"submit",
+	"button",
+	"reset"
+].indexOf(e) > -1 ? e : "submit", A = (e) => {
+	let t = T(e);
+	return r`<span class="content">
+			${(t) => O(e, t.icon, t.pending, t.size)}
+			${o((e) => e.label, r`<span class="text" aria-hidden="true">${(e) => e.label}</span>`)}
+			<span class="sr-only"
+				>${(e) => e.pending ? e.locale.button.pendingLabel : e.ariaLabel ?? e.label}</span
+			>
+		</span>
+		${o((e) => e.dropdownIndicator, t)}`;
+};
+function j(e) {
+	return r` <button
+		class="${D}"
+		?autofocus="${(e) => e.autofocus}"
+		form="${(e) => e.formId}"
+		formaction="${(e) => e.formaction}"
+		formenctype="${(e) => e.formenctype}"
+		formmethod="${(e) => e.formmethod}"
+		formnovalidate="${(e) => e.formnovalidate}"
+		formtarget="${(e) => e.formtarget}"
+		name="${(e) => e.name}"
+		type="${(e) => k(e.type)}"
+		value="${(e) => e.value}"
+		title="${(e) => e.title}"
+		${_({
+		ariaLabel: null,
+		ariaDisabled: (e) => e.disabled || e.pending,
+		ariaPressed: (e) => e.pressed ? "true" : e.ariaPressed ?? null
+	})}
+		${a("control")}
+		@click="${(e, t) => e.clickHandler(t.event)}"
 	>
-		${i((e) => typeof e.value == "number", n`
-				<svg class="progress" viewBox="0 0 16 16">
-					<circle class="background" cx="8px" cy="8px" r="7px"></circle>
-					<circle
-						class="determinate"
-						style="stroke-dasharray: ${(e) => f * e.percentComplete / 100}px ${f}px"
-						cx="8px"
-						cy="8px"
-						r="7px"
-					></circle>
-				</svg>
-			`)}
-		${i((e) => typeof e.value != "number", n`
-				<svg class="progress" viewBox="0 0 16 16">
-					<circle class="background" cx="8px" cy="8px" r="7px"></circle>
-					<circle
-						class="indeterminate-indicator-1"
-						cx="8px"
-						cy="8px"
-						r="7px"
-					></circle>
-				</svg>
-			`)}
-	</div>
-</template>`, [], { styles: u }), m = e(p);
+		${A(e)}
+	</button>`;
+}
+function M(e) {
+	return r`${(t) => t._renderLinkElement(A(e), D, { ariaLabel: null })}`;
+}
+//#endregion
+//#region src/lib/button/definition.ts
+var N = i("button", C, (e) => r` <template>
+		${o((e) => !e.href, r`${j(e)}`)}
+		${o((e) => e.href, M(e))}
+	</template>`, [u, g], {
+	styles: w,
+	shadowOptions: { delegatesFocus: !0 }
+}), P = t(N);
 //#endregion
-export { m as n, d as r, p as t };
+export { C as i, P as n, T as r, N as t };

package/bundled/definition6.cjs

@@ -1,29 +1,6 @@
-const e=require(`./localized.cjs`),t=require(`./vivid-element.cjs`),n=require(`./ref.cjs`),r=require(`./when.cjs`),i=require(`./enums.cjs`),a=require(`./decorate.cjs`),o=require(`./class-names.cjs`),s=require(`./definition3.cjs`),c=require(`./affix.cjs`),l=require(`./definition5.cjs`),u=require(`./delegates-aria.cjs`),d=require(`./button.cjs`),f=require(`./linkable.cjs`);var p=class extends c.n(e.t(f.t(d.t))){constructor(){super(),this.stacked=!1,this.pending=!1,this.dropdownIndicator=!1,this.active=!1,this.pressed=!1,this.title=``}clickHandler(e){if(this.disabled||this.pending){e.preventDefault(),e.stopImmediatePropagation();return}return!0}};a.t([t.m({converter:{fromView:e=>e||null,toView:e=>e||null}})],p.prototype,`title`,void 0),a.t([t.m],p.prototype,`connotation`,void 0),a.t([t.m],p.prototype,`shape`,void 0),a.t([t.m],p.prototype,`appearance`,void 0),a.t([t.m],p.prototype,`size`,void 0),a.t([t.m({mode:`boolean`,attribute:`stacked`})],p.prototype,`stacked`,void 0),a.t([t.m({mode:`boolean`,attribute:`pending`})],p.prototype,`pending`,void 0),a.t([t.m({mode:`boolean`,attribute:`dropdown-indicator`})],p.prototype,`dropdownIndicator`,void 0),a.t([t.m({mode:`boolean`,attribute:`active`})],p.prototype,`active`,void 0),a.t([t.m({mode:`boolean`,attribute:`pressed`})],p.prototype,`pressed`,void 0),a.t([t.m],p.prototype,`label`,void 0);var m=`.chevron{font:var(--vvd-typography-base-extended);flex-shrink:0;display:flex;transform:rotate(0)}@media (prefers-reduced-motion:no-preference){.chevron{transition:transform .2s}}:host([data-expanded=true]) .chevron,:host([open]) .chevron{transform:rotate(180deg)}:host{--_vvd-button-accent-firm-wrapper:var(--vvd-button-accent-firm);--_vvd-button-cta-firm-wrapper:var(--vvd-button-cta-firm);--_vvd-button-success-firm-wrapper:var(--vvd-button-success-firm);--_vvd-button-alert-firm-wrapper:var(--vvd-button-alert-firm);--_vvd-button-announcement-firm-wrapper:var(--vvd-button-announcement-firm)}.control:not(.appearance-ghost-light,.appearance-filled,.appearance-outlined){--vvd-button-accent-firm:var(--_vvd-button-accent-firm-wrapper,var(--vvd-button-accent-primary));--vvd-button-cta-firm:var(--_vvd-button-cta-firm-wrapper,var(--vvd-button-cta-primary));--vvd-button-success-firm:var(--_vvd-button-success-firm-wrapper,var(--vvd-button-success-primary));--vvd-button-alert-firm:var(--_vvd-button-alert-firm-wrapper,var(--vvd-button-alert-primary));--vvd-button-announcement-firm:var(--_vvd-button-announcement-firm-wrapper,var(--vvd-button-announcement-primary))}:host{display:inline-block}.control.connotation-cta{--_connotation-color-primary:var(--vvd-button-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-button-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-contrast:var(--vvd-button-cta-contrast,var(--vvd-color-cta-800));--_connotation-color-fierce:var(--vvd-button-cta-fierce,var(--vvd-color-cta-700));--_connotation-color-firm:var(--vvd-button-cta-firm,var(--vvd-color-cta-600));--_connotation-color-soft:var(--vvd-button-cta-soft,var(--vvd-color-cta-100));--_connotation-color-faint:var(--vvd-button-cta-faint,var(--vvd-color-cta-50));--_connotation-color-fierce-primary:var(--vvd-button-cta-fierce-primary,var(--vvd-color-cta-700));--_connotation-color-dim:var(--vvd-button-cta-dim,var(--vvd-color-cta-200));--_connotation-color-pale:var(--vvd-button-cta-pale,var(--vvd-color-cta-300))}.control.connotation-success{--_connotation-color-primary:var(--vvd-button-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-button-success-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-success-primary-increment,var(--vvd-color-success-600));--_connotation-color-contrast:var(--vvd-button-success-contrast,var(--vvd-color-success-800));--_connotation-color-fierce:var(--vvd-button-success-fierce,var(--vvd-color-success-700));--_connotation-color-firm:var(--vvd-button-success-firm,var(--vvd-color-success-600));--_connotation-color-soft:var(--vvd-button-success-soft,var(--vvd-color-success-100));--_connotation-color-faint:var(--vvd-button-success-faint,var(--vvd-color-success-50));--_connotation-color-fierce-primary:var(--vvd-button-success-fierce-primary,var(--vvd-color-success-700));--_connotation-color-dim:var(--vvd-button-success-dim,var(--vvd-color-success-200));--_connotation-color-pale:var(--vvd-button-success-pale,var(--vvd-color-success-300))}.control.connotation-alert{--_connotation-color-primary:var(--vvd-button-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-button-alert-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-alert-primary-increment,var(--vvd-color-alert-600));--_connotation-color-contrast:var(--vvd-button-alert-contrast,var(--vvd-color-alert-800));--_connotation-color-fierce:var(--vvd-button-alert-fierce,var(--vvd-color-alert-700));--_connotation-color-firm:var(--vvd-button-alert-firm,var(--vvd-color-alert-600));--_connotation-color-soft:var(--vvd-button-alert-soft,var(--vvd-color-alert-100));--_connotation-color-faint:var(--vvd-button-alert-faint,var(--vvd-color-alert-50));--_connotation-color-fierce-primary:var(--vvd-button-alert-fierce-primary,var(--vvd-color-alert-700));--_connotation-color-dim:var(--vvd-button-alert-dim,var(--vvd-color-alert-200));--_connotation-color-pale:var(--vvd-button-alert-pale,var(--vvd-color-alert-300))}.control.connotation-announcement{--_connotation-color-primary:var(--vvd-button-announcement-primary,var(--vvd-color-announcement-500));--_connotation-color-primary-text:var(--vvd-button-announcement-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-announcement-primary-increment,var(--vvd-color-announcement-600));--_connotation-color-contrast:var(--vvd-button-announcement-contrast,var(--vvd-color-announcement-800));--_connotation-color-fierce:var(--vvd-button-announcement-fierce,var(--vvd-color-announcement-700));--_connotation-color-firm:var(--vvd-button-announcement-firm,var(--vvd-color-announcement-600));--_connotation-color-soft:var(--vvd-button-announcement-soft,var(--vvd-color-announcement-100));--_connotation-color-faint:var(--vvd-button-announcement-faint,var(--vvd-color-announcement-50));--_connotation-color-fierce-primary:var(--vvd-button-announcement-fierce-primary,var(--vvd-color-announcement-700));--_connotation-color-dim:var(--vvd-button-announcement-dim,var(--vvd-color-announcement-200));--_connotation-color-pale:var(--vvd-button-announcement-pale,var(--vvd-color-announcement-300))}.control:not(.connotation-cta,.connotation-success,.connotation-alert,.connotation-announcement){--_connotation-color-primary:var(--vvd-button-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-button-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-contrast:var(--vvd-button-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-fierce:var(--vvd-button-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-firm:var(--vvd-button-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-soft:var(--vvd-button-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-faint:var(--vvd-button-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-fierce-primary:var(--vvd-button-accent-fierce-primary,var(--vvd-color-canvas-text));--_connotation-color-dim:var(--vvd-button-accent-dim,var(--vvd-color-neutral-200));--_connotation-color-pale:var(--vvd-button-accent-pale,var(--vvd-color-neutral-300))}.control.appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.control.appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control,.control.appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control.appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control.appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 85%);--_appearance-color-outline:transparent}@media (hover:hover){.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 75%);--_appearance-color-outline:transparent}}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 75%);--_appearance-color-outline:transparent}.control:disabled.appearance-filled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control:disabled.appearance-outlined{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:disabled,.control:disabled.appearance-ghost-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control:disabled.appearance-outlined-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:disabled.appearance-subtle,.control:disabled.appearance-subtle-light,.control.disabled.appearance-filled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control.disabled.appearance-outlined{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.disabled,.control.disabled.appearance-ghost-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control.disabled.appearance-outlined-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.disabled.appearance-subtle,.control.disabled.appearance-subtle-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-fierce);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:active:where(:not(.disabled,:disabled)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 65%);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-fierce);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.active:where(:not(.disabled,:disabled)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 65%);--_appearance-color-outline:transparent}.control{--focus-stroke-gap-color:transparent;box-sizing:border-box;border-radius:var(--_button-border-radius);background-color:var(--_appearance-color-fill);block-size:var(--_button-block-size);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);justify-content:space-between;align-items:center;gap:var(--_button-icon-gap);vertical-align:middle;border:0;margin:0;text-decoration:none;display:inline-flex}.control .text{-webkit-line-clamp:var(--button-line-clamp,1);text-align:start;-webkit-box-orient:vertical;max-inline-size:100%;display:-webkit-box;overflow:hidden}.control:not(.icon-only){inline-size:100%}.control:not(.disabled){cursor:var(--button-cursor,pointer)}.control.disabled{cursor:not-allowed}.control{user-select:none}.control:not(.stacked).size-super-condensed{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:4px;--_button-chevron-size:10px}.control:not(.stacked).size-super-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-super-condensed:not(.icon-only){padding-inline:8px}.control:not(.stacked).size-condensed{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:8px;--_button-chevron-size:12px}.control:not(.stacked).size-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-condensed:not(.icon-only){padding-inline:12px}.control:not(.stacked).size-expanded{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));font:var(--vvd-typography-base-extended-bold);--_button-icon-gap:10px;--_button-chevron-size:16px}.control:not(.stacked).size-expanded.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-expanded:not(.icon-only){padding-inline:20px}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed){--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));font:var(--vvd-typography-base-bold);--_button-icon-gap:8px;--_button-chevron-size:16px}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed).icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed):not(.icon-only){padding-inline:16px}.control:not(.shape-pill){--_button-border-radius:8px}.control:not(.shape-pill).size-condensed:not(.stacked),.control:not(.shape-pill).size-super-condensed:not(.stacked){--_button-border-radius:4px}.control.shape-pill:not(.icon-only,.stacked.size-super-condensed,.stacked.size-condensed,.stacked.normal){--_button-border-radius:24px}.control.shape-pill.stacked.size-condensed,.control.shape-pill.stacked.size-super-condensed{--_button-border-radius:16px}.control.shape-pill.stacked.size-normal{--_button-border-radius:20px}.control.shape-pill.icon-only{--_button-border-radius:50%}.control.stacked.size-super-condensed{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));--_button-block-size:calc(var(--stacked-size) + 20px);font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:4px;--_button-chevron-size:10px}.control.stacked.size-super-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-super-condensed:not(.icon-only){padding-inline:16px}.control.stacked.size-condensed{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));--_button-block-size:calc(var(--stacked-size) + 24px);font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:6px;--_button-chevron-size:12px}.control.stacked.size-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-condensed:not(.icon-only){padding-inline:12px}.control.stacked.size-expanded{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));--_button-block-size:calc(var(--stacked-size) + 32px);font:var(--vvd-typography-base-extended-bold);--_button-icon-gap:10px;--_button-chevron-size:16px}.control.stacked.size-expanded.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-expanded:not(.icon-only){padding-inline:20px}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed){--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));--_button-block-size:calc(var(--stacked-size) + 28px);font:var(--vvd-typography-base-bold);--_button-icon-gap:8px;--_button-chevron-size:16px}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed).icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed):not(.icon-only){padding-inline:16px}.control.appearance-filled{--focus-stroke-gap-color:transparent}.control.appearance-filled:focus-visible{outline:none;position:relative}.control.appearance-filled:focus-visible: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%)}.control:not(.appearance-filled):focus-visible{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))}slot[name=icon]{line-height:1}.icon-trailing slot[name=icon]{order:1;display:flex}.control.stacked slot[name=icon]{font-size:calc(var(--stacked-size) / 2)}.control:not(.stacked) slot[name=icon]{font-size:calc(var(--_button-block-size) / 2)}.chevron{font-size:var(--_button-chevron-size)}.content{justify-content:center;align-items:center;gap:var(--_button-icon-gap);flex:1;display:flex;overflow:hidden}.control.stacked .content{flex-direction:column}:host([dropdown-indicator]) .content{justify-content:var(--button-content-alignment,flex-start);text-align:start}:host([dropdown-indicator][stacked]) .content{align-items:var(--button-content-alignment,flex-start);justify-content:center}.pending-no-icon{position:absolute}.pending-no-icon+.text{visibility:hidden}:host([icon-trailing][pending]) .pending{order:1}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}`,h=e=>{let n=e.tagFor(s.r);return t.p`<${n} class="chevron" aria-hidden="true" name="chevron-down-line"></${n}>`};function g(e,t){let n=e??`ghost`;if(t){if(n===`ghost`)return`subtle`;if(n===`ghost-light`)return`subtle-light`;if(n===`outlined`)return`filled`}return n}var _=e=>o.t(`control`,[`connotation-${e.connotation}`,!!e.connotation],`appearance-${g(e.appearance,e.pressed)}`,[`disabled`,e.disabled||e.pending],[`shape-${e.shape}`,!!e.shape],[`size-${e.size}`,!!e.size],[`icon-only`,!e.label&&!!(e.icon||e.iconSlottedContent?.length)&&!e.dropdownIndicator],[`icon-trailing`,e.iconTrailing],[`stacked`,e.stacked],[`active`,e.ariaExpanded===`true`||e.active]);function v(e,n,r,a=i.a.Normal){if(r&&a!=i.a.SuperCondensed){let r=e.tagFor(l.r),s={[i.a.Condensed]:`-6`,[i.a.Normal]:`-5`,[i.a.Expanded]:`-4`};return t.p`<span class="${e=>{let t=e.querySelector(`[slot="icon"]`);return o.t(`icon`,`pending`,[`pending-no-icon`,!(n||t)])}}" aria-hidden="true"><${r} size="${s[a]}"></${r}></span>`}else return c.a(e)(n,c.i.Slot)}var y=e=>[`submit`,`button`,`reset`].indexOf(e)>-1?e:`submit`,b=e=>{let n=h(e);return t.p`<span class="content">
-			${t=>v(e,t.icon,t.pending,t.size)}
-			${r.t(e=>e.label,t.p`<span class="text" aria-hidden="true">${e=>e.label}</span>`)}
-			<span class="sr-only"
-				>${e=>e.pending?e.locale.button.pendingLabel:e.ariaLabel??e.label}</span
-			>
-		</span>
-		${r.t(e=>e.dropdownIndicator,n)}`};function x(e){return t.p` <button
-		class="${_}"
-		?autofocus="${e=>e.autofocus}"
-		form="${e=>e.formId}"
-		formaction="${e=>e.formaction}"
-		formenctype="${e=>e.formenctype}"
-		formmethod="${e=>e.formmethod}"
-		formnovalidate="${e=>e.formnovalidate}"
-		formtarget="${e=>e.formtarget}"
-		name="${e=>e.name}"
-		type="${e=>y(e.type)}"
-		value="${e=>e.value}"
-		title="${e=>e.title}"
-		${u.n({ariaLabel:null,ariaDisabled:e=>e.disabled||e.pending,ariaPressed:e=>e.pressed?`true`:e.ariaPressed??null})}
-		${n.t(`control`)}
-		@click="${(e,t)=>e.clickHandler(t.event)}"
-	>
-		${b(e)}
-	</button>`}function S(e){return t.p`${t=>t._renderLinkElement(b(e),_,{ariaLabel:null})}`}var C=t.u(`button`,p,e=>t.p` <template>
-		${r.t(e=>!e.href,t.p`${x(e)}`)}
-		${r.t(e=>e.href,S(e))}
-	</template>`,[s.t,l.t],{styles:m,shadowOptions:{delegatesFocus:!0}}),w=t.d(C);Object.defineProperty(exports,`i`,{enumerable:!0,get:function(){return p}}),Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return w}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return h}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return C}});
+const e=require("./vivid-element.cjs"),t=require("./decorate.cjs"),n=require("./class-names.cjs");var r=class extends e.t{};t.t([e.m],r.prototype,`dp`,void 0),t.t([e.m({attribute:`no-shadow`,mode:`boolean`})],r.prototype,`noShadow`,void 0),t.t([e.m({attribute:`not-relative`,mode:`boolean`})],r.prototype,`notRelative`,void 0);var i=`:host,.control{display:contents}.control.dp-0{--_elevation-fill:var(--_vvd-tinted-color-surface-0dp,var(--vvd-color-surface-0dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-0dp,var(--vvd-shadow-surface-0dp))}.control.dp-4{--_elevation-fill:var(--_vvd-tinted-color-surface-4dp,var(--vvd-color-surface-4dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-4dp,var(--vvd-shadow-surface-4dp))}.control.dp-8{--_elevation-fill:var(--_vvd-tinted-color-surface-8dp,var(--vvd-color-surface-8dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-8dp,var(--vvd-shadow-surface-8dp))}.control.dp-12{--_elevation-fill:var(--_vvd-tinted-color-surface-12dp,var(--vvd-color-surface-12dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-12dp,var(--vvd-shadow-surface-12dp))}.control.dp-16{--_elevation-fill:var(--_vvd-tinted-color-surface-16dp,var(--vvd-color-surface-16dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-16dp,var(--vvd-shadow-surface-16dp))}.control.dp-24{--_elevation-fill:var(--_vvd-tinted-color-surface-24dp,var(--vvd-color-surface-24dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-24dp,var(--vvd-shadow-surface-24dp))}.control:not(.dp-0,.dp-4,.dp-8,.dp-12,.dp-16,.dp-24){--_elevation-fill:var(--_vvd-tinted-color-surface-2dp,var(--vvd-color-surface-2dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-2dp,var(--vvd-shadow-surface-2dp))}.control ::slotted(*){isolation:isolate}.control ::slotted(*):before{z-index:-1;border-radius:inherit;background:var(--_elevation-fill);content:"";block-size:100%;filter:var(--_elevation-shadow);inline-size:100%;transition:background-color .15s linear,filter .15s linear;position:absolute;inset-block-start:0;inset-inline-start:0}.control:not(.not-relative) ::slotted(*){position:relative}.control.no-shadow ::slotted(*):before{filter:none}`,a=e.p` <div
+	class="${e=>n.t(`control`,[`dp-${e.dp}`,!!e.dp],[`no-shadow`,!!e.noShadow],[`not-relative`,!!e.notRelative])}"
+	part="base"
+>
+	<slot></slot>
+</div>`,o=e.u(`elevation`,r,a,[],{styles:i}),s=e.d(o);Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return s}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return r}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return o}});