@vonage/vivid 5.16.0 → 5.17.0

package/calendar/index.js

@@ -1,8 +1,8 @@
 import { O as e, d as t, l as n, o as r, s as i, t as a } from "../bundled/vivid-element.js";
 import { n as o } from "../bundled/repeat.js";
-import { t as s } from "../bundled/decorate.js";
-import { t as c } from "../bundled/class-names.js";
-import { o as l } from "../bundled/enums.js";
+import { o as s } from "../bundled/enums.js";
+import { t as c } from "../bundled/decorate.js";
+import { t as l } from "../bundled/class-names.js";
 import { t as u } from "../bundled/calendar-event.js";
 //#region src/lib/calendar/calendar.scss?inline
 var d = ":host{block-size:inherit;max-block-size:inherit;display:block;overflow:auto}ol{margin:0;padding:0;list-style:none}[role=grid i]{z-index:0;grid-template-columns:min-content auto;grid-template-areas:\"filler column-headers\"\"row-headers calendar\";inline-size:max(100%,500px);min-inline-size:880px;margin:auto;display:grid;position:relative}.row-headers{grid-area:row-headers;grid-template-rows:repeat(24,1fr);margin-inline-end:2px;display:grid}.row-headers>[role=rowheader i]{justify-content:flex-end;align-items:flex-end;display:flex}.row-headers>[role=rowheader i]>time{font:var(--vvd-typography-base-condensed);text-transform:uppercase;white-space:nowrap;font-size:small;line-height:1}.sticky-column .row-headers,.sticky-all .row-headers{z-index:1;background-color:var(--calendar-column-background-color,var(--vvd-color-canvas));margin-inline-end:3px;position:sticky;inset-inline-start:0}.calendar-row{display:contents}.calendar-grid-presentation{background:var(--vvd-color-surface-2dp);counter-reset:listing;filter:var(--vvd-shadow-surface-2dp);border-radius:8px;grid-template:repeat(24,1fr)/repeat(7,1fr);grid-area:calendar;grid-auto-flow:column;gap:1px;display:grid;overflow:hidden}.hours{display:contents}.hours>[role=listitem i]{grid-column:1/8;grid-row:var(--row);min-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));pointer-events:none;position:relative}.hours>[role=listitem i]:not(:first-child):after{border-block-end:var(--vvd-color-neutral-100) 1px solid;content:\"\";inline-size:100%;margin-block-start:-1px;position:absolute}.hours>[role=listitem i]:nth-child(24n+1){--row:1}.hours>[role=listitem i]:nth-child(24n+2){--row:2}.hours>[role=listitem i]:nth-child(24n+3){--row:3}.hours>[role=listitem i]:nth-child(24n+4){--row:4}.hours>[role=listitem i]:nth-child(24n+5){--row:5}.hours>[role=listitem i]:nth-child(24n+6){--row:6}.hours>[role=listitem i]:nth-child(24n+7){--row:7}.hours>[role=listitem i]:nth-child(24n+8){--row:8}.hours>[role=listitem i]:nth-child(24n+9){--row:9}.hours>[role=listitem i]:nth-child(24n+10){--row:10}.hours>[role=listitem i]:nth-child(24n+11){--row:11}.hours>[role=listitem i]:nth-child(24n+12){--row:12}.hours>[role=listitem i]:nth-child(24n+13){--row:13}.hours>[role=listitem i]:nth-child(24n+14){--row:14}.hours>[role=listitem i]:nth-child(24n+15){--row:15}.hours>[role=listitem i]:nth-child(24n+16){--row:16}.hours>[role=listitem i]:nth-child(24n+17){--row:17}.hours>[role=listitem i]:nth-child(24n+18){--row:18}.hours>[role=listitem i]:nth-child(24n+19){--row:19}.hours>[role=listitem i]:nth-child(24n+20){--row:20}.hours>[role=listitem i]:nth-child(24n+21){--row:21}.hours>[role=listitem i]:nth-child(24n+22){--row:22}.hours>[role=listitem i]:nth-child(24n+23){--row:23}.hours>[role=listitem i]:nth-child(24n+24){--row:24}[role=gridcell i]{grid-auto-flow:column;gap:1px;display:grid}[role=gridcell i],[role=columnheader i],[role=columnheader i] [role=button i]{position:relative}[role=gridcell i]:before,[role=columnheader i]:before,[role=columnheader i] [role=button i]:before{z-index:-1;background-color:var(--vvd-color-information-400);content:\"\";position:absolute;inset:0}[role=gridcell i]:focus,[role=columnheader i]:focus,[role=columnheader i] [role=button i]:focus{outline:none}[role=gridcell i]:not(:focus-visible):before,[role=columnheader i]:not(:focus-visible):before,[role=columnheader i] [role=button i]:not(:focus-visible):before{display:none}.columns{display:contents}.columns>[role=gridcell i]{grid-column:var(--column);grid-row:1/25;position:relative}.columns>[role=gridcell i]:first-child{--column:1}.columns>[role=gridcell i]:nth-child(2){--column:2}.columns>[role=gridcell i]:nth-child(3){--column:3}.columns>[role=gridcell i]:nth-child(4){--column:4}.columns>[role=gridcell i]:nth-child(5){--column:5}.columns>[role=gridcell i]:nth-child(6){--column:6}.columns>[role=gridcell i]:nth-child(7){--column:7}.columns>[role=gridcell i]:not(:first-child):after{border-inline-end:var(--vvd-color-neutral-100) 1px solid;content:\"\";block-size:100%;margin-inline-start:-1px;position:absolute}.column-headers{grid-area:column-headers;grid-template-columns:repeat(7,1fr);display:grid}.column-headers [role=columnheader i] h2{font:var(--vvd-typography-heading-4);grid-template-columns:1fr auto 1fr;align-items:baseline;margin:0;display:grid}.column-headers [role=columnheader i] h2>em{font:inherit;inline-size:min-content;inset-inline-start:0}.column-headers [role=columnheader i] h2>small{font:var(--vvd-typography-base-condensed);text-transform:uppercase}.sticky-header .column-headers,.sticky-all .column-headers{z-index:1;background-color:var(--calendar-header-background-color,var(--vvd-color-canvas));margin-block-end:3px;position:sticky;inset-block-start:0}.filler{background-color:#0000;grid-area:filler}.sticky-header .filler,.sticky-all .filler,.sticky-column .filler{z-index:2;background-color:var(--calendar-header-background-color,var(--vvd-color-canvas));margin-block-end:3px;position:sticky}.sticky-column .filler{inset-inline-start:0}.sticky-header .filler{inset-block-start:0}.sticky-all .filler{inset-block-start:0;inset-inline-start:0}", f = "ArrowUp", p = "ArrowRight", m = "ArrowDown", h = "ArrowLeft";
@@ -28,215 +28,8 @@ function y(e, t) {
 	return this.shadowRoot.querySelector(`[role="gridcell"i]:nth-child(${i + 1})`);
 }
 //#endregion
