@vonage/vivid 5.20.1 → 5.22.0

package/unbundled/definition14.cjs

@@ -22,7 +22,7 @@ function formatTime(time) {
 	if (!time || Number.isNaN(time)) return "0:00";
 	const min = Math.floor(time / 60);
 	const sec = Math.floor(time % 60);
-	return min + ":" + (sec < 10 ? "0" + sec : sec);
+	return `${min}:${sec < 10 ? `0${sec}` : sec}`;
 }
 var PAUSE = true;
 var PLAY = false;
@@ -44,6 +44,75 @@ var validSkipByConverter = {
 * @event {CustomEvent<undefined>} pause - Fires when the audio playback is paused.
 */
 var AudioPlayer = class extends require_localized.Localized(require_vivid_element.VividElement) {
+	constructor(..._args) {
+		super(..._args);
+		this.playButtonAriaLabel = null;
+		this.pauseButtonAriaLabel = null;
+		this.sliderAriaLabel = null;
+		this.skipForwardButtonAriaLabel = null;
+		this.skipBackwardButtonAriaLabel = null;
+		this.disabled = false;
+		this.notime = false;
+		this.playbackRates = null;
+		this.#playerEl = new Audio();
+		this.#isProgrammaticSliderUpdate = false;
+		this.durationFallback = false;
+		this.#onPlay = () => {
+			if (!this.#sliderEl?.isDragging) this.$emit("play", void 0, { bubbles: false });
+		};
+		this.#onPause = () => {
+			if (!this.#sliderEl?.isDragging) this.$emit("pause", void 0, { bubbles: false });
+		};
+		this.#pausedChanged = (pausing) => {
+			if (pausing === this.paused) {
+				this.#setPausedState();
+				return;
+			}
+			if (!this.paused) this.#playerEl.pause();
+			else {
+				this.#updateProgress();
+				this.#playerEl.play();
+			}
+			this.#setPausedState();
+		};
+		this.#updateProgress = () => {
+			_microsoft_fast_element.Observable.notify(this, "currentTime");
+			const duration = this.duration;
+			const currentTime = this.currentTime;
+			const isValid = Number.isFinite(duration) && duration > 0 && Number.isFinite(currentTime) && currentTime >= 0;
+			const percent = isValid ? currentTime / duration * 100 : 0;
+			/* v8 ignore else -- @preserve */
+			if (this.#sliderEl) {
+				this.#isProgrammaticSliderUpdate = true;
+				this.#sliderEl.value = percent.toString();
+				this.#isProgrammaticSliderUpdate = false;
+			}
+			if (isValid && percent === 100) this.pause();
+		};
+		this.#updateTotalTime = () => {
+			_microsoft_fast_element.Observable.notify(this, "duration");
+			if (!Number.isFinite(this.#playerEl.duration) || this.#playerEl.duration <= 0) {
+				if (this.durationFallback) this.#fetchAndCacheAudioBuffer();
+			}
+		};
+		this.#updateCurrentTimeOnSliderChange = () => {
+			if (!this.paused && this.#sliderEl.isDragging) {
+				this.pause();
+				this.#dragInterval = window.setInterval(() => {
+					/* v8 ignore else -- @preserve */
+					if (!this.#sliderEl.isDragging || !this.isConnected) {
+						clearInterval(this.#dragInterval);
+						if (this.isConnected) this.play();
+					}
+				}, 0);
+			}
+			if (this.#isProgrammaticSliderUpdate) return;
+			this.currentTime = this.duration * Number(this.#sliderEl.value) / 100;
+		};
+		this.#setPausedState = () => {
+			_microsoft_fast_element.Observable.notify(this, "paused");
+		};
+	}
 	/**
 	* @internal
 	*/
@@ -133,76 +202,6 @@ var AudioPlayer = class extends require_localized.Localized(require_vivid_elemen
 	}
 	#playerEl;
 	#isProgrammaticSliderUpdate;
