@vonage/vivid 5.24.0 → 5.25.0

package/unbundled/option.js

@@ -0,0 +1,164 @@
+import { t as VividElement } from "./vivid-element.js";
+import { t as __decorate } from "./decorate.js";
+import { n as AffixIconWithTrailing } from "./affix.js";
+import { t as HostSemantics } from "./host-semantics.js";
+import { attr, observable, volatile } from "@microsoft/fast-element";
+import { isHTMLElement } from "@microsoft/fast-web-utilities";
+//#region src/lib/option/option.ts
+/**
+* Determines if the element is a {@link (ListboxOption:class)}
+*
+* @param element - the element to test.
+*/
+function isListboxOption(el) {
+	return isHTMLElement(el) && (el.getAttribute("role") === "option" || el instanceof HTMLOptionElement || el instanceof ListboxOption);
+}
+/**
+* Implements [ARIA option](https://www.w3.org/TR/wai-aria-1.1/#option).
+*
+* @public
+* @component option
+* @slot icon - The preferred way to add an icon to the component.
+* @slot tag-icon - Icon to be displayed in the tag when selected inside a Searchable Select.
+* @slot trailing-meta - For additional elements at the end of the Option.
+* @testAction click click #locator
+*/
+var ListboxOption = class extends HostSemantics(AffixIconWithTrailing(VividElement)) {
+	defaultSelectedChanged() {
+		if (!this.dirtySelected) {
+			this.selected = this.defaultSelected;
+			if (this.proxy instanceof HTMLOptionElement) this.proxy.selected = this.defaultSelected;
+		}
+		if (this.proxy instanceof HTMLOptionElement) this.proxy.defaultSelected = this.defaultSelected;
+	}
+	disabledChanged() {
+		/* v8 ignore if -- @preserve */
+		if (this.proxy instanceof HTMLOptionElement) this.proxy.disabled = this.disabled;
+	}
+	/**
+	* Alias for `defaultSelected`, mirroring the option's initial selected state (the
+	* `selected` attribute). Distinct from `current-selected`, which reflects the
+	* option's live selected state.
+	* @deprecated Use `defaultSelected` instead.
+	*/
+	get selectedAttribute() {
+		return this.defaultSelected;
+	}
+	set selectedAttribute(value) {
+		this.defaultSelected = value;
+	}
+	selectedChanged() {
+		if (!this.dirtySelected) this.dirtySelected = true;
+		if (this.proxy instanceof HTMLOptionElement) this.proxy.selected = this.selected;
+	}
+	valueChanged() {
+		if (typeof this.value !== "string") {
+			this.value = "";
+			return;
+		}
+		if (this.proxy instanceof HTMLOptionElement) this.proxy.value = this.value;
+	}
+	get label() {
+		return this._label ?? this.text;
+	}
+	set label(value) {
+		this._label = value;
+	}
+	set text(value) {
+		this._text = value;
+	}
+	get text() {
+		return this._text ?? "";
+	}
+	/**
+	* Provides an accessible name for use by parent components.
+	* Note: Does not implement full accessible name computation, e.g. slotted content is missed.
+	* @internal
+	*/
+	_getAccessibleName() {
+		return this.ariaLabel || `${this.text}${this.textSecondary ? ` ${this.textSecondary}` : ""}`;
+	}
+	get form() {
+		return null;
+	}
+	/** @internal */
+	get _hasMatchedText() {
+		return Boolean(this.matchedText ?? this._vvdSearchText);
+	}
+	/**
+	* From is inclusive, to is exclusive.
+	* @internal
+	*/
+	get _matchedRange() {
+		const matchedText = this.matchedText ?? this._vvdSearchText;
+		if (matchedText) {
+			const matchIndex = this.text.toLowerCase().indexOf(matchedText.toLowerCase());
+			return matchIndex === -1 ? {
+				from: 0,
+				to: 0
+			} : {
+				from: matchIndex,
+				to: matchIndex + matchedText.length
+			};
+		}
+		return {
+			from: 0,
+			to: 0
+		};
+	}
+	constructor(text, value, defaultSelected, selected) {
+		super();
+		this.defaultSelected = false;
+		this.dirtySelected = false;
+		this.value = "";
+		this._highlighted = false;
+		this._displayCheckmark = false;
+		this._vvdSearchText = "";
+		this._isNotMatching = false;
+		if (text) this.text = text;
+		if (value) this.value = value;
+		if (defaultSelected) this.defaultSelected = defaultSelected;
+		if (selected) this.selected = selected;
+		this.proxy = new Option(this.text, this.value, this.defaultSelected, this.selected);
+		this.proxy.disabled = this.disabled;
+	}
+	/** @internal */
+	connectedCallback() {
+		super.connectedCallback();
+		if (!this.dirtySelected) {
+			this.selected = this.defaultSelected;
+			this.dirtySelected = false;
+		}
+	}
+};
+__decorate([attr({ converter: {
+	fromView: (value) => {
+		if (value === true || value === "true") return true;
+		if (value === false || value === "false") return false;
+	},
+	toView: (value) => value
+} })], ListboxOption.prototype, "checked", void 0);
+__decorate([attr({
+	attribute: "selected",
+	mode: "boolean"
+})], ListboxOption.prototype, "defaultSelected", void 0);
+__decorate([attr({ mode: "boolean" })], ListboxOption.prototype, "disabled", void 0);
+__decorate([attr({
+	attribute: "current-selected",
+	mode: "boolean"
+})], ListboxOption.prototype, "selected", void 0);
+__decorate([attr({ attribute: "value" })], ListboxOption.prototype, "value", void 0);
+__decorate([attr({ attribute: "label" })], ListboxOption.prototype, "_label", void 0);
+__decorate([attr({ attribute: "text" })], ListboxOption.prototype, "_text", void 0);
+__decorate([attr({ attribute: "text-secondary" })], ListboxOption.prototype, "textSecondary", void 0);
+__decorate([observable], ListboxOption.prototype, "_highlighted", void 0);
+__decorate([observable], ListboxOption.prototype, "_displayCheckmark", void 0);
+__decorate([attr({ attribute: "matched-text" })], ListboxOption.prototype, "matchedText", void 0);
+__decorate([observable], ListboxOption.prototype, "_vvdSearchText", void 0);
+__decorate([volatile], ListboxOption.prototype, "_hasMatchedText", null);
+__decorate([observable], ListboxOption.prototype, "_isNotMatching", void 0);
+__decorate([volatile], ListboxOption.prototype, "_matchedRange", null);
+__decorate([attr], ListboxOption.prototype, "connotation", void 0);
+__decorate([attr({ attribute: "tag-connotation" })], ListboxOption.prototype, "tagConnotation", void 0);
+//#endregion
+export { isListboxOption as n, ListboxOption as t };