-//#region ../../node_modules/.pnpm/ramda@0.32.0/node_modules/ramda/es/internal/_isPlaceholder.js
-function b(e) {
-	return typeof e == "object" && !!e && e["@@functional/placeholder"] === !0;
-}
-//#endregion
-//#region ../../node_modules/.pnpm/ramda@0.32.0/node_modules/ramda/es/internal/_curry1.js
-function x(e) {
-	return function t(n) {
-		return arguments.length === 0 || b(n) ? t : e.apply(this, arguments);
-	};
-}
-//#endregion
-//#region ../../node_modules/.pnpm/ramda@0.32.0/node_modules/ramda/es/internal/_curry2.js
-function S(e) {
-	return function t(n, r) {
-		switch (arguments.length) {
-			case 0: return t;
-			case 1: return b(n) ? t : x(function(t) {
-				return e(n, t);
-			});
-			default: return b(n) && b(r) ? t : b(n) ? x(function(t) {
-				return e(t, r);
-			}) : b(r) ? x(function(t) {
-				return e(n, t);
-			}) : e(n, r);
-		}
-	};
-}
-//#endregion
-//#region ../../node_modules/.pnpm/ramda@0.32.0/node_modules/ramda/es/internal/_isArray.js
-var C = Array.isArray || function(e) {
-	return e != null && e.length >= 0 && Object.prototype.toString.call(e) === "[object Array]";
-};
-//#endregion
-//#region ../../node_modules/.pnpm/ramda@0.32.0/node_modules/ramda/es/internal/_arrayFromIterator.js
-function w(e) {
-	for (var t = [], n; !(n = e.next()).done;) t.push(n.value);
-	return t;
-}
-//#endregion
-//#region ../../node_modules/.pnpm/ramda@0.32.0/node_modules/ramda/es/internal/_includesWith.js
-function T(e, t, n) {
-	for (var r = 0, i = n.length; r < i;) {
-		if (e(t, n[r])) return !0;
-		r += 1;
-	}
-	return !1;
-}
-//#endregion
-//#region ../../node_modules/.pnpm/ramda@0.32.0/node_modules/ramda/es/internal/_functionName.js
-function E(e) {
-	var t = String(e).match(/^function (\w*)/);
-	return t == null ? "" : t[1];
-}
-//#endregion
-//#region ../../node_modules/.pnpm/ramda@0.32.0/node_modules/ramda/es/internal/_has.js
-function D(e, t) {
-	return Object.prototype.hasOwnProperty.call(t, e);
-}
-//#endregion
-//#region ../../node_modules/.pnpm/ramda@0.32.0/node_modules/ramda/es/internal/_objectIs.js
-function O(e, t) {
-	return e === t ? e !== 0 || 1 / e == 1 / t : e !== e && t !== t;
-}
-var k = typeof Object.is == "function" ? Object.is : O, A = Object.prototype.toString, j = /* @__PURE__ */ function() {
-	return A.call(arguments) === "[object Arguments]" ? function(e) {
-		return A.call(e) === "[object Arguments]";
-	} : function(e) {
-		return D("callee", e);
-	};
-}(), M = !/* @__PURE__ */ { toString: null }.propertyIsEnumerable("toString"), N = [
-	"constructor",
-	"valueOf",
-	"isPrototypeOf",
-	"toString",
-	"propertyIsEnumerable",
-	"hasOwnProperty",
-	"toLocaleString"
-], P = /* @__PURE__ */ function() {
-	return arguments.propertyIsEnumerable("length");
-}(), F = function(e, t) {
-	for (var n = 0; n < e.length;) {
-		if (e[n] === t) return !0;
-		n += 1;
-	}
-	return !1;
-}, I = x(typeof Object.keys == "function" && !P ? function(e) {
-	return Object(e) === e ? Object.keys(e) : [];
-} : function(e) {
-	if (Object(e) !== e) return [];
-	var t, n, r = [], i = P && j(e);
-	for (t in e) D(t, e) && (!i || t !== "length") && (r[r.length] = t);
-	if (M) for (n = N.length - 1; n >= 0;) t = N[n], D(t, e) && !F(r, t) && (r[r.length] = t), --n;
-	return r;
-}), L = /* @__PURE__ */ x(function(e) {
-	return e === null ? "Null" : e === void 0 ? "Undefined" : Object.prototype.toString.call(e).slice(8, -1);
-});
-//#endregion
-//#region ../../node_modules/.pnpm/ramda@0.32.0/node_modules/ramda/es/internal/_equals.js
-function R(e, t, n, r) {
-	var i = w(e), a = w(t);
-	function o(e, t) {
-		return z(e, t, n.slice(), r.slice());
-	}
-	return !T(function(e, t) {
-		return !T(o, t, e);
-	}, a, i);
-}
-function z(e, t, n, r) {
-	if (k(e, t)) return !0;
-	var i = L(e);
-	if (i !== L(t)) return !1;
-	if (typeof e["fantasy-land/equals"] == "function" || typeof t["fantasy-land/equals"] == "function") return typeof e["fantasy-land/equals"] == "function" && e["fantasy-land/equals"](t) && typeof t["fantasy-land/equals"] == "function" && t["fantasy-land/equals"](e);
-	if (typeof e.equals == "function" || typeof t.equals == "function") return typeof e.equals == "function" && e.equals(t) && typeof t.equals == "function" && t.equals(e);
-	switch (i) {
-		case "Arguments":
-		case "Array":
-		case "Object":
-			if (typeof e.constructor == "function" && E(e.constructor) === "Promise") return e === t;
-			break;
-		case "Boolean":
-		case "Number":
-		case "String":
-			if (!(typeof e == typeof t && k(e.valueOf(), t.valueOf()))) return !1;
-			break;
-		case "Date":
-			if (!k(e.valueOf(), t.valueOf())) return !1;
-			break;
-		case "Error": return e.name === t.name && e.message === t.message;
-		case "RegExp":
-			if (!(e.source === t.source && e.global === t.global && e.ignoreCase === t.ignoreCase && e.multiline === t.multiline && e.sticky === t.sticky && e.unicode === t.unicode)) return !1;
-			break;
-	}
-	for (var a = n.length - 1; a >= 0;) {
-		if (n[a] === e) return r[a] === t;
-		--a;
-	}
-	switch (i) {
-		case "Map": return e.size === t.size ? R(e.entries(), t.entries(), n.concat([e]), r.concat([t])) : !1;
-		case "Set": return e.size === t.size ? R(e.values(), t.values(), n.concat([e]), r.concat([t])) : !1;
-		case "Arguments":
-		case "Array":
-		case "Object":
-		case "Boolean":
-		case "Number":
-		case "String":
-		case "Date":
-		case "Error":
-		case "RegExp":
-		case "Int8Array":
-		case "Uint8Array":
-		case "Uint8ClampedArray":
-		case "Int16Array":
-		case "Uint16Array":
-		case "Int32Array":
-		case "Uint32Array":
-		case "Float32Array":
-		case "Float64Array":
-		case "ArrayBuffer": break;
-		default: return !1;
-	}
-	var o = I(e);
-	if (o.length !== I(t).length) return !1;
-	var s = n.concat([e]), c = r.concat([t]);
-	for (a = o.length - 1; a >= 0;) {
-		var l = o[a];
-		if (!(D(l, t) && z(t[l], e[l], s, c))) return !1;
-		--a;
-	}
-	return !0;
-}
-//#endregion
-//#region ../../node_modules/.pnpm/ramda@0.32.0/node_modules/ramda/es/equals.js
-var B = /* @__PURE__ */ S(function(e, t) {
-	return z(e, t, [], []);
-});
-//#endregion
-//#region ../../node_modules/.pnpm/ramda@0.32.0/node_modules/ramda/es/internal/_isObject.js
-function V(e) {
-	return Object.prototype.toString.call(e) === "[object Object]";
-}
-//#endregion
-//#region ../../node_modules/.pnpm/ramda@0.32.0/node_modules/ramda/es/internal/_isString.js
-function H(e) {
-	return Object.prototype.toString.call(e) === "[object String]";
-}
-//#endregion
-//#region ../../node_modules/.pnpm/ramda@0.32.0/node_modules/ramda/es/not.js
-var U = /* @__PURE__ */ x(function(e) {
-	return !e;
-});
-//#endregion
-//#region ../../node_modules/.pnpm/ramda@0.32.0/node_modules/ramda/es/internal/_isTypedArray.js
-function W(e) {
-	var t = Object.prototype.toString.call(e);
-	return t === "[object Uint8ClampedArray]" || t === "[object Int8Array]" || t === "[object Uint8Array]" || t === "[object Int16Array]" || t === "[object Uint16Array]" || t === "[object Int32Array]" || t === "[object Uint32Array]" || t === "[object Float32Array]" || t === "[object Float64Array]" || t === "[object BigInt64Array]" || t === "[object BigUint64Array]";
-}
-//#endregion
-//#region ../../node_modules/.pnpm/ramda@0.32.0/node_modules/ramda/es/empty.js
-var G = /* @__PURE__ */ x(function(e) {
-	return e != null && typeof e["fantasy-land/empty"] == "function" ? e["fantasy-land/empty"]() : e != null && e.constructor != null && typeof e.constructor["fantasy-land/empty"] == "function" ? e.constructor["fantasy-land/empty"]() : e != null && typeof e.empty == "function" ? e.empty() : e != null && e.constructor != null && typeof e.constructor.empty == "function" ? e.constructor.empty() : e == Set || e instanceof Set ? /* @__PURE__ */ new Set() : e == Map || e instanceof Map ? /* @__PURE__ */ new Map() : C(e) ? [] : H(e) ? "" : V(e) ? {} : j(e) ? function() {
-		return arguments;
-	}() : W(e) ? e.constructor.from("") : void 0;
-}), K = /* @__PURE__ */ x(function(e) {
-	return e != null && B(e, G(e));
-});
-//#endregion
 //#region src/lib/calendar/helpers/calendar.event-context.ts