-	constructor() {
-		super();
-		this.playButtonAriaLabel = null;
-		this.pauseButtonAriaLabel = null;
-		this.sliderAriaLabel = null;
-		this.skipForwardButtonAriaLabel = null;
-		this.skipBackwardButtonAriaLabel = null;
-		this.disabled = false;
-		this.notime = false;
-		this.playbackRates = null;
-		this.#playerEl = new Audio();
-		this.#isProgrammaticSliderUpdate = false;
-		this.durationFallback = false;
-		this.#onPlay = () => {
-			if (!this.#sliderEl?.isDragging) this.$emit("play", void 0, { bubbles: false });
-		};
-		this.#onPause = () => {
-			if (!this.#sliderEl?.isDragging) this.$emit("pause", void 0, { bubbles: false });
-		};
-		this.#pausedChanged = (pausing) => {
-			if (pausing === this.paused) {
-				this.#setPausedState();
-				return;
-			}
-			if (!this.paused) this.#playerEl.pause();
-			else {
-				this.#updateProgress();
-				this.#playerEl.play();
-			}
-			this.#setPausedState();
-		};
-		this.#updateProgress = () => {
-			_microsoft_fast_element.Observable.notify(this, "currentTime");
-			const duration = this.duration;
-			const currentTime = this.currentTime;
-			const isValid = Number.isFinite(duration) && duration > 0 && Number.isFinite(currentTime) && currentTime >= 0;
-			const percent = isValid ? currentTime / duration * 100 : 0;
-			/* v8 ignore else -- @preserve */
-			if (this.#sliderEl) {
-				this.#isProgrammaticSliderUpdate = true;
-				this.#sliderEl.value = percent.toString();
-				this.#isProgrammaticSliderUpdate = false;
-			}
-			if (isValid && percent === 100) this.pause();
-		};
-		this.#updateTotalTime = () => {
-			_microsoft_fast_element.Observable.notify(this, "duration");
-			if (!Number.isFinite(this.#playerEl.duration) || this.#playerEl.duration <= 0) {
-				if (this.durationFallback) this.#fetchAndCacheAudioBuffer();
-			}
-		};
-		this.#updateCurrentTimeOnSliderChange = () => {
-			if (!this.paused && this.#sliderEl.isDragging) {
-				this.pause();
-				this.#dragInterval = window.setInterval(() => {
-					/* v8 ignore else -- @preserve */
-					if (!this.#sliderEl.isDragging || !this.isConnected) {
-						clearInterval(this.#dragInterval);
-						if (this.isConnected) this.play();
-					}
-				}, 0);
-			}
-			if (this.#isProgrammaticSliderUpdate) return;
-			/* v8 ignore else -- @preserve */
-			if (this.#playerEl) this.currentTime = this.duration * Number(this.#sliderEl.value) / 100;
-		};
-		this.#setPausedState = () => {
-			_microsoft_fast_element.Observable.notify(this, "paused");
-		};
-	}
 	connectedCallback() {
 		super.connectedCallback();
 		this.#playerEl.addEventListener("timeupdate", this.#updateProgress);
@@ -275,7 +274,7 @@ require_decorate.__decorate([(0, _microsoft_fast_element.attr)({
 })], AudioPlayer.prototype, "durationFallback", void 0);
 //#endregion
 //#region src/lib/audio-player/audio-player.template.ts
-var getClasses = ({ notime, disabled, duration, skipBy, playbackRates }) => (0, _microsoft_fast_web_utilities.classNames)(["disabled", Boolean(disabled) || !duration], ["two-lines", !notime && (Boolean(Number(skipBy)) || Boolean(playbackRates))], ["playback", Boolean(playbackRates)]);
+var getClasses = ({ notime, disabled, duration, skipBy, playbackRates }) => (0, _microsoft_fast_web_utilities.classNames)(["disabled", disabled || !duration], ["two-lines", !notime && (Boolean(Number(skipBy)) || Boolean(playbackRates))], ["playback", Boolean(playbackRates)]);
 var isMenuItemChekced = (playbackRate, { parent }) => {
 	return playbackRate === parent.playbackRate;
 };
@@ -330,12 +329,10 @@ function renderSlider(context) {
 }
 function renderTimestamp() {
 	return _microsoft_fast_element.html` <div class="time-stamp">
-		<span class="current-time"
-			>${(x) => formatTime(x.currentTime || 0)}</span
-		>
+		<span class="current-time">${(x) => formatTime(x.currentTime || 0)}</span>
 		${(0, _microsoft_fast_element.when)((x) => x.duration && x.duration !== Infinity, _microsoft_fast_element.html`
 				<span>/</span>
-				<span class="total-time">${(x) => formatTime(x?.duration)}</span>
+				<span class="total-time">${(x) => formatTime(x.duration)}</span>
 			`)}
 	</div>`;
 }

package/unbundled/definition14.js

@@ -21,7 +21,7 @@ function formatTime(time) {
 	if (!time || Number.isNaN(time)) return "0:00";
 	const min = Math.floor(time / 60);
 	const sec = Math.floor(time % 60);
-	return min + ":" + (sec < 10 ? "0" + sec : sec);
+	return `${min}:${sec < 10 ? `0${sec}` : sec}`;
 }
 var PAUSE = true;
 var PLAY = false;
@@ -43,6 +43,75 @@ var validSkipByConverter = {
 * @event {CustomEvent<undefined>} pause - Fires when the audio playback is paused.
 */
 var AudioPlayer = class extends Localized(VividElement) {
+	constructor(..._args) {
+		super(..._args);
+		this.playButtonAriaLabel = null;
+		this.pauseButtonAriaLabel = null;
+		this.sliderAriaLabel = null;
+		this.skipForwardButtonAriaLabel = null;
+		this.skipBackwardButtonAriaLabel = null;
+		this.disabled = false;
+		this.notime = false;
+		this.playbackRates = null;
+		this.#playerEl = new Audio();
+		this.#isProgrammaticSliderUpdate = false;
+		this.durationFallback = false;
+		this.#onPlay = () => {
+			if (!this.#sliderEl?.isDragging) this.$emit("play", void 0, { bubbles: false });
+		};
+		this.#onPause = () => {
+			if (!this.#sliderEl?.isDragging) this.$emit("pause", void 0, { bubbles: false });
+		};
+		this.#pausedChanged = (pausing) => {
+			if (pausing === this.paused) {
+				this.#setPausedState();
+				return;
+			}
+			if (!this.paused) this.#playerEl.pause();
+			else {
+				this.#updateProgress();
+				this.#playerEl.play();
+			}
+			this.#setPausedState();
+		};
+		this.#updateProgress = () => {
+			Observable.notify(this, "currentTime");
+			const duration = this.duration;
+			const currentTime = this.currentTime;
+			const isValid = Number.isFinite(duration) && duration > 0 && Number.isFinite(currentTime) && currentTime >= 0;
+			const percent = isValid ? currentTime / duration * 100 : 0;
+			/* v8 ignore else -- @preserve */
+			if (this.#sliderEl) {
+				this.#isProgrammaticSliderUpdate = true;
+				this.#sliderEl.value = percent.toString();
+				this.#isProgrammaticSliderUpdate = false;
+			}
+			if (isValid && percent === 100) this.pause();
+		};
+		this.#updateTotalTime = () => {
+			Observable.notify(this, "duration");
+			if (!Number.isFinite(this.#playerEl.duration) || this.#playerEl.duration <= 0) {
+				if (this.durationFallback) this.#fetchAndCacheAudioBuffer();
+			}
+		};
+		this.#updateCurrentTimeOnSliderChange = () => {
+			if (!this.paused && this.#sliderEl.isDragging) {
+				this.pause();
+				this.#dragInterval = window.setInterval(() => {
+					/* v8 ignore else -- @preserve */
+					if (!this.#sliderEl.isDragging || !this.isConnected) {
+						clearInterval(this.#dragInterval);
+						if (this.isConnected) this.play();
+					}
+				}, 0);
+			}
+			if (this.#isProgrammaticSliderUpdate) return;
+			this.currentTime = this.duration * Number(this.#sliderEl.value) / 100;
+		};
+		this.#setPausedState = () => {
+			Observable.notify(this, "paused");
+		};
+	}
 	/**
 	* @internal
 	*/
