@vonage/vivid 5.23.1-preview.0 → 5.24.0

package/unbundled/base-color-picker.cjs

@@ -1,8 +1,8 @@
 require("./chunk.cjs");
 const require_decorate = require("./decorate.cjs");
 const require_form_associated = require("./form-associated.cjs");
-const require_form_element = require("./form-element.cjs");
 const require_localized = require("./localized.cjs");
+const require_form_element = require("./form-element.cjs");
 let _microsoft_fast_element = require("@microsoft/fast-element");
 let _microsoft_fast_web_utilities = require("@microsoft/fast-web-utilities");
 //#region src/shared/color-picker/utils.ts
@@ -13,15 +13,11 @@ function parseHexColor(input) {
 	if (/^[0-9a-fA-F]{6}$/.test(hex)) return hex.toLowerCase();
 	return null;
 }
-/**
-* Check if input value is valid hex color
-*/
+/** Check if input value is valid hex color */
 function isValidHexColor(input) {
 	return parseHexColor(input) !== null;
 }
-/**
-* Calculate the relative luminance of a hex color using WCAG formula
-*/
+/** Calculate the relative luminance of a hex color using WCAG formula */
 function getLuminance(hexColor) {
 	const hex = parseHexColor(hexColor);
 	if (!hex) return 0;
@@ -33,9 +29,7 @@ function getLuminance(hexColor) {
 	const sB = b <= .03928 ? b / 12.92 : Math.pow((b + .055) / 1.055, 2.4);
 	return .2126 * sR + .7152 * sG + .0722 * sB;
 }
-/**
-* Calculate contrast ratio between two colors
-*/
+/** Calculate contrast ratio between two colors */
 function getContrastRatio(color1, color2) {
 	const lum1 = getLuminance(color1);
 	const lum2 = getLuminance(color2);
@@ -43,18 +37,14 @@ function getContrastRatio(color1, color2) {
 	const darkest = Math.min(lum1, lum2);
 	return (brightest + .05) / (darkest + .05);
 }
-/**
-* Get CSS custom property value from the document
-*/
+/** Get CSS custom property value from the document */
 function getCSSCustomProperty(propertyName, element) {
 	if (!element) element = document.querySelector(".vvd-root") || document.documentElement;
 	return getComputedStyle(element).getPropertyValue(propertyName).trim();
 }
 //#endregion
 //#region src/shared/color-picker/base-color-picker.ts
-/**
-* Base mixin for Color Picker components
-*/
+/** Base mixin for Color Picker components */
 var BaseColorPicker = (Base) => {
 	class BaseColorPickerElement extends require_localized.Localized(require_form_element.FormElement(require_form_associated.FormAssociated(Base))) {
 		constructor(..._args) {
@@ -70,72 +60,52 @@ var BaseColorPicker = (Base) => {
 				this._refreshCanvasColor();
 			});
 		}
-		/**
-		* @internal
-		*/
+		/** @internal */
 		get _computedCanvasColor() {
 			if (!this._canvasColor) this._canvasColor = getCSSCustomProperty("--vvd-color-canvas", this);
 			return this._canvasColor;
 		}
-		/**
-		* @internal
-		*/
+		/** @internal */
 		_refreshCanvasColor() {
 			this._canvasColor = getCSSCustomProperty("--vvd-color-canvas", this);
 		}
-		/**
-		* @internal
-		*/
+		/** @internal */
 		_applyContrastClass(color, threshold = 3) {
 			if (!color) return false;
 			const canvasColor = this._computedCanvasColor;
 			if (!canvasColor) return false;
 			return getContrastRatio(color, canvasColor) < threshold;
 		}
-		/**
-		* @internal
-		*/
+		/** @internal */
 		_getRowLength() {
 			return 7;
 		}
-		/**
-		* @internal
-		*/
+		/** @internal */
 		_handleSwatchSelection(value) {
 			if (this.value === value) this.value = "";
 			else this.value = value;
 			this.$emit("change");
 			this.open = false;
 		}
-		/**
-		* @internal
-		*/
+		/** @internal */
 		/* v8 ignore next */
 		_handleColorSaving() {}
-		/**
-		* @internal
-		*/
+		/** @internal */
 		_getFocusReturnEl() {
 			return null;
 		}
-		/**
-		* @internal
-		*/
+		/** @internal */
 		_returnFocusToAnchor() {
 			const el = this._getFocusReturnEl();
 			if (!el) return;
 			_microsoft_fast_element.Updates.enqueue(() => el.focus());
 		}
-		/**
-		* @internal
-		*/
+		/** @internal */
 		_getGridCells() {
 			const grid = this.shadowRoot?.querySelector("[role=\"grid\"]");
 			return grid ? Array.from(grid.querySelectorAll("[role=\"gridcell\"], [data-vvd-role=\"gridcell\"]")) : [];
 		}
-		/**
-		* @internal
-		*/
+		/** @internal */
 		_handleCellKeydown(event, value, index, isSaveCell) {
 			const rowLength = this._getRowLength();
 			const totalCells = this._getGridCells().length;
@@ -198,17 +168,13 @@ var BaseColorPicker = (Base) => {
 				default: return true;
 			}
 		}
-		/**
-		* @internal
-		*/
+		/** @internal */
 		_focusSwatchByIndex(index) {
 			const cells = this._getGridCells();
 			if (index < 0 || index >= cells.length) return;
 			cells[index]?.focus();
 		}
-		/**
-		* @internal
-		*/
+		/** @internal */
 		_renderColorSwatch(iconTag, tooltipTag) {
 			return _microsoft_fast_element.html`
 				<${tooltipTag} placement="top"

package/unbundled/base-color-picker.js

@@ -1,7 +1,7 @@
 import { t as __decorate } from "./decorate.js";
 import { n as FormAssociated } from "./form-associated.js";
-import { t as FormElement } from "./form-element.js";
 import { t as Localized } from "./localized.js";
+import { t as FormElement } from "./form-element.js";
 import { Updates, attr, html, observable, when } from "@microsoft/fast-element";
 import { classNames } from "@microsoft/fast-web-utilities";
 //#region src/shared/color-picker/utils.ts
@@ -12,15 +12,11 @@ function parseHexColor(input) {
 	if (/^[0-9a-fA-F]{6}$/.test(hex)) return hex.toLowerCase();
 	return null;
 }
-/**
-* Check if input value is valid hex color
-*/
+/** Check if input value is valid hex color */
 function isValidHexColor(input) {
 	return parseHexColor(input) !== null;
 }
-/**
-* Calculate the relative luminance of a hex color using WCAG formula
-*/
+/** Calculate the relative luminance of a hex color using WCAG formula */
 function getLuminance(hexColor) {
 	const hex = parseHexColor(hexColor);
 	if (!hex) return 0;
@@ -32,9 +28,7 @@ function getLuminance(hexColor) {
 	const sB = b <= .03928 ? b / 12.92 : Math.pow((b + .055) / 1.055, 2.4);
 	return .2126 * sR + .7152 * sG + .0722 * sB;
 }
-/**
-* Calculate contrast ratio between two colors
-*/
+/** Calculate contrast ratio between two colors */
 function getContrastRatio(color1, color2) {
 	const lum1 = getLuminance(color1);
 	const lum2 = getLuminance(color2);
@@ -42,18 +36,14 @@ function getContrastRatio(color1, color2) {
 	const darkest = Math.min(lum1, lum2);
 	return (brightest + .05) / (darkest + .05);
 }
-/**
-* Get CSS custom property value from the document
-*/
+/** Get CSS custom property value from the document */
 function getCSSCustomProperty(propertyName, element) {
 	if (!element) element = document.querySelector(".vvd-root") || document.documentElement;
 	return getComputedStyle(element).getPropertyValue(propertyName).trim();
 }
 //#endregion
 //#region src/shared/color-picker/base-color-picker.ts
-/**
-* Base mixin for Color Picker components
-*/
+/** Base mixin for Color Picker components */
 var BaseColorPicker = (Base) => {
 	class BaseColorPickerElement extends Localized(FormElement(FormAssociated(Base))) {
 		constructor(..._args) {
@@ -69,72 +59,52 @@ var BaseColorPicker = (Base) => {
 				this._refreshCanvasColor();
 			});
 		}
-		/**
-		* @internal
-		*/
+		/** @internal */
 		get _computedCanvasColor() {
 			if (!this._canvasColor) this._canvasColor = getCSSCustomProperty("--vvd-color-canvas", this);
 			return this._canvasColor;
 		}
-		/**
-		* @internal
-		*/
+		/** @internal */
 		_refreshCanvasColor() {
 			this._canvasColor = getCSSCustomProperty("--vvd-color-canvas", this);
 		}
-		/**
-		* @internal
-		*/
+		/** @internal */
 		_applyContrastClass(color, threshold = 3) {
 			if (!color) return false;
 			const canvasColor = this._computedCanvasColor;
 			if (!canvasColor) return false;
 			return getContrastRatio(color, canvasColor) < threshold;
 		}
-		/**
-		* @internal
-		*/
+		/** @internal */
 		_getRowLength() {
 			return 7;
 		}
-		/**
-		* @internal
-		*/
+		/** @internal */
 		_handleSwatchSelection(value) {
 			if (this.value === value) this.value = "";
 			else this.value = value;
 			this.$emit("change");
 			this.open = false;
 		}
-		/**
-		* @internal
-		*/
+		/** @internal */
 		/* v8 ignore next */
 		_handleColorSaving() {}
-		/**
-		* @internal
-		*/
+		/** @internal */
 		_getFocusReturnEl() {
 			return null;
 		}
-		/**
-		* @internal
-		*/
+		/** @internal */
 		_returnFocusToAnchor() {
 			const el = this._getFocusReturnEl();
 			if (!el) return;
 			Updates.enqueue(() => el.focus());
 		}
-		/**
-		* @internal
-		*/
+		/** @internal */
 		_getGridCells() {
 			const grid = this.shadowRoot?.querySelector("[role=\"grid\"]");
 			return grid ? Array.from(grid.querySelectorAll("[role=\"gridcell\"], [data-vvd-role=\"gridcell\"]")) : [];
 		}
-		/**
-		* @internal
-		*/
+		/** @internal */
 		_handleCellKeydown(event, value, index, isSaveCell) {
 			const rowLength = this._getRowLength();
 			const totalCells = this._getGridCells().length;
@@ -197,17 +167,13 @@ var BaseColorPicker = (Base) => {
 				default: return true;
 			}
 		}
-		/**
-		* @internal
-		*/
+		/** @internal */
 		_focusSwatchByIndex(index) {
 			const cells = this._getGridCells();
 			if (index < 0 || index >= cells.length) return;
 			cells[index]?.focus();
 		}
-		/**
-		* @internal
-		*/
+		/** @internal */
 		_renderColorSwatch(iconTag, tooltipTag) {
 			return html`
 				<${tooltipTag} placement="top"

package/unbundled/base-progress.cjs

@@ -6,38 +6,28 @@ let _microsoft_fast_element = require("@microsoft/fast-element");
 /**
 * An Progress HTML Element.
 * Implements the {@link https://www.w3.org/TR/wai-aria-1.1/#progressbar | ARIA progressbar }.
-*
-* @public
 */
 var BaseProgress = class extends require_vivid_element.VividElement {
 	constructor(..._args) {
 		super(..._args);
 		this.percentComplete = 0;
 	}
-	/**
-	* @internal
-	*/
+	/** @internal */
 	valueChanged() {
 		/* v8 ignore if -- @preserve */
 		if (this.$fastController.isConnected) this.updatePercentComplete();
 	}
-	/**
-	* @internal
-	*/
+	/** @internal */
 	minChanged() {
 		/* v8 ignore if -- @preserve */
 		if (this.$fastController.isConnected) this.updatePercentComplete();
 	}
-	/**
-	* @private
-	*/
+	/** @private */
 	maxChanged() {
 		/* v8 ignore if -- @preserve */
 		if (this.$fastController.isConnected) this.updatePercentComplete();
 	}
-	/**
-	* @internal
-	*/
+	/** @internal */
 	connectedCallback() {
 		super.connectedCallback();
 		this.updatePercentComplete();

package/unbundled/base-progress.js

@@ -5,38 +5,28 @@ import { attr, nullableNumberConverter, observable } from "@microsoft/fast-eleme
 /**
 * An Progress HTML Element.
 * Implements the {@link https://www.w3.org/TR/wai-aria-1.1/#progressbar | ARIA progressbar }.
-*
-* @public
 */
 var BaseProgress = class extends VividElement {
 	constructor(..._args) {
 		super(..._args);
 		this.percentComplete = 0;
 	}
-	/**
-	* @internal
-	*/
+	/** @internal */
 	valueChanged() {
 		/* v8 ignore if -- @preserve */
 		if (this.$fastController.isConnected) this.updatePercentComplete();
 	}
-	/**
-	* @internal
-	*/
+	/** @internal */
 	minChanged() {
 		/* v8 ignore if -- @preserve */
 		if (this.$fastController.isConnected) this.updatePercentComplete();
 	}
-	/**
-	* @private
-	*/
+	/** @private */
 	maxChanged() {
 		/* v8 ignore if -- @preserve */
 		if (this.$fastController.isConnected) this.updatePercentComplete();
 	}
-	/**
-	* @internal
-	*/
+	/** @internal */
 	connectedCallback() {
 		super.connectedCallback();
 		this.updatePercentComplete();

package/unbundled/button.cjs

@@ -11,8 +11,6 @@ let _microsoft_fast_element = require("@microsoft/fast-element");
 *
 * @csspart control - The button element
 * @csspart content - The element wrapping button content
-*
-* @public
 */
 var VividFoundationButton = class extends require_delegates_aria.DelegatesAria(require_form_associated.FormAssociated(require_vivid_element.VividElement)) {
 	constructor(..._args) {
@@ -75,9 +73,7 @@ var VividFoundationButton = class extends require_delegates_aria.DelegatesAria(r
 	validate() {
 		super.validate(this.control);
 	}
-	/**
-	* @internal
-	*/
+	/** @internal */
 	connectedCallback() {
 		super.connectedCallback();
 		this.proxy.setAttribute("type", this.type);
@@ -89,9 +85,7 @@ var VividFoundationButton = class extends require_delegates_aria.DelegatesAria(r
 			span.addEventListener("click", this.handleClick);
 		});
 	}
-	/**
-	* @internal
-	*/
+	/** @internal */
 	disconnectedCallback() {
 		super.disconnectedCallback();
 		(this.control ? Array.from(this.control.children) : []).forEach((span) => {

package/unbundled/button.js

@@ -10,8 +10,6 @@ import { Updates, attr } from "@microsoft/fast-element";
 *
 * @csspart control - The button element
 * @csspart content - The element wrapping button content
-*
-* @public
 */
 var VividFoundationButton = class extends DelegatesAria(FormAssociated(VividElement)) {
 	constructor(..._args) {
@@ -74,9 +72,7 @@ var VividFoundationButton = class extends DelegatesAria(FormAssociated(VividElem
 	validate() {
 		super.validate(this.control);
 	}
-	/**
-	* @internal
-	*/
+	/** @internal */
 	connectedCallback() {
 		super.connectedCallback();
 		this.proxy.setAttribute("type", this.type);
@@ -88,9 +84,7 @@ var VividFoundationButton = class extends DelegatesAria(FormAssociated(VividElem
 			span.addEventListener("click", this.handleClick);
 		});
 	}
-	/**
-	* @internal
-	*/
+	/** @internal */
 	disconnectedCallback() {
 		super.disconnectedCallback();
 		(this.control ? Array.from(this.control.children) : []).forEach((span) => {