package/unbundled/time-selection-picker.template.cjs

@@ -452,7 +452,7 @@ var ValidTimeFilter = {
 /**
 * @public
 * @component time-picker
-* @slot helper-text - Describes how to use the time-picker. Alternative to the `helper-text` attribute.
+* @slot helper-text - Describes how to use the Time Picker. Alternative to the `helper-text` attribute.
 * @event {CustomEvent<undefined>} input - Emitted when the time is changed by the user.
 * @event {CustomEvent<undefined>} change - Emitted when the time is changed by the user.
 * @vueModel modelValue value input,@lazy:change `event.currentTarget.value`

package/unbundled/time-selection-picker.template.js

@@ -451,7 +451,7 @@ var ValidTimeFilter = {
 /**
 * @public
 * @component time-picker
-* @slot helper-text - Describes how to use the time-picker. Alternative to the `helper-text` attribute.
+* @slot helper-text - Describes how to use the Time Picker. Alternative to the `helper-text` attribute.
 * @event {CustomEvent<undefined>} input - Emitted when the time is changed by the user.
 * @event {CustomEvent<undefined>} change - Emitted when the time is changed by the user.
 * @vueModel modelValue value input,@lazy:change `event.currentTarget.value`

package/unbundled/vivid-element.cjs

@@ -287,7 +287,7 @@ var ReplacedPropHandling = (Base) => {
 */
 var VividElement = class extends AriaMixin(ReplacedPropHandling(ReactiveControllerHostSupport(_microsoft_fast_element.FASTElement))) {
 	static {
-		this.VIVID_VERSION = "5.24.0";
+		this.VIVID_VERSION = "5.25.0";
 	}
 	/**
 	* Add data-vvd-component attribute with component name globally,

package/unbundled/vivid-element.js

@@ -286,7 +286,7 @@ var ReplacedPropHandling = (Base) => {
 */
 var VividElement = class extends AriaMixin(ReplacedPropHandling(ReactiveControllerHostSupport(FASTElement))) {
 	static {
-		this.VIVID_VERSION = "5.24.0";
+		this.VIVID_VERSION = "5.25.0";
 	}
 	/**
 	* Add data-vvd-component attribute with component name globally,

package/video-player/definition.cjs

@@ -1,5 +1,5 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_definition = require("../unbundled/definition81.cjs");
+const require_definition = require("../unbundled/definition82.cjs");
 exports.VwcVideoPlayerElement = require_definition.VideoPlayer;
 exports.registerVideoPlayer = require_definition.registerVideoPlayer;
 exports.videoPlayerDefinition = require_definition.videoPlayerDefinition;

package/video-player/definition.js

@@ -1,2 +1,2 @@
-import { n as videoPlayerDefinition, r as VideoPlayer, t as registerVideoPlayer } from "../unbundled/definition81.js";
+import { n as videoPlayerDefinition, r as VideoPlayer, t as registerVideoPlayer } from "../unbundled/definition82.js";
 export { VideoPlayer as VwcVideoPlayerElement, registerVideoPlayer, videoPlayerDefinition };