@@ -132,76 +201,6 @@ var AudioPlayer = class extends Localized(VividElement) {
 	}
 	#playerEl;
 	#isProgrammaticSliderUpdate;
-	constructor() {
-		super();
-		this.playButtonAriaLabel = null;
-		this.pauseButtonAriaLabel = null;
-		this.sliderAriaLabel = null;
-		this.skipForwardButtonAriaLabel = null;
-		this.skipBackwardButtonAriaLabel = null;
-		this.disabled = false;
-		this.notime = false;
-		this.playbackRates = null;
-		this.#playerEl = new Audio();
-		this.#isProgrammaticSliderUpdate = false;
-		this.durationFallback = false;
-		this.#onPlay = () => {
-			if (!this.#sliderEl?.isDragging) this.$emit("play", void 0, { bubbles: false });
-		};
-		this.#onPause = () => {
-			if (!this.#sliderEl?.isDragging) this.$emit("pause", void 0, { bubbles: false });
-		};
-		this.#pausedChanged = (pausing) => {
-			if (pausing === this.paused) {
-				this.#setPausedState();
-				return;
-			}
-			if (!this.paused) this.#playerEl.pause();
-			else {
-				this.#updateProgress();
-				this.#playerEl.play();
-			}
-			this.#setPausedState();
-		};
-		this.#updateProgress = () => {
-			Observable.notify(this, "currentTime");
-			const duration = this.duration;
-			const currentTime = this.currentTime;
-			const isValid = Number.isFinite(duration) && duration > 0 && Number.isFinite(currentTime) && currentTime >= 0;
-			const percent = isValid ? currentTime / duration * 100 : 0;
-			/* v8 ignore else -- @preserve */
-			if (this.#sliderEl) {
-				this.#isProgrammaticSliderUpdate = true;
-				this.#sliderEl.value = percent.toString();
-				this.#isProgrammaticSliderUpdate = false;
-			}
-			if (isValid && percent === 100) this.pause();
-		};
-		this.#updateTotalTime = () => {
-			Observable.notify(this, "duration");
-			if (!Number.isFinite(this.#playerEl.duration) || this.#playerEl.duration <= 0) {
-				if (this.durationFallback) this.#fetchAndCacheAudioBuffer();
-			}
-		};
-		this.#updateCurrentTimeOnSliderChange = () => {
-			if (!this.paused && this.#sliderEl.isDragging) {
-				this.pause();
-				this.#dragInterval = window.setInterval(() => {
-					/* v8 ignore else -- @preserve */
-					if (!this.#sliderEl.isDragging || !this.isConnected) {
-						clearInterval(this.#dragInterval);
-						if (this.isConnected) this.play();
-					}
-				}, 0);
-			}
-			if (this.#isProgrammaticSliderUpdate) return;
-			/* v8 ignore else -- @preserve */
-			if (this.#playerEl) this.currentTime = this.duration * Number(this.#sliderEl.value) / 100;
-		};
-		this.#setPausedState = () => {
-			Observable.notify(this, "paused");
-		};
-	}
 	connectedCallback() {
 		super.connectedCallback();
 		this.#playerEl.addEventListener("timeupdate", this.#updateProgress);
@@ -274,7 +273,7 @@ __decorate([attr({
 })], AudioPlayer.prototype, "durationFallback", void 0);
 //#endregion
 //#region src/lib/audio-player/audio-player.template.ts
-var getClasses = ({ notime, disabled, duration, skipBy, playbackRates }) => classNames(["disabled", Boolean(disabled) || !duration], ["two-lines", !notime && (Boolean(Number(skipBy)) || Boolean(playbackRates))], ["playback", Boolean(playbackRates)]);
+var getClasses = ({ notime, disabled, duration, skipBy, playbackRates }) => classNames(["disabled", disabled || !duration], ["two-lines", !notime && (Boolean(Number(skipBy)) || Boolean(playbackRates))], ["playback", Boolean(playbackRates)]);
 var isMenuItemChekced = (playbackRate, { parent }) => {
 	return playbackRate === parent.playbackRate;
 };
@@ -329,12 +328,10 @@ function renderSlider(context) {
 }
 function renderTimestamp() {
 	return html` <div class="time-stamp">
-		<span class="current-time"
-			>${(x) => formatTime(x.currentTime || 0)}</span
-		>
+		<span class="current-time">${(x) => formatTime(x.currentTime || 0)}</span>
 		${when((x) => x.duration && x.duration !== Infinity, html`
 				<span>/</span>
-				<span class="total-time">${(x) => formatTime(x?.duration)}</span>
+				<span class="total-time">${(x) => formatTime(x.duration)}</span>
 			`)}
 	</div>`;
 }

package/unbundled/definition15.cjs

@@ -41,7 +41,7 @@ var getClasses = ({ appearance, connotation, shape, size }) => (0, _microsoft_fa
 */
 function renderIcon(iconTag) {
 	return _microsoft_fast_element.html`
-		<${iconTag} name="${(x) => x.icon ? `${x.icon}` : "user-line"}"></${iconTag}>
+		<${iconTag} name="${(x) => x.icon ? x.icon : "user-line"}"></${iconTag}>
 	`;
 }
 /**

package/unbundled/definition15.js

@@ -40,7 +40,7 @@ var getClasses = ({ appearance, connotation, shape, size }) => classNames("base"
 */
 function renderIcon(iconTag) {
 	return html`
-		<${iconTag} name="${(x) => x.icon ? `${x.icon}` : "user-line"}"></${iconTag}>
+		<${iconTag} name="${(x) => x.icon ? x.icon : "user-line"}"></${iconTag}>
 	`;
 }
 /**

package/unbundled/definition17.cjs

@@ -10,7 +10,7 @@ const require_enums = require("./enums.cjs");
 let _microsoft_fast_element = require("@microsoft/fast-element");
 let _microsoft_fast_web_utilities = require("@microsoft/fast-web-utilities");
 //#region src/lib/banner/banner.scss?inline
-var banner_default = ":host{display:block}.control.connotation-success{--_connotation-color-primary:var(--vvd-banner-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-banner-success-primary-text,var(--vvd-color-canvas))}.control.connotation-alert{--_connotation-color-primary:var(--vvd-banner-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-banner-alert-primary-text,var(--vvd-color-canvas))}.control.connotation-announcement{--_connotation-color-primary:var(--vvd-banner-announcement-primary,var(--vvd-color-announcement-500));--_connotation-color-primary-text:var(--vvd-banner-announcement-primary-text,var(--vvd-color-canvas))}.control.connotation-warning{--_connotation-color-primary:var(--vvd-banner-warning-primary,var(--vvd-color-warning-300));--_connotation-color-primary-text:var(--vvd-banner-warning-primary-text,var(--vvd-color-canvas-text))}.control:not(.connotation-success,.connotation-alert,.connotation-announcement,.connotation-warning){--_connotation-color-primary:var(--vvd-banner-information-primary,var(--vvd-color-information-500));--_connotation-color-primary-text:var(--vvd-banner-information-primary-text,var(--vvd-color-canvas))}.control{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent;background-color:var(--_appearance-color-fill);max-height:160px;color:var(--_appearance-color-text);transition:max-height var(--transition-delay,.2s);overflow:hidden}.control.removing{max-height:0}.header{box-sizing:border-box;font:var(--vvd-typography-base-bold);inline-size:100%;min-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 20));align-items:center;display:flex}.header .content{flex-grow:1;justify-content:center;align-items:center;column-gap:16px;inline-size:100%;padding:10px 16px;display:flex}.header .content slot[name=icon]{flex-shrink:0;font-size:20px;line-height:1}.header .content .action-items{flex-shrink:0}.header .dismiss-button{flex-shrink:0;margin-inline-end:8px}";
+var banner_default = ":host{display:block}.control.connotation-success{--_connotation-color-primary:var(--vvd-banner-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-banner-success-primary-text,var(--vvd-color-canvas))}.control.connotation-alert{--_connotation-color-primary:var(--vvd-banner-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-banner-alert-primary-text,var(--vvd-color-canvas))}.control.connotation-announcement{--_connotation-color-primary:var(--vvd-banner-announcement-primary,var(--vvd-color-announcement-500));--_connotation-color-primary-text:var(--vvd-banner-announcement-primary-text,var(--vvd-color-canvas))}.control.connotation-warning{--_connotation-color-primary:var(--vvd-banner-warning-primary,var(--vvd-color-warning-300));--_connotation-color-primary-text:var(--vvd-banner-warning-primary-text,var(--vvd-color-canvas-text))}.control:not(.connotation-success,.connotation-alert,.connotation-announcement,.connotation-warning){--_connotation-color-primary:var(--vvd-banner-information-primary,var(--vvd-color-information-500));--_connotation-color-primary-text:var(--vvd-banner-information-primary-text,var(--vvd-color-canvas))}.control{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent;background-color:var(--_appearance-color-fill);max-height:160px;color:var(--_appearance-color-text);transition:max-height var(--transition-delay,.2s);overflow:hidden}@media (prefers-reduced-motion:reduce){.control{transition-duration:.01ms}}.control.removing{max-height:0}.header{box-sizing:border-box;font:var(--vvd-typography-base-bold);inline-size:100%;min-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 20));align-items:center;display:flex}.header .content{flex-grow:1;justify-content:center;align-items:center;column-gap:16px;inline-size:100%;padding:10px 16px;display:flex}.header .content slot[name=icon]{flex-shrink:0;font-size:20px;line-height:1}.header .content .action-items{flex-shrink:0}.header .dismiss-button{flex-shrink:0;margin-inline-end:8px}";
 //#endregion
 //#region src/lib/banner/banner.ts
 var CONNOTATION_ICON_MAP = {
@@ -37,7 +37,7 @@ var Banner = class extends require_affix.AffixIcon(require_localized.Localized(r
 		this.removable = false;
 		this.#handleRemoveEnd = () => {
 			this.$emit("removed");
-			this.parentElement && this.parentElement.removeChild(this);
+			this.parentElement?.removeChild(this);
 		};
 		this.#closeOnKeyDown = (e) => {
 			if (e.key !== "Escape" || !this.removable) return;

package/unbundled/definition17.js

@@ -9,7 +9,7 @@ import { r as Connotation } from "./enums.js";
 import { attr, html, observable, slotted, when } from "@microsoft/fast-element";
 import { classNames } from "@microsoft/fast-web-utilities";
 //#region src/lib/banner/banner.scss?inline
-var banner_default = ":host{display:block}.control.connotation-success{--_connotation-color-primary:var(--vvd-banner-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-banner-success-primary-text,var(--vvd-color-canvas))}.control.connotation-alert{--_connotation-color-primary:var(--vvd-banner-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-banner-alert-primary-text,var(--vvd-color-canvas))}.control.connotation-announcement{--_connotation-color-primary:var(--vvd-banner-announcement-primary,var(--vvd-color-announcement-500));--_connotation-color-primary-text:var(--vvd-banner-announcement-primary-text,var(--vvd-color-canvas))}.control.connotation-warning{--_connotation-color-primary:var(--vvd-banner-warning-primary,var(--vvd-color-warning-300));--_connotation-color-primary-text:var(--vvd-banner-warning-primary-text,var(--vvd-color-canvas-text))}.control:not(.connotation-success,.connotation-alert,.connotation-announcement,.connotation-warning){--_connotation-color-primary:var(--vvd-banner-information-primary,var(--vvd-color-information-500));--_connotation-color-primary-text:var(--vvd-banner-information-primary-text,var(--vvd-color-canvas))}.control{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent;background-color:var(--_appearance-color-fill);max-height:160px;color:var(--_appearance-color-text);transition:max-height var(--transition-delay,.2s);overflow:hidden}.control.removing{max-height:0}.header{box-sizing:border-box;font:var(--vvd-typography-base-bold);inline-size:100%;min-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 20));align-items:center;display:flex}.header .content{flex-grow:1;justify-content:center;align-items:center;column-gap:16px;inline-size:100%;padding:10px 16px;display:flex}.header .content slot[name=icon]{flex-shrink:0;font-size:20px;line-height:1}.header .content .action-items{flex-shrink:0}.header .dismiss-button{flex-shrink:0;margin-inline-end:8px}";
+var banner_default = ":host{display:block}.control.connotation-success{--_connotation-color-primary:var(--vvd-banner-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-banner-success-primary-text,var(--vvd-color-canvas))}.control.connotation-alert{--_connotation-color-primary:var(--vvd-banner-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-banner-alert-primary-text,var(--vvd-color-canvas))}.control.connotation-announcement{--_connotation-color-primary:var(--vvd-banner-announcement-primary,var(--vvd-color-announcement-500));--_connotation-color-primary-text:var(--vvd-banner-announcement-primary-text,var(--vvd-color-canvas))}.control.connotation-warning{--_connotation-color-primary:var(--vvd-banner-warning-primary,var(--vvd-color-warning-300));--_connotation-color-primary-text:var(--vvd-banner-warning-primary-text,var(--vvd-color-canvas-text))}.control:not(.connotation-success,.connotation-alert,.connotation-announcement,.connotation-warning){--_connotation-color-primary:var(--vvd-banner-information-primary,var(--vvd-color-information-500));--_connotation-color-primary-text:var(--vvd-banner-information-primary-text,var(--vvd-color-canvas))}.control{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent;background-color:var(--_appearance-color-fill);max-height:160px;color:var(--_appearance-color-text);transition:max-height var(--transition-delay,.2s);overflow:hidden}@media (prefers-reduced-motion:reduce){.control{transition-duration:.01ms}}.control.removing{max-height:0}.header{box-sizing:border-box;font:var(--vvd-typography-base-bold);inline-size:100%;min-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 20));align-items:center;display:flex}.header .content{flex-grow:1;justify-content:center;align-items:center;column-gap:16px;inline-size:100%;padding:10px 16px;display:flex}.header .content slot[name=icon]{flex-shrink:0;font-size:20px;line-height:1}.header .content .action-items{flex-shrink:0}.header .dismiss-button{flex-shrink:0;margin-inline-end:8px}";
 //#endregion
 //#region src/lib/banner/banner.ts
 var CONNOTATION_ICON_MAP = {
@@ -36,7 +36,7 @@ var Banner = class extends AffixIcon(Localized(DelegatesAria(VividElement))) {
 		this.removable = false;
 		this.#handleRemoveEnd = () => {
 			this.$emit("removed");
-			this.parentElement && this.parentElement.removeChild(this);
+			this.parentElement?.removeChild(this);
 		};
 		this.#closeOnKeyDown = (e) => {
 			if (e.key !== "Escape" || !this.removable) return;

package/unbundled/definition19.cjs

@@ -61,7 +61,8 @@ var Breadcrumb = class extends require_delegates_aria.DelegatesAria(require_vivi
 	*/
 	setAriaCurrent(item, isLastNode) {
 		const childNodeWithHref = this.findChildWithHref(item);
-		if (childNodeWithHref !== null) isLastNode ? childNodeWithHref.setAttribute("aria-current", "page") : childNodeWithHref.removeAttribute("aria-current");
+		if (childNodeWithHref !== null) if (isLastNode) childNodeWithHref.setAttribute("aria-current", "page");
+		else childNodeWithHref.removeAttribute("aria-current");
 	}
 };
 require_decorate.__decorate([_microsoft_fast_element.observable], Breadcrumb.prototype, "slottedBreadcrumbItems", void 0);

package/unbundled/definition19.js

@@ -60,7 +60,8 @@ var Breadcrumb = class extends DelegatesAria(VividElement) {
 	*/
 	setAriaCurrent(item, isLastNode) {
 		const childNodeWithHref = this.findChildWithHref(item);
-		if (childNodeWithHref !== null) isLastNode ? childNodeWithHref.setAttribute("aria-current", "page") : childNodeWithHref.removeAttribute("aria-current");
+		if (childNodeWithHref !== null) if (isLastNode) childNodeWithHref.setAttribute("aria-current", "page");
+		else childNodeWithHref.removeAttribute("aria-current");
 	}
 };
 __decorate([observable], Breadcrumb.prototype, "slottedBreadcrumbItems", void 0);

package/unbundled/definition2.cjs

@@ -93,7 +93,7 @@ var header = (context, hTagName) => {
 	`;
 };
 var AccordionItemTemplate = (context) => _microsoft_fast_element.html`
-	${(x) => header(context, "h" + x.headinglevel)}
+	${(x) => header(context, `h${x.headinglevel}`)}
 	<div
 		id="${(x) => x.id}-panel"
 		aria-labelledby="${(x) => x.id}"

package/unbundled/definition2.js

@@ -92,7 +92,7 @@ var header = (context, hTagName) => {
 	`;
 };
 var AccordionItemTemplate = (context) => html`
-	${(x) => header(context, "h" + x.headinglevel)}
+	${(x) => header(context, `h${x.headinglevel}`)}
 	<div
 		id="${(x) => x.id}-panel"
 		aria-labelledby="${(x) => x.id}"

package/unbundled/definition21.cjs

@@ -44,7 +44,7 @@ function getDay(el) {
 	if (cellOrHeader) {
 		const { parentElement } = cellOrHeader;
 		/* v8 ignore else -- @preserve */
-		if (parentElement) return parentElement.children && Array.from(parentElement.children).indexOf(cellOrHeader);
+		if (parentElement) return Array.from(parentElement.children).indexOf(cellOrHeader);
 	}
 }
 function getHour(e, el, hours) {
@@ -58,7 +58,7 @@ function getHour(e, el, hours) {
 var getEventContext = function(e) {
 	if (!(e instanceof KeyboardEvent || e instanceof MouseEvent)) throw new Error("Invalid event. Event must be instance of KeyboardEvent or MouseEvent");
 	const [el] = e.composedPath();
-	if (!(el && el instanceof HTMLElement && this.shadowRoot.contains(el))) throw new Error("Invalid event. Event must contain a target object which is a direct descendant of calendar");
+	if (!(el instanceof HTMLElement && this.shadowRoot.contains(el))) throw new Error("Invalid event. Event must contain a target object which is a direct descendant of calendar");
 	const day = getDay(el);
 	let hour;
 	if (e instanceof MouseEvent) hour = getHour(e, el, this._hours);
@@ -97,7 +97,7 @@ var Calendar = class extends require_vivid_element.VividElement {
 		this.stickyMode = require_enums.Sticky.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((d, i) => new Date(d.setHours(++i)));
+		this.hoursAsDatetime = Array.from({ length: this._hours - 1 }).fill(new Date((/* @__PURE__ */ new Date()).setHours(0, 0, 0))).map((d, i) => new Date(d.setHours(i + 1)));
 		this._generateDaysArr = (dateArr) => {
 			if (dateArr.length == this._days) return dateArr;
 			const lastDate = new Date(dateArr[dateArr.length - 1]);

package/unbundled/definition21.js

@@ -43,7 +43,7 @@ function getDay(el) {
 	if (cellOrHeader) {
 		const { parentElement } = cellOrHeader;
 		/* v8 ignore else -- @preserve */
-		if (parentElement) return parentElement.children && Array.from(parentElement.children).indexOf(cellOrHeader);
+		if (parentElement) return Array.from(parentElement.children).indexOf(cellOrHeader);
 	}
 }
 function getHour(e, el, hours) {
@@ -57,7 +57,7 @@ function getHour(e, el, hours) {
 var getEventContext = function(e) {
 	if (!(e instanceof KeyboardEvent || e instanceof MouseEvent)) throw new Error("Invalid event. Event must be instance of KeyboardEvent or MouseEvent");
 	const [el] = e.composedPath();
-	if (!(el && el instanceof HTMLElement && this.shadowRoot.contains(el))) throw new Error("Invalid event. Event must contain a target object which is a direct descendant of calendar");
+	if (!(el instanceof HTMLElement && this.shadowRoot.contains(el))) throw new Error("Invalid event. Event must contain a target object which is a direct descendant of calendar");
 	const day = getDay(el);
 	let hour;
 	if (e instanceof MouseEvent) hour = getHour(e, el, this._hours);
@@ -96,7 +96,7 @@ var Calendar = class extends VividElement {
 		this.stickyMode = Sticky.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((d, i) => new Date(d.setHours(++i)));
+		this.hoursAsDatetime = Array.from({ length: this._hours - 1 }).fill(new Date((/* @__PURE__ */ new Date()).setHours(0, 0, 0))).map((d, i) => new Date(d.setHours(i + 1)));
 		this._generateDaysArr = (dateArr) => {
 			if (dateArr.length == this._days) return dateArr;
 			const lastDate = new Date(dateArr[dateArr.length - 1]);

package/unbundled/definition23.cjs

@@ -78,7 +78,7 @@ var Checkbox = class extends require_delegates_aria.DelegatesAria(require_mixins
 	*/
 	checkedChanged(prev, next) {
 		super.checkedChanged(prev, next);
-		this.ariaChecked = next == true ? "true" : "false";
+		this.ariaChecked = next ? "true" : "false";
 		if (prev !== void 0) this.$emit("input");
 	}
 };
@@ -96,7 +96,7 @@ require_decorate.__decorate([(0, _microsoft_fast_element.attr)({
 require_decorate.__decorate([_microsoft_fast_element.observable], Checkbox.prototype, "slottedContent", void 0);
 //#endregion
 //#region src/lib/checkbox/checkbox.template.ts
-var getClasses = ({ connotation, readOnly, checked, disabled, indeterminate, errorValidationMessage, successText, label, slottedContent }) => (0, _microsoft_fast_web_utilities.classNames)("base", [`connotation-${connotation}`, Boolean(connotation)], ["readonly", Boolean(readOnly)], ["checked", Boolean(checked) || Boolean(indeterminate)], ["disabled", Boolean(disabled)], ["error connotation-alert", Boolean(errorValidationMessage)], ["success connotation-success", !!successText], ["hide-label", !label && !slottedContent?.length]);
+var getClasses = ({ connotation, readOnly, checked, disabled, indeterminate, errorValidationMessage, successText, label, slottedContent }) => (0, _microsoft_fast_web_utilities.classNames)("base", [`connotation-${connotation}`, Boolean(connotation)], ["readonly", readOnly], ["checked", checked || indeterminate], ["disabled", disabled], ["error connotation-alert", Boolean(errorValidationMessage)], ["success connotation-success", !!successText], ["hide-label", !label && !slottedContent?.length]);
 var CheckboxTemplate = (context) => {
 	const iconTag = context.tagFor(require_definition.Icon);
 	return _microsoft_fast_element.html`<template>

package/unbundled/definition23.js

@@ -77,7 +77,7 @@ var Checkbox = class extends DelegatesAria(WithFeedback(WithErrorText(WithSucces
 	*/
 	checkedChanged(prev, next) {
 		super.checkedChanged(prev, next);
-		this.ariaChecked = next == true ? "true" : "false";
+		this.ariaChecked = next ? "true" : "false";
 		if (prev !== void 0) this.$emit("input");
 	}
 };
@@ -95,7 +95,7 @@ __decorate([attr({
 __decorate([observable], Checkbox.prototype, "slottedContent", void 0);
 //#endregion
 //#region src/lib/checkbox/checkbox.template.ts
-var getClasses = ({ connotation, readOnly, checked, disabled, indeterminate, errorValidationMessage, successText, label, slottedContent }) => classNames("base", [`connotation-${connotation}`, Boolean(connotation)], ["readonly", Boolean(readOnly)], ["checked", Boolean(checked) || Boolean(indeterminate)], ["disabled", Boolean(disabled)], ["error connotation-alert", Boolean(errorValidationMessage)], ["success connotation-success", !!successText], ["hide-label", !label && !slottedContent?.length]);
+var getClasses = ({ connotation, readOnly, checked, disabled, indeterminate, errorValidationMessage, successText, label, slottedContent }) => classNames("base", [`connotation-${connotation}`, Boolean(connotation)], ["readonly", readOnly], ["checked", checked || indeterminate], ["disabled", disabled], ["error connotation-alert", Boolean(errorValidationMessage)], ["success connotation-success", !!successText], ["hide-label", !label && !slottedContent?.length]);
 var CheckboxTemplate = (context) => {
 	const iconTag = context.tagFor(Icon);
 	return html`<template>

package/unbundled/definition24.cjs

@@ -70,7 +70,7 @@ var Toggletip = class extends require_localized.Localized(require_anchored.Ancho
 	#setupAnchor(a) {
 		a.addEventListener("click", this.#openIfClosed, true);
 		this.#originalAriaLabel = a.ariaLabel;
-		a.ariaLabel = `${this.locale.toggletip.anchorLabel(a.ariaLabel || "")}`;
+		a.ariaLabel = this.locale.toggletip.anchorLabel(a.ariaLabel || "");
 		this.#updateAnchor(a);
 	}
 	#updateAnchor(a) {

package/unbundled/definition24.js

@@ -69,7 +69,7 @@ var Toggletip = class extends Localized(Anchored(VividElement)) {
 	#setupAnchor(a) {
 		a.addEventListener("click", this.#openIfClosed, true);
 		this.#originalAriaLabel = a.ariaLabel;
-		a.ariaLabel = `${this.locale.toggletip.anchorLabel(a.ariaLabel || "")}`;
+		a.ariaLabel = this.locale.toggletip.anchorLabel(a.ariaLabel || "");
 		this.#updateAnchor(a);
 	}
 	#updateAnchor(a) {

package/unbundled/definition27.cjs

@@ -96,7 +96,7 @@ require_decorate.__decorate([(0, _microsoft_fast_element.attr)({ mode: "fromView
 require_decorate.__decorate([(0, _microsoft_fast_element.attr)({ mode: "boolean" })], Tooltip.prototype, "open", void 0);
 //#endregion
 //#region src/lib/tooltip/tooltip.template.ts
-var getClasses = ({ open }) => (0, _microsoft_fast_web_utilities.classNames)("control", ["open", Boolean(open)]);
+var getClasses = ({ open }) => (0, _microsoft_fast_web_utilities.classNames)("control", ["open", open]);
 var TooltipTemplate = (context) => {
 	const popupTag = context.tagFor(require_definition.Popup);
 	return _microsoft_fast_element.html`

package/unbundled/definition27.js

@@ -95,7 +95,7 @@ __decorate([attr({ mode: "fromView" })], Tooltip.prototype, "placement", void 0)
 __decorate([attr({ mode: "boolean" })], Tooltip.prototype, "open", void 0);
 //#endregion
 //#region src/lib/tooltip/tooltip.template.ts
-var getClasses = ({ open }) => classNames("control", ["open", Boolean(open)]);
+var getClasses = ({ open }) => classNames("control", ["open", open]);
 var TooltipTemplate = (context) => {
 	const popupTag = context.tagFor(Popup);
 	return html`