-function q(e) {
+function b(e) {
 	let t = e.closest("[role=\"gridcell\"i], [role=\"columnheader\"i]");
 	if (t) {
 		let { parentElement: e } = t;
@@ -244,37 +37,37 @@ function q(e) {
 		if (e) return e.children && Array.from(e.children).indexOf(t);
 	}
 }
-function J(e, t, n) {
+function x(e, t, n) {
 	let r = t.closest("[role=\"rowheader\"], [role=\"gridcell\"i]");
 	if (r) {
 		let t = r.getBoundingClientRect(), i = (e.clientY - t.y) / (t.height / n);
 		return Math.round((i + 2 ** -52) * 100) / 100;
 	}
 }
-var Y = function(e) {
+var S = function(e) {
 	if (!(e instanceof KeyboardEvent || e instanceof MouseEvent)) throw Error("Invalid event. Event must be instance of KeyboardEvent or MouseEvent");
 	let [t] = e.composedPath();
 	if (!(t && t instanceof HTMLElement && this.shadowRoot.contains(t))) throw Error("Invalid event. Event must contain a target object which is a direct descendant of calendar");
-	let n = q(t), r;
-	e instanceof MouseEvent && (r = J(e, t, this._hours));
+	let n = b(t), r;
+	e instanceof MouseEvent && (r = x(e, t, this._hours));
 	let i = {
 		...n != null && { day: n },
 		...r != null && { hour: r }
 	};
-	return U(K(i)) ? i : null;
-}, X = (e) => {
+	return Object.keys(i).length > 0 ? i : null;
+}, C = (e) => {
 	let t = window.getComputedStyle(e).overflowY, n = window.getComputedStyle(e).overflowX;
 	return {
 		vertical: (t === "auto" || t === "scroll") && e.scrollHeight > e.clientHeight,
 		horizontal: (n === "auto" || n === "scroll") && e.scrollWidth > e.clientWidth
 	};
-}, Z = class extends a {
+}, w = class extends a {
 	constructor(...e) {
-		super(...e), this.hour12 = !1, this.stickyMode = l.All, this._hours = 24, this._days = 7, this.hoursAsDatetime = Array.from({ length: this._hours - 1 }).fill(new Date((/* @__PURE__ */ new Date()).setHours(0, 0, 0))).map((e, t) => new Date(e.setHours(++t))), this._generateDaysArr = (e) => {
+		super(...e), this.hour12 = !1, this.stickyMode = s.All, this._hours = 24, this._days = 7, this.hoursAsDatetime = Array.from({ length: this._hours - 1 }).fill(new Date((/* @__PURE__ */ new Date()).setHours(0, 0, 0))).map((e, t) => new Date(e.setHours(++t))), this._generateDaysArr = (e) => {
 			if (e.length == this._days) return e;
 			let t = new Date(e[e.length - 1]);
 			return t.setDate(t.getDate() + 1), this._generateDaysArr([...e, t]);
-		}, this.getEventContext = Y;
+		}, this.getEventContext = S;
 	}
 	get #e() {
 		let { activeElement: e } = document;
@@ -304,34 +97,34 @@ var Y = function(e) {
 		super.connectedCallback(), this.initializeScrollPosition();
 	}
 	initializeScrollPosition() {
-		if (!X(this).vertical) return;
+		if (!C(this).vertical) return;
 		let t = this.scrollHeight / this._hours * 7;
 		e.enqueue(() => {
 			this.scrollTo({ top: t });
 		});
 	}
 };
-s([n], Z.prototype, "datetime", void 0), s([n({ attribute: "start-day" })], Z.prototype, "startDay", void 0), s([n], Z.prototype, "locales", void 0), s([n({ mode: "boolean" })], Z.prototype, "hour12", void 0), s([n({
+c([n], w.prototype, "datetime", void 0), c([n({ attribute: "start-day" })], w.prototype, "startDay", void 0), c([n], w.prototype, "locales", void 0), c([n({ mode: "boolean" })], w.prototype, "hour12", void 0), c([n({
 	attribute: "sticky-mode",
 	mode: "fromView"
-})], Z.prototype, "stickyMode", void 0);
+})], w.prototype, "stickyMode", void 0);
 //#endregion
 //#region src/lib/calendar/helpers/calendar.date-functions.ts
-function Q(e) {
+function T(e) {
 	let t = (e) => `0${e}`.slice(-2);
 	return `${e.getFullYear()}-${t(e.getMonth() + 1)}-${t(e.getDate())}`;
 }
-var $ = new Map([["sunday", 0], ["monday", 1]]);
-function ee(e = /* @__PURE__ */ new Date(), t) {
+var E = new Map([["sunday", 0], ["monday", 1]]);
+function D(e = /* @__PURE__ */ new Date(), t) {
 	e = new Date(e);
-	let n = $.get(t);
+	let n = E.get(t);
 	n ??= 1;
 	let r = e.getDate() - (e.getDay() + 7 - n) % 7;
 	return new Date(e.setDate(r));
 }
 //#endregion
 //#region src/lib/calendar/calendar.template.ts
-var te = ({ stickyMode: e }) => c([`sticky-${e}`, !!e]), ne = () => t` <div class="row-headers" role="row">
+var O = ({ stickyMode: e }) => l([`sticky-${e}`, !!e]), k = () => t` <div class="row-headers" role="row">
 		${o((e) => e.hoursAsDatetime, t`<span role="rowheader">
 				<time
 					datetime="${(e, t) => new Intl.DateTimeFormat(t.parent.locales, {
@@ -346,9 +139,9 @@ var te = ({ stickyMode: e }) => c([`sticky-${e}`, !!e]), ne = () => t` <div clas
 }).format(e)}
 				</time>
 			</span>`)}
-	</div>`, re = () => t` <div class="column-headers" role="row">
-		${o((e) => e._generateDaysArr([ee(e.datetime, e.startDay)]), t` <div role="columnheader" tabindex="-1">
-				<time datetime=${(e) => Q(e)}>
+	</div>`, A = () => t` <div class="column-headers" role="row">
+		${o((e) => e._generateDaysArr([D(e.datetime, e.startDay)]), t` <div role="columnheader" tabindex="-1">
+				<time datetime=${(e) => T(e)}>
 					<h2>
 						<!-- TODO add to column aria-labelledby or describedby to count
                   events and related day e.g. "3 events, Sunday, March 8" -->
@@ -369,29 +162,29 @@ var te = ({ stickyMode: e }) => c([`sticky-${e}`, !!e]), ne = () => t` <div clas
 					</h2>
 				</time>
 			</div>`)}
-	</div>`, ie = t`
+	</div>`, j = t`
 	<div role="gridcell" tabindex="-1">
 		<slot name="day-${(e, t) => t.index}"></slot>
 	</div>
 `;
 //#endregion
 //#region src/lib/calendar/index.ts
-i(r("calendar", Z, t`
+i(r("calendar", w, t`
 	<div
 		role="grid"
-		class="${te}"
+		class="${O}"
 		@keydown=${(e, t) => e.onKeydown(t.event)}
 	>
 		<div class="filler"></div>
-		${re}
+		${A}
 		<div class="calendar-row" role="rowgroup">
-			${ne}
+			${k}
 			<div class="calendar-grid-presentation" role="presentation">
 				<div class="hours" role="list">
 					${o((e) => Array.from({ length: e.hoursAsDatetime.length + 1 }), t` <div role="listitem"></div>`)}
 				</div>
 				<div class="columns" role="row">
-					${o((e) => Array.from(Array(e._days)), ie, { positioning: !0 })}
+					${o((e) => Array.from(Array(e._days)), j, { positioning: !0 })}
 				</div>
 				<slot></slot>
 			</div>

package/calendar-event/index.cjs

@@ -1,8 +1,8 @@
-const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/when.cjs`),n=require(`../bundled/class-names.cjs`),r=require(`../bundled/delegates-aria.cjs`),i=require(`../bundled/calendar-event.cjs`);var a=`:host{display:contents}.base.connotation-accent{--_connotation-color-primary:var(--vvd-calendar-event-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-calendar-event-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-contrast:var(--vvd-calendar-event-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-soft:var(--vvd-calendar-event-accent-soft,var(--vvd-color-neutral-100))}.base.connotation-cta{--_connotation-color-primary:var(--vvd-calendar-event-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-calendar-event-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-contrast:var(--vvd-calendar-event-cta-contrast,var(--vvd-color-cta-800));--_connotation-color-soft:var(--vvd-calendar-event-cta-soft,var(--vvd-color-cta-100))}.base.connotation-success{--_connotation-color-primary:var(--vvd-calendar-event-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-calendar-event-success-primary-text,var(--vvd-color-canvas));--_connotation-color-contrast:var(--vvd-calendar-event-success-contrast,var(--vvd-color-success-800));--_connotation-color-soft:var(--vvd-calendar-event-success-soft,var(--vvd-color-success-100))}.base.connotation-alert{--_connotation-color-primary:var(--vvd-calendar-event-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-calendar-event-alert-primary-text,var(--vvd-color-canvas));--_connotation-color-contrast:var(--vvd-calendar-event-alert-contrast,var(--vvd-color-alert-800));--_connotation-color-soft:var(--vvd-calendar-event-alert-soft,var(--vvd-color-alert-100))}.base.connotation-warning{--_connotation-color-primary:var(--vvd-calendar-event-warning-primary,var(--vvd-color-warning-300));--_connotation-color-primary-text:var(--vvd-calendar-event-warning-primary-text,var(--vvd-color-canvas-text));--_connotation-color-contrast:var(--vvd-calendar-event-warning-contrast,var(--vvd-color-warning-800));--_connotation-color-soft:var(--vvd-calendar-event-warning-soft,var(--vvd-color-warning-100))}.base.connotation-announcement{--_connotation-color-primary:var(--vvd-calendar-event-announcement-primary,var(--vvd-color-announcement-500));--_connotation-color-primary-text:var(--vvd-calendar-event-announcement-primary-text,var(--vvd-color-canvas));--_connotation-color-contrast:var(--vvd-calendar-event-announcement-contrast,var(--vvd-color-announcement-800));--_connotation-color-soft:var(--vvd-calendar-event-announcement-soft,var(--vvd-color-announcement-100))}.base:not(.connotation-accent,.connotation-cta,.connotation-success,.connotation-alert,.connotation-warning,.connotation-announcement){--_connotation-color-primary:var(--vvd-calendar-event-information-primary,var(--vvd-color-information-500));--_connotation-color-primary-text:var(--vvd-calendar-event-information-primary-text,var(--vvd-color-canvas));--_connotation-color-contrast:var(--vvd-calendar-event-information-contrast,var(--vvd-color-information-800));--_connotation-color-soft:var(--vvd-calendar-event-information-soft,var(--vvd-color-information-100))}.base{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.base.appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.base{--vvd-calendar-event--indent:calc(0px + var(--vvd-calendar-event--overlap-count,0) * 8px);--focus-stroke-gap-color:transparent;z-index:var(--vvd-calendar-event--overlap-count);top:calc(var(--vvd-calendar-event--start,0) * (100% - 23px) / 24 + calc(1px * var(--vvd-calendar-event--start,0)));box-sizing:border-box;background-color:var(--_appearance-color-fill);block-size:calc(var(--vvd-calendar-event--duration,1) * calc((100% - 23px) / 24) + calc(1px * (var(--vvd-calendar-event--duration,1) - 1)) - 4px);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);inline-size:calc(100% - 8px - min(var(--vvd-calendar-event--indent), 32px));margin-block-start:2px;margin-inline:min(var(--vvd-calendar-event--indent), 32px) 8px;max-block-size:calc(100% - calc(var(--vvd-calendar-event--start,0) * (100% - 23px) / 24 + calc(1px * var(--vvd-calendar-event--start,0))) - 4px);border-radius:8px;padding:4px 8px;position:absolute;overflow:hidden}@supports (contain:content){.base{contain:strict}}@supports not (contain:content){.base{overflow:hidden}}.base:focus{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));z-index:2000}:host([overlap-count]) .base{--focus-stroke-gap-color:var(--vvd-color-canvas)}:host([overlap-count]) .base:not(:focus){box-shadow:inset 0 0 0 1px var(--vvd-color-canvas)}h2{font:var(--vvd-typography-base-condensed-bold);margin:0}h2>strong{font:inherit}p{font:var(--vvd-typography-base-condensed);margin:0}`,o=e.d` <div
+const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/when.cjs`),n=require(`../bundled/delegates-aria.cjs`),r=require(`../bundled/class-names.cjs`),i=require(`../bundled/calendar-event.cjs`);var a=`:host{display:contents}.base.connotation-accent{--_connotation-color-primary:var(--vvd-calendar-event-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-calendar-event-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-contrast:var(--vvd-calendar-event-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-soft:var(--vvd-calendar-event-accent-soft,var(--vvd-color-neutral-100))}.base.connotation-cta{--_connotation-color-primary:var(--vvd-calendar-event-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-calendar-event-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-contrast:var(--vvd-calendar-event-cta-contrast,var(--vvd-color-cta-800));--_connotation-color-soft:var(--vvd-calendar-event-cta-soft,var(--vvd-color-cta-100))}.base.connotation-success{--_connotation-color-primary:var(--vvd-calendar-event-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-calendar-event-success-primary-text,var(--vvd-color-canvas));--_connotation-color-contrast:var(--vvd-calendar-event-success-contrast,var(--vvd-color-success-800));--_connotation-color-soft:var(--vvd-calendar-event-success-soft,var(--vvd-color-success-100))}.base.connotation-alert{--_connotation-color-primary:var(--vvd-calendar-event-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-calendar-event-alert-primary-text,var(--vvd-color-canvas));--_connotation-color-contrast:var(--vvd-calendar-event-alert-contrast,var(--vvd-color-alert-800));--_connotation-color-soft:var(--vvd-calendar-event-alert-soft,var(--vvd-color-alert-100))}.base.connotation-warning{--_connotation-color-primary:var(--vvd-calendar-event-warning-primary,var(--vvd-color-warning-300));--_connotation-color-primary-text:var(--vvd-calendar-event-warning-primary-text,var(--vvd-color-canvas-text));--_connotation-color-contrast:var(--vvd-calendar-event-warning-contrast,var(--vvd-color-warning-800));--_connotation-color-soft:var(--vvd-calendar-event-warning-soft,var(--vvd-color-warning-100))}.base.connotation-announcement{--_connotation-color-primary:var(--vvd-calendar-event-announcement-primary,var(--vvd-color-announcement-500));--_connotation-color-primary-text:var(--vvd-calendar-event-announcement-primary-text,var(--vvd-color-canvas));--_connotation-color-contrast:var(--vvd-calendar-event-announcement-contrast,var(--vvd-color-announcement-800));--_connotation-color-soft:var(--vvd-calendar-event-announcement-soft,var(--vvd-color-announcement-100))}.base:not(.connotation-accent,.connotation-cta,.connotation-success,.connotation-alert,.connotation-warning,.connotation-announcement){--_connotation-color-primary:var(--vvd-calendar-event-information-primary,var(--vvd-color-information-500));--_connotation-color-primary-text:var(--vvd-calendar-event-information-primary-text,var(--vvd-color-canvas));--_connotation-color-contrast:var(--vvd-calendar-event-information-contrast,var(--vvd-color-information-800));--_connotation-color-soft:var(--vvd-calendar-event-information-soft,var(--vvd-color-information-100))}.base{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.base.appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.base{--vvd-calendar-event--indent:calc(0px + var(--vvd-calendar-event--overlap-count,0) * 8px);--focus-stroke-gap-color:transparent;z-index:var(--vvd-calendar-event--overlap-count);top:calc(var(--vvd-calendar-event--start,0) * (100% - 23px) / 24 + calc(1px * var(--vvd-calendar-event--start,0)));box-sizing:border-box;background-color:var(--_appearance-color-fill);block-size:calc(var(--vvd-calendar-event--duration,1) * calc((100% - 23px) / 24) + calc(1px * (var(--vvd-calendar-event--duration,1) - 1)) - 4px);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);inline-size:calc(100% - 8px - min(var(--vvd-calendar-event--indent), 32px));margin-block-start:2px;margin-inline:min(var(--vvd-calendar-event--indent), 32px) 8px;max-block-size:calc(100% - calc(var(--vvd-calendar-event--start,0) * (100% - 23px) / 24 + calc(1px * var(--vvd-calendar-event--start,0))) - 4px);border-radius:8px;padding:4px 8px;position:absolute;overflow:hidden}@supports (contain:content){.base{contain:strict}}@supports not (contain:content){.base{overflow:hidden}}.base:focus{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));z-index:2000}:host([overlap-count]) .base{--focus-stroke-gap-color:var(--vvd-color-canvas)}:host([overlap-count]) .base:not(:focus){box-shadow:inset 0 0 0 1px var(--vvd-color-canvas)}h2{font:var(--vvd-typography-base-condensed-bold);margin:0}h2>strong{font:inherit}p{font:var(--vvd-typography-base-condensed);margin:0}`,o=e.d` <div
 	style="${({start:e,duration:t,overlapCount:n})=>{let r={...n&&{"--vvd-calendar-event--overlap-count":n},...e&&{"--vvd-calendar-event--start":e},...t&&{"--vvd-calendar-event--duration":t}};return Object.entries(r).map(e=>e.join(`:`)).join(`;`)}}"
-	class="${({connotation:e,appearance:t})=>n.t(`base`,[`connotation-${e}`,!!e],[`appearance-${t}`,!!t])}"
+	class="${({connotation:e,appearance:t})=>r.t(`base`,[`connotation-${e}`,!!e],[`appearance-${t}`,!!t])}"
 	tabindex="0"
-	${r.n({role:`button`})}
+	${n.n({role:`button`})}
 >
 	${t.t(e=>e.heading,e.d`<h2><strong>${e=>e.heading}</strong></h2>`)}
 	${t.t(e=>e.description,e.d`<p>${e=>e.description}</p>`)}

package/calendar-event/index.js

@@ -1,7 +1,7 @@
 import { d as e, o as t, s as n } from "../bundled/vivid-element.js";
 import { t as r } from "../bundled/when.js";
-import { t as i } from "../bundled/class-names.js";
-import { n as a } from "../bundled/delegates-aria.js";
+import { n as i } from "../bundled/delegates-aria.js";
+import { t as a } from "../bundled/class-names.js";
 import { t as o } from "../bundled/calendar-event.js";
 //#endregion
 //#region src/lib/calendar-event/index.ts
@@ -14,9 +14,9 @@ n(t("calendar-event", o, e` <div
 	};
 	return Object.entries(r).map((e) => e.join(":")).join(";");
 }}"
-	class="${({ connotation: e, appearance: t }) => i("base", [`connotation-${e}`, !!e], [`appearance-${t}`, !!t])}"
+	class="${({ connotation: e, appearance: t }) => a("base", [`connotation-${e}`, !!e], [`appearance-${t}`, !!t])}"
 	tabindex="0"
-	${a({ role: "button" })}
+	${i({ role: "button" })}
 >
 	${r((e) => e.heading, e`<h2><strong>${(e) => e.heading}</strong></h2>`)}
 	${r((e) => e.description, e`<p>${(e) => e.description}</p>`)}

package/card/index.cjs

@@ -1,4 +1,4 @@
-const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/when.cjs`),n=require(`../bundled/slotted.cjs`),r=require(`../bundled/definition2.cjs`),i=require(`../bundled/decorate.cjs`),a=require(`../bundled/class-names.cjs`),o=require(`../bundled/delegates-aria.cjs`),s=require(`../bundled/linkable.cjs`),c=require(`../bundled/enums.cjs`),l=require(`../bundled/definition7.cjs`);var u=`:host{--_vvd-tinted-shadow-surface-0dp:drop-shadow(1px 0px 0px var(--card-border-color)) drop-shadow(0px 1px 0px var(--card-border-color)) drop-shadow(0px -1px 0px var(--card-border-color)) drop-shadow(-1px 0px 0px var(--card-border-color));display:flex}.base{text-align:start;border:0;border-radius:8px;outline:none;inline-size:100%;padding:0;text-decoration:none}.base:is(button,a):not(:disabled){cursor:pointer}.base:is(button,a):disabled{cursor:not-allowed}.base:is(button,a):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))}.wrapper{border-radius:inherit;block-size:100%;color:var(--vvd-color-canvas-text);--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent;flex-flow:column;display:flex;overflow:hidden}@media (hover:hover){.wrapper:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}}.wrapper.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.wrapper:active:where(:not(.disabled,:disabled)),.wrapper.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.wrapper{--_connotation-color-primary:var(--vvd-card-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-card-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-card-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-faint:var(--vvd-card-cta-faint,var(--vvd-color-cta-50));--_connotation-color-soft:var(--vvd-card-cta-soft,var(--vvd-color-cta-100))}@media (hover:hover){.base:is(button,a):hover>.wrapper{background-color:var(--_appearance-color-fill)}}.main-content{flex-flow:column;padding:24px;display:flex}.header{flex:1;align-items:flex-start;gap:8px;display:flex}.header-content{flex:1}.header-wrapper{gap:8px;display:flex}.header-headline,.header-subtitle{-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.header-headline{font:var(--vvd-typography-heading-4);-webkit-line-clamp:var(--headline-line-clamp)}.header-subtitle{font:var(--vvd-typography-base);-webkit-line-clamp:var(--subtitle-line-clamp)}.hide-header .header{display:none}.header-subtitle,.text{color:var(--vvd-color-neutral-600);font:var(--vvd-typography-base)}.text{margin-top:12px;padding-right:8px}.footer{padding-bottom:24px;flex-direction:column;align-items:flex-end;margin-top:auto;padding-inline:24px;display:inline-flex}.hide-footer .footer{display:none}::slotted([slot=graphic i]),.icon{flex-shrink:0;align-self:baseline;margin-block-start:4px}.icon{font-size:20px}::slotted([slot=meta i]){flex-shrink:0;align-self:flex-start;margin-block-start:-8px;margin-inline:auto -8px}`,d=class extends s.t(e.t){constructor(...e){super(...e),this.clickableCard=!1}};i.t([e.l],d.prototype,`appearance`,void 0),i.t([e.l],d.prototype,`headline`,void 0),i.t([e.l],d.prototype,`subtitle`,void 0),i.t([e.l],d.prototype,`text`,void 0),i.t([e.l],d.prototype,`icon`,void 0),i.t([e.l],d.prototype,`elevation`,void 0),i.t([e.l({mode:`boolean`,attribute:`clickable-card`})],d.prototype,`clickableCard`,void 0),i.t([e.T],d.prototype,`footerSlottedContent`,void 0),i.t([e.T],d.prototype,`graphicSlottedContent`,void 0),i.t([e.T],d.prototype,`hasMetaSlottedContent`,void 0);var f=e=>a.t(`base`,[`hide-footer`,!e.footerSlottedContent||!e.footerSlottedContent.length],[`hide-header`,v(e)]);function p(t){return e.d`
+const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/when.cjs`),n=require(`../bundled/slotted.cjs`),r=require(`../bundled/enums.cjs`),i=require(`../bundled/definition2.cjs`),a=require(`../bundled/decorate.cjs`),o=require(`../bundled/delegates-aria.cjs`),s=require(`../bundled/linkable.cjs`),c=require(`../bundled/class-names.cjs`),l=require(`../bundled/definition7.cjs`);var u=`:host{--_vvd-tinted-shadow-surface-0dp:drop-shadow(1px 0px 0px var(--card-border-color)) drop-shadow(0px 1px 0px var(--card-border-color)) drop-shadow(0px -1px 0px var(--card-border-color)) drop-shadow(-1px 0px 0px var(--card-border-color));display:flex}.base{text-align:start;border:0;border-radius:8px;outline:none;inline-size:100%;padding:0;text-decoration:none}.base:is(button,a):not(:disabled){cursor:pointer}.base:is(button,a):disabled{cursor:not-allowed}.base:is(button,a):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))}.wrapper{border-radius:inherit;block-size:100%;color:var(--vvd-color-canvas-text);--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent;flex-flow:column;display:flex;overflow:hidden}@media (hover:hover){.wrapper:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}}.wrapper.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.wrapper:active:where(:not(.disabled,:disabled)),.wrapper.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.wrapper{--_connotation-color-primary:var(--vvd-card-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-card-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-card-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-faint:var(--vvd-card-cta-faint,var(--vvd-color-cta-50));--_connotation-color-soft:var(--vvd-card-cta-soft,var(--vvd-color-cta-100))}@media (hover:hover){.base:is(button,a):hover>.wrapper{background-color:var(--_appearance-color-fill)}}.main-content{flex-flow:column;padding:24px;display:flex}.body-wrapper{padding-top:16px}.hide-header .body-wrapper{padding-top:0}.hide-body .body-wrapper{display:none}.header{flex:1;align-items:flex-start;gap:8px;display:flex}.header-content{flex:1}.header-wrapper{gap:8px;display:flex}.header-headline,.header-subtitle{-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.header-headline{font:var(--vvd-typography-heading-4);-webkit-line-clamp:var(--headline-line-clamp)}.header-subtitle{font:var(--vvd-typography-base);-webkit-line-clamp:var(--subtitle-line-clamp)}.hide-header .header{display:none}.header-subtitle,.text{color:var(--vvd-color-neutral-600);font:var(--vvd-typography-base)}.text{margin-top:12px;padding-right:8px}.footer{padding-bottom:24px;flex-direction:column;align-items:flex-end;margin-top:auto;padding-inline:24px;display:inline-flex}.hide-footer .footer{display:none}::slotted([slot=graphic i]),.icon{flex-shrink:0;align-self:baseline;margin-block-start:4px}.icon{font-size:20px}::slotted([slot=meta i]){flex-shrink:0;align-self:flex-start;margin-block-start:-8px;margin-inline:auto -8px}`,d=class extends s.t(e.t){constructor(...e){super(...e),this.clickableCard=!1}};a.t([e.l],d.prototype,`appearance`,void 0),a.t([e.l],d.prototype,`headline`,void 0),a.t([e.l],d.prototype,`subtitle`,void 0),a.t([e.l],d.prototype,`text`,void 0),a.t([e.l],d.prototype,`icon`,void 0),a.t([e.l],d.prototype,`elevation`,void 0),a.t([e.l({mode:`boolean`,attribute:`clickable-card`})],d.prototype,`clickableCard`,void 0),a.t([e.T],d.prototype,`bodySlottedContent`,void 0),a.t([e.T],d.prototype,`footerSlottedContent`,void 0),a.t([e.T],d.prototype,`graphicSlottedContent`,void 0),a.t([e.T],d.prototype,`hasMetaSlottedContent`,void 0);var f=e=>c.t(`base`,[`hide-footer`,!e.footerSlottedContent||!e.footerSlottedContent.length],[`hide-header`,v(e)],[`hide-body`,!e.bodySlottedContent||!e.bodySlottedContent.length]);function p(t){return e.d`
 		<${t} class="icon" inline name="${e=>e.icon}"></${t}>`}function m(){return e.d`
 		<div class="header-headline" id="card-headline">${e=>e.headline}</div>
 	`}function h(){return e.d` <div class="header-subtitle">${e=>e.subtitle}</div> `}function g(){return e.d`
@@ -23,7 +23,7 @@ const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/when.cjs`)
 			aria-labelledby="${e=>e.headline?`card-headline`:null}"
 		>
 			${n}
-		</div>`}function C(i){let a=i.tagFor(r.r);return e.d`
+		</div>`}function C(r){let a=r.tagFor(i.r);return e.d`
 		${r=>S(r,e.d`<div class="wrapper">
 					<div class="vwc-card-media">
 						<slot name="media"></slot>
@@ -34,22 +34,25 @@ const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/when.cjs`)
 								${_(a)} ${y()}
 							</div>
 							${t.t(e=>e.text,b())}
+							<div class="body-wrapper">
+								<slot name="body" ${n.t(`bodySlottedContent`)}></slot>
+							</div>
 						</div>
 					</slot>
 					<div class="footer">
 						<slot name="footer" ${n.t(`footerSlottedContent`)}></slot>
 					</div>
 				</div> `)}
-	`}var w=e.o(`card`,d,n=>{let r=n.tagFor(l.r);return e.d`
-		${t.t(e=>e.appearance!==c.t.Ghost&&e.appearance!==c.t.Outlined,e.d`
-			<${r} dp=${e=>e.elevation??`4`}>
+	`}var w=e.o(`card`,d,n=>{let i=n.tagFor(l.r);return e.d`
+		${t.t(e=>e.appearance!==r.t.Ghost&&e.appearance!==r.t.Outlined,e.d`
+			<${i} dp=${e=>e.elevation??`4`}>
 			  ${C(n)}
-			</${r}>
+			</${i}>
 		`)}
-		${t.t(e=>e.appearance===c.t.Outlined,e.d`
-			<${r} dp='0')}>
+		${t.t(e=>e.appearance===r.t.Outlined,e.d`
+			<${i} dp='0')}>
 			  ${C(n)}
-			</${r}>
+			</${i}>
 		`)}
-		${t.t(e=>e.appearance===c.t.Ghost,e.d` ${C(n)} `)}
-	`},[r.t,l.t],{styles:u});e.s(w)();
+		${t.t(e=>e.appearance===r.t.Ghost,e.d` ${C(n)} `)}
+	`},[i.t,l.t],{styles:u});e.s(w)();

package/card/index.js

@@ -1,26 +1,26 @@
 import { T as e, d as t, l as n, o as r, s as i, t as a } from "../bundled/vivid-element.js";
 import { t as o } from "../bundled/when.js";
 import { t as s } from "../bundled/slotted.js";
-import { r as c, t as l } from "../bundled/definition2.js";
-import { t as u } from "../bundled/decorate.js";
-import { t as d } from "../bundled/class-names.js";
+import { t as c } from "../bundled/enums.js";
+import { r as l, t as u } from "../bundled/definition2.js";
+import { t as d } from "../bundled/decorate.js";
 import { n as f } from "../bundled/delegates-aria.js";
 import { t as p } from "../bundled/linkable.js";
-import { t as m } from "../bundled/enums.js";
+import { t as m } from "../bundled/class-names.js";
 import { r as h, t as g } from "../bundled/definition7.js";
 //#region src/lib/card/card.scss?inline
-var _ = ":host{--_vvd-tinted-shadow-surface-0dp:drop-shadow(1px 0px 0px var(--card-border-color)) drop-shadow(0px 1px 0px var(--card-border-color)) drop-shadow(0px -1px 0px var(--card-border-color)) drop-shadow(-1px 0px 0px var(--card-border-color));display:flex}.base{text-align:start;border:0;border-radius:8px;outline:none;inline-size:100%;padding:0;text-decoration:none}.base:is(button,a):not(:disabled){cursor:pointer}.base:is(button,a):disabled{cursor:not-allowed}.base:is(button,a):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))}.wrapper{border-radius:inherit;block-size:100%;color:var(--vvd-color-canvas-text);--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent;flex-flow:column;display:flex;overflow:hidden}@media (hover:hover){.wrapper:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}}.wrapper.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.wrapper:active:where(:not(.disabled,:disabled)),.wrapper.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.wrapper{--_connotation-color-primary:var(--vvd-card-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-card-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-card-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-faint:var(--vvd-card-cta-faint,var(--vvd-color-cta-50));--_connotation-color-soft:var(--vvd-card-cta-soft,var(--vvd-color-cta-100))}@media (hover:hover){.base:is(button,a):hover>.wrapper{background-color:var(--_appearance-color-fill)}}.main-content{flex-flow:column;padding:24px;display:flex}.header{flex:1;align-items:flex-start;gap:8px;display:flex}.header-content{flex:1}.header-wrapper{gap:8px;display:flex}.header-headline,.header-subtitle{-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.header-headline{font:var(--vvd-typography-heading-4);-webkit-line-clamp:var(--headline-line-clamp)}.header-subtitle{font:var(--vvd-typography-base);-webkit-line-clamp:var(--subtitle-line-clamp)}.hide-header .header{display:none}.header-subtitle,.text{color:var(--vvd-color-neutral-600);font:var(--vvd-typography-base)}.text{margin-top:12px;padding-right:8px}.footer{padding-bottom:24px;flex-direction:column;align-items:flex-end;margin-top:auto;padding-inline:24px;display:inline-flex}.hide-footer .footer{display:none}::slotted([slot=graphic i]),.icon{flex-shrink:0;align-self:baseline;margin-block-start:4px}.icon{font-size:20px}::slotted([slot=meta i]){flex-shrink:0;align-self:flex-start;margin-block-start:-8px;margin-inline:auto -8px}", v = class extends p(a) {
+var _ = ":host{--_vvd-tinted-shadow-surface-0dp:drop-shadow(1px 0px 0px var(--card-border-color)) drop-shadow(0px 1px 0px var(--card-border-color)) drop-shadow(0px -1px 0px var(--card-border-color)) drop-shadow(-1px 0px 0px var(--card-border-color));display:flex}.base{text-align:start;border:0;border-radius:8px;outline:none;inline-size:100%;padding:0;text-decoration:none}.base:is(button,a):not(:disabled){cursor:pointer}.base:is(button,a):disabled{cursor:not-allowed}.base:is(button,a):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))}.wrapper{border-radius:inherit;block-size:100%;color:var(--vvd-color-canvas-text);--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent;flex-flow:column;display:flex;overflow:hidden}@media (hover:hover){.wrapper:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}}.wrapper.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.wrapper:active:where(:not(.disabled,:disabled)),.wrapper.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.wrapper{--_connotation-color-primary:var(--vvd-card-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-card-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-card-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-faint:var(--vvd-card-cta-faint,var(--vvd-color-cta-50));--_connotation-color-soft:var(--vvd-card-cta-soft,var(--vvd-color-cta-100))}@media (hover:hover){.base:is(button,a):hover>.wrapper{background-color:var(--_appearance-color-fill)}}.main-content{flex-flow:column;padding:24px;display:flex}.body-wrapper{padding-top:16px}.hide-header .body-wrapper{padding-top:0}.hide-body .body-wrapper{display:none}.header{flex:1;align-items:flex-start;gap:8px;display:flex}.header-content{flex:1}.header-wrapper{gap:8px;display:flex}.header-headline,.header-subtitle{-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.header-headline{font:var(--vvd-typography-heading-4);-webkit-line-clamp:var(--headline-line-clamp)}.header-subtitle{font:var(--vvd-typography-base);-webkit-line-clamp:var(--subtitle-line-clamp)}.hide-header .header{display:none}.header-subtitle,.text{color:var(--vvd-color-neutral-600);font:var(--vvd-typography-base)}.text{margin-top:12px;padding-right:8px}.footer{padding-bottom:24px;flex-direction:column;align-items:flex-end;margin-top:auto;padding-inline:24px;display:inline-flex}.hide-footer .footer{display:none}::slotted([slot=graphic i]),.icon{flex-shrink:0;align-self:baseline;margin-block-start:4px}.icon{font-size:20px}::slotted([slot=meta i]){flex-shrink:0;align-self:flex-start;margin-block-start:-8px;margin-inline:auto -8px}", v = class extends p(a) {
 	constructor(...e) {
 		super(...e), this.clickableCard = !1;
 	}
 };
-u([n], v.prototype, "appearance", void 0), u([n], v.prototype, "headline", void 0), u([n], v.prototype, "subtitle", void 0), u([n], v.prototype, "text", void 0), u([n], v.prototype, "icon", void 0), u([n], v.prototype, "elevation", void 0), u([n({
+d([n], v.prototype, "appearance", void 0), d([n], v.prototype, "headline", void 0), d([n], v.prototype, "subtitle", void 0), d([n], v.prototype, "text", void 0), d([n], v.prototype, "icon", void 0), d([n], v.prototype, "elevation", void 0), d([n({
 	mode: "boolean",
 	attribute: "clickable-card"
-})], v.prototype, "clickableCard", void 0), u([e], v.prototype, "footerSlottedContent", void 0), u([e], v.prototype, "graphicSlottedContent", void 0), u([e], v.prototype, "hasMetaSlottedContent", void 0);
+})], v.prototype, "clickableCard", void 0), d([e], v.prototype, "bodySlottedContent", void 0), d([e], v.prototype, "footerSlottedContent", void 0), d([e], v.prototype, "graphicSlottedContent", void 0), d([e], v.prototype, "hasMetaSlottedContent", void 0);
 //#endregion
 //#region src/lib/card/card.template.ts
-var y = (e) => d("base", ["hide-footer", !e.footerSlottedContent || !e.footerSlottedContent.length], ["hide-header", T(e)]);
+var y = (e) => m("base", ["hide-footer", !e.footerSlottedContent || !e.footerSlottedContent.length], ["hide-header", T(e)], ["hide-body", !e.bodySlottedContent || !e.bodySlottedContent.length]);
 function b(e) {
 	return t`
 		<${e} class="icon" inline name="${(e) => e.icon}"></${e}>`;
@@ -77,7 +77,7 @@ function k(e, n) {
 		</div>`;
 }
 function A(e) {
-	let n = e.tagFor(c);
+	let n = e.tagFor(l);
 	return t`
 		${(e) => k(e, t`<div class="wrapper">
 					<div class="vwc-card-media">
@@ -89,6 +89,9 @@ function A(e) {
 								${w(n)} ${E()}
 							</div>
 							${o((e) => e.text, D())}
+							<div class="body-wrapper">
+								<slot name="body" ${s("bodySlottedContent")}></slot>
+							</div>
 						</div>
 					</slot>
 					<div class="footer">
@@ -102,17 +105,17 @@ function A(e) {
 i(r("card", v, (e) => {
 	let n = e.tagFor(h);
 	return t`
-		${o((e) => e.appearance !== m.Ghost && e.appearance !== m.Outlined, t`
+		${o((e) => e.appearance !== c.Ghost && e.appearance !== c.Outlined, t`
 			<${n} dp=${(e) => e.elevation ?? "4"}>
 			  ${A(e)}
 			</${n}>
 		`)}
-		${o((e) => e.appearance === m.Outlined, t`
+		${o((e) => e.appearance === c.Outlined, t`
 			<${n} dp='0')}>
 			  ${A(e)}
 			</${n}>
 		`)}
-		${o((e) => e.appearance === m.Ghost, t` ${A(e)} `)}
+		${o((e) => e.appearance === c.Ghost, t` ${A(e)} `)}
 	`;
-}, [l, g], { styles: _ }))();
+}, [u, g], { styles: _ }))();
 //#endregion

package/checkbox/index.cjs

@@ -1 +1 @@
-require(`../bundled/vivid-element.cjs`),require(`../bundled/definition2.cjs`),require(`../bundled/definition11.cjs`).n();
+require(`../bundled/vivid-element.cjs`),require(`../bundled/definition2.cjs`),require(`../bundled/definition15.cjs`).n();

package/checkbox/index.js

@@ -1,6 +1,6 @@
 import "../bundled/vivid-element.js";
 import "../bundled/definition2.js";
-import { n as e } from "../bundled/definition11.js";
+import { n as e } from "../bundled/definition15.js";
 //#region src/lib/checkbox/index.ts
 e();
 //#endregion

package/color-picker/definition.cjs

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 require("../unbundled/definition2.cjs");
-const require_definition$1 = require("../unbundled/definition24.cjs");
+const require_definition$1 = require("../unbundled/definition28.cjs");
 exports.VwcColorPickerElement = require_definition$1.ColorPicker;
 exports.colorPickerDefinition = require_definition$1.colorPickerDefinition;
 exports.registerColorPicker = require_definition$1.registerColorPicker;

package/color-picker/definition.js

@@ -1,3 +1,3 @@
 import "../unbundled/definition2.js";
-import { n as registerColorPicker, r as ColorPicker, t as colorPickerDefinition } from "../unbundled/definition24.js";
+import { n as registerColorPicker, r as ColorPicker, t as colorPickerDefinition } from "../unbundled/definition28.js";
 export { ColorPicker as VwcColorPickerElement, colorPickerDefinition, registerColorPicker };