@vonage/vivid 4.12.1 → 4.14.0

package/shared/listbox-option.cjs

@@ -1,204 +0,0 @@
-'use strict';
-
-const index = require('./index.cjs');
-const ariaGlobal = require('./aria-global.cjs');
-const startEnd = require('./start-end.cjs');
-const applyMixins = require('./apply-mixins.cjs');
-const dom = require('./dom.cjs');
-
-/**
- * Determines if the element is a {@link (ListboxOption:class)}
- *
- * @param element - the element to test.
- * @public
- */
-function isListboxOption(el) {
-    return (dom.isHTMLElement(el) &&
-        (el.getAttribute("role") === "option" ||
-            el instanceof HTMLOptionElement));
-}
-/**
- * An Option Custom HTML Element.
- * Implements {@link https://www.w3.org/TR/wai-aria-1.1/#option | ARIA option }.
- *
- * @slot start - Content which can be provided before the listbox option content
- * @slot end - Content which can be provided after the listbox option content
- * @slot - The default slot for listbox option content
- * @csspart content - Wraps the listbox option content
- *
- * @public
- */
-let ListboxOption$1 = class ListboxOption extends index.FoundationElement {
-    constructor(text, value, defaultSelected, selected) {
-        super();
-        /**
-         * The defaultSelected state of the option.
-         * @public
-         */
-        this.defaultSelected = false;
-        /**
-         * Tracks whether the "selected" property has been changed.
-         * @internal
-         */
-        this.dirtySelected = false;
-        /**
-         * The checked state of the control.
-         *
-         * @public
-         */
-        this.selected = this.defaultSelected;
-        /**
-         * Track whether the value has been changed from the initial value
-         */
-        this.dirtyValue = false;
-        if (text) {
-            this.textContent = text;
-        }
-        if (value) {
-            this.initialValue = value;
-        }
-        if (defaultSelected) {
-            this.defaultSelected = defaultSelected;
-        }
-        if (selected) {
-            this.selected = selected;
-        }
-        this.proxy = new Option(`${this.textContent}`, this.initialValue, this.defaultSelected, this.selected);
-        this.proxy.disabled = this.disabled;
-    }
-    /**
-     * Updates the ariaChecked property when the checked property changes.
-     *
-     * @param prev - the previous checked value
-     * @param next - the current checked value
-     *
-     * @public
-     */
-    checkedChanged(prev, next) {
-        if (typeof next === "boolean") {
-            this.ariaChecked = next ? "true" : "false";
-            return;
-        }
-        this.ariaChecked = null;
-    }
-    /**
-     * Updates the proxy's text content when the default slot changes.
-     * @param prev - the previous content value
-     * @param next - the current content value
-     *
-     * @internal
-     */
-    contentChanged(prev, next) {
-        if (this.proxy instanceof HTMLOptionElement) {
-            this.proxy.textContent = this.textContent;
-        }
-        this.$emit("contentchange", null, { bubbles: true });
-    }
-    defaultSelectedChanged() {
-        if (!this.dirtySelected) {
-            this.selected = this.defaultSelected;
-            if (this.proxy instanceof HTMLOptionElement) {
-                this.proxy.selected = this.defaultSelected;
-            }
-        }
-    }
-    disabledChanged(prev, next) {
-        this.ariaDisabled = this.disabled ? "true" : "false";
-        if (this.proxy instanceof HTMLOptionElement) {
-            this.proxy.disabled = this.disabled;
-        }
-    }
-    selectedAttributeChanged() {
-        this.defaultSelected = this.selectedAttribute;
-        if (this.proxy instanceof HTMLOptionElement) {
-            this.proxy.defaultSelected = this.defaultSelected;
-        }
-    }
-    selectedChanged() {
-        this.ariaSelected = this.selected ? "true" : "false";
-        if (!this.dirtySelected) {
-            this.dirtySelected = true;
-        }
-        if (this.proxy instanceof HTMLOptionElement) {
-            this.proxy.selected = this.selected;
-        }
-    }
-    initialValueChanged(previous, next) {
-        // If the value is clean and the component is connected to the DOM
-        // then set value equal to the attribute value.
-        if (!this.dirtyValue) {
-            this.value = this.initialValue;
-            this.dirtyValue = false;
-        }
-    }
-    get label() {
-        var _a;
-        return (_a = this.value) !== null && _a !== void 0 ? _a : this.text;
-    }
-    get text() {
-        var _a, _b;
-        return (_b = (_a = this.textContent) === null || _a === void 0 ? void 0 : _a.replace(/\s+/g, " ").trim()) !== null && _b !== void 0 ? _b : "";
-    }
-    set value(next) {
-        const newValue = `${next !== null && next !== void 0 ? next : ""}`;
-        this._value = newValue;
-        this.dirtyValue = true;
-        if (this.proxy instanceof HTMLOptionElement) {
-            this.proxy.value = newValue;
-        }
-        index.Observable.notify(this, "value");
-    }
-    get value() {
-        var _a;
-        index.Observable.track(this, "value");
-        return (_a = this._value) !== null && _a !== void 0 ? _a : this.text;
-    }
-    get form() {
-        return this.proxy ? this.proxy.form : null;
-    }
-};
-index.__decorate([
-    index.observable
-], ListboxOption$1.prototype, "checked", void 0);
-index.__decorate([
-    index.observable
-], ListboxOption$1.prototype, "content", void 0);
-index.__decorate([
-    index.observable
-], ListboxOption$1.prototype, "defaultSelected", void 0);
-index.__decorate([
-    index.attr({ mode: "boolean" })
-], ListboxOption$1.prototype, "disabled", void 0);
-index.__decorate([
-    index.attr({ attribute: "selected", mode: "boolean" })
-], ListboxOption$1.prototype, "selectedAttribute", void 0);
-index.__decorate([
-    index.observable
-], ListboxOption$1.prototype, "selected", void 0);
-index.__decorate([
-    index.attr({ attribute: "value", mode: "fromView" })
-], ListboxOption$1.prototype, "initialValue", void 0);
-/**
- * States and properties relating to the ARIA `option` role.
- *
- * @public
- */
-class DelegatesARIAListboxOption {
-}
-index.__decorate([
-    index.observable
-], DelegatesARIAListboxOption.prototype, "ariaChecked", void 0);
-index.__decorate([
-    index.observable
-], DelegatesARIAListboxOption.prototype, "ariaPosInSet", void 0);
-index.__decorate([
-    index.observable
-], DelegatesARIAListboxOption.prototype, "ariaSelected", void 0);
-index.__decorate([
-    index.observable
-], DelegatesARIAListboxOption.prototype, "ariaSetSize", void 0);
-applyMixins.applyMixins(DelegatesARIAListboxOption, ariaGlobal.ARIAGlobalStatesAndProperties);
-applyMixins.applyMixins(ListboxOption$1, startEnd.StartEnd, DelegatesARIAListboxOption);
-
-exports.ListboxOption = ListboxOption$1;
-exports.isListboxOption = isListboxOption;

package/shared/listbox-option.js

@@ -1,201 +0,0 @@
-import { F as FoundationElement, O as Observable, _ as __decorate, o as observable, a as attr } from './index.js';
-import { A as ARIAGlobalStatesAndProperties } from './aria-global.js';
-import { S as StartEnd } from './start-end.js';
-import { a as applyMixins } from './apply-mixins.js';
-import { i as isHTMLElement } from './dom.js';
-
-/**
- * Determines if the element is a {@link (ListboxOption:class)}
- *
- * @param element - the element to test.
- * @public
- */
-function isListboxOption(el) {
-    return (isHTMLElement(el) &&
-        (el.getAttribute("role") === "option" ||
-            el instanceof HTMLOptionElement));
-}
-/**
- * An Option Custom HTML Element.
- * Implements {@link https://www.w3.org/TR/wai-aria-1.1/#option | ARIA option }.
- *
- * @slot start - Content which can be provided before the listbox option content
- * @slot end - Content which can be provided after the listbox option content
- * @slot - The default slot for listbox option content
- * @csspart content - Wraps the listbox option content
- *
- * @public
- */
-let ListboxOption$1 = class ListboxOption extends FoundationElement {
-    constructor(text, value, defaultSelected, selected) {
-        super();
-        /**
-         * The defaultSelected state of the option.
-         * @public
-         */
-        this.defaultSelected = false;
-        /**
-         * Tracks whether the "selected" property has been changed.
-         * @internal
-         */
-        this.dirtySelected = false;
-        /**
-         * The checked state of the control.
-         *
-         * @public
-         */
-        this.selected = this.defaultSelected;
-        /**
-         * Track whether the value has been changed from the initial value
-         */
-        this.dirtyValue = false;
-        if (text) {
-            this.textContent = text;
-        }
-        if (value) {
-            this.initialValue = value;
-        }
-        if (defaultSelected) {
-            this.defaultSelected = defaultSelected;
-        }
-        if (selected) {
-            this.selected = selected;
-        }
-        this.proxy = new Option(`${this.textContent}`, this.initialValue, this.defaultSelected, this.selected);
-        this.proxy.disabled = this.disabled;
-    }
-    /**
-     * Updates the ariaChecked property when the checked property changes.
-     *
-     * @param prev - the previous checked value
-     * @param next - the current checked value
-     *
-     * @public
-     */
-    checkedChanged(prev, next) {
-        if (typeof next === "boolean") {
-            this.ariaChecked = next ? "true" : "false";
-            return;
-        }
-        this.ariaChecked = null;
-    }
-    /**
-     * Updates the proxy's text content when the default slot changes.
-     * @param prev - the previous content value
-     * @param next - the current content value
-     *
-     * @internal
-     */
-    contentChanged(prev, next) {
-        if (this.proxy instanceof HTMLOptionElement) {
-            this.proxy.textContent = this.textContent;
-        }
-        this.$emit("contentchange", null, { bubbles: true });
-    }
-    defaultSelectedChanged() {
-        if (!this.dirtySelected) {
-            this.selected = this.defaultSelected;
-            if (this.proxy instanceof HTMLOptionElement) {
-                this.proxy.selected = this.defaultSelected;
-            }
-        }
-    }
-    disabledChanged(prev, next) {
-        this.ariaDisabled = this.disabled ? "true" : "false";
-        if (this.proxy instanceof HTMLOptionElement) {
-            this.proxy.disabled = this.disabled;
-        }
-    }
-    selectedAttributeChanged() {
-        this.defaultSelected = this.selectedAttribute;
-        if (this.proxy instanceof HTMLOptionElement) {
-            this.proxy.defaultSelected = this.defaultSelected;
-        }
-    }
-    selectedChanged() {
-        this.ariaSelected = this.selected ? "true" : "false";
-        if (!this.dirtySelected) {
-            this.dirtySelected = true;
-        }
-        if (this.proxy instanceof HTMLOptionElement) {
-            this.proxy.selected = this.selected;
-        }
-    }
-    initialValueChanged(previous, next) {
-        // If the value is clean and the component is connected to the DOM
-        // then set value equal to the attribute value.
-        if (!this.dirtyValue) {
-            this.value = this.initialValue;
-            this.dirtyValue = false;
-        }
-    }
-    get label() {
-        var _a;
-        return (_a = this.value) !== null && _a !== void 0 ? _a : this.text;
-    }
-    get text() {
-        var _a, _b;
-        return (_b = (_a = this.textContent) === null || _a === void 0 ? void 0 : _a.replace(/\s+/g, " ").trim()) !== null && _b !== void 0 ? _b : "";
-    }
-    set value(next) {
-        const newValue = `${next !== null && next !== void 0 ? next : ""}`;
-        this._value = newValue;
-        this.dirtyValue = true;
-        if (this.proxy instanceof HTMLOptionElement) {
-            this.proxy.value = newValue;
-        }
-        Observable.notify(this, "value");
-    }
-    get value() {
-        var _a;
-        Observable.track(this, "value");
-        return (_a = this._value) !== null && _a !== void 0 ? _a : this.text;
-    }
-    get form() {
-        return this.proxy ? this.proxy.form : null;
-    }
-};
-__decorate([
-    observable
-], ListboxOption$1.prototype, "checked", void 0);
-__decorate([
-    observable
-], ListboxOption$1.prototype, "content", void 0);
-__decorate([
-    observable
-], ListboxOption$1.prototype, "defaultSelected", void 0);
-__decorate([
-    attr({ mode: "boolean" })
-], ListboxOption$1.prototype, "disabled", void 0);
-__decorate([
-    attr({ attribute: "selected", mode: "boolean" })
-], ListboxOption$1.prototype, "selectedAttribute", void 0);
-__decorate([
-    observable
-], ListboxOption$1.prototype, "selected", void 0);
-__decorate([
-    attr({ attribute: "value", mode: "fromView" })
-], ListboxOption$1.prototype, "initialValue", void 0);
-/**
- * States and properties relating to the ARIA `option` role.
- *
- * @public
- */
-class DelegatesARIAListboxOption {
-}
-__decorate([
-    observable
-], DelegatesARIAListboxOption.prototype, "ariaChecked", void 0);
-__decorate([
-    observable
-], DelegatesARIAListboxOption.prototype, "ariaPosInSet", void 0);
-__decorate([
-    observable
-], DelegatesARIAListboxOption.prototype, "ariaSelected", void 0);
-__decorate([
-    observable
-], DelegatesARIAListboxOption.prototype, "ariaSetSize", void 0);
-applyMixins(DelegatesARIAListboxOption, ARIAGlobalStatesAndProperties);
-applyMixins(ListboxOption$1, StartEnd, DelegatesARIAListboxOption);
-
-export { ListboxOption$1 as L, isListboxOption as i };

package/shared/radio.cjs

@@ -1,126 +0,0 @@
-'use strict';
-
-const formAssociated = require('./form-associated.cjs');
-const index = require('./index.cjs');
-const keyCodes = require('./key-codes.cjs');
-
-class _Radio extends index.FoundationElement {
-}
-class FormAssociatedRadio extends formAssociated.CheckableFormAssociated(_Radio) {
-  constructor() {
-    super(...arguments);
-    this.proxy = document.createElement("input");
-  }
-}
-
-var __defProp = Object.defineProperty;
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = void 0 ;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (decorator(target, key, result) ) || result;
-  if (result) __defProp(target, key, result);
-  return result;
-};
-class Radio extends FormAssociatedRadio {
-  constructor() {
-    super();
-    this.ariaLabel = null;
-    /**
-     * The element's value to be included in form submission when checked.
-     * Default to "on" to reach parity with input[type="radio"]
-     *
-     * @internal
-     */
-    this.initialValue = "on";
-    this.defaultSlottedNodes = [];
-    /**
-     * @internal
-     */
-    this.keypressHandler = (e) => {
-      switch (e.key) {
-        case keyCodes.keySpace:
-          if (!this.checked && !this.readOnly) {
-            this.checked = true;
-          }
-          return;
-      }
-      return true;
-    };
-    this.proxy.setAttribute("type", "radio");
-  }
-  // Map to proxy element
-  /**
-   * @internal
-   */
-  readOnlyChanged() {
-    if (this.proxy instanceof HTMLInputElement) {
-      this.proxy.readOnly = this.readOnly;
-    }
-  }
-  /**
-   * @internal
-   */
-  defaultCheckedChanged() {
-    if (this.$fastController.isConnected && !this.dirtyChecked) {
-      if (!this.isInsideRadioGroup()) {
-        this.checked = this.defaultChecked;
-        this.dirtyChecked = false;
-      }
-    }
-  }
-  /**
-   * @internal
-   */
-  connectedCallback() {
-    super.connectedCallback();
-    this.validate();
-    if (this.parentElement.getAttribute("role") !== "radiogroup" && this.getAttribute("tabindex") === null) {
-      if (!this.disabled) {
-        this.setAttribute("tabindex", "0");
-      }
-    }
-    if (this.checkedAttribute) {
-      if (!this.dirtyChecked) {
-        if (!this.isInsideRadioGroup()) {
-          this.checked = this.defaultChecked;
-          this.dirtyChecked = false;
-        }
-      }
-    }
-  }
-  isInsideRadioGroup() {
-    const parent = this.closest(
-      "[role=radiogroup]"
-    );
-    return parent !== null;
-  }
-  /**
-   * @internal
-   */
-  clickHandler(_) {
-    if (!this.disabled && !this.readOnly && !this.checked) {
-      this.checked = true;
-    }
-  }
-}
-__decorateClass([
-  index.attr({ attribute: "aria-label" })
-], Radio.prototype, "ariaLabel");
-__decorateClass([
-  index.attr
-], Radio.prototype, "label");
-__decorateClass([
-  index.attr
-], Radio.prototype, "connotation");
-__decorateClass([
-  index.attr({ attribute: "readonly", mode: "boolean" })
-], Radio.prototype, "readOnly");
-__decorateClass([
-  index.observable
-], Radio.prototype, "name");
-__decorateClass([
-  index.observable
-], Radio.prototype, "defaultSlottedNodes");
-
-exports.Radio = Radio;

package/shared/radio.js

@@ -1,124 +0,0 @@
-import { C as CheckableFormAssociated } from './form-associated.js';
-import { F as FoundationElement, a as attr, o as observable } from './index.js';
-import { k as keySpace } from './key-codes.js';
-
-class _Radio extends FoundationElement {
-}
-class FormAssociatedRadio extends CheckableFormAssociated(_Radio) {
-  constructor() {
-    super(...arguments);
-    this.proxy = document.createElement("input");
-  }
-}
-
-var __defProp = Object.defineProperty;
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = void 0 ;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (decorator(target, key, result) ) || result;
-  if (result) __defProp(target, key, result);
-  return result;
-};
-class Radio extends FormAssociatedRadio {
-  constructor() {
-    super();
-    this.ariaLabel = null;
-    /**
-     * The element's value to be included in form submission when checked.
-     * Default to "on" to reach parity with input[type="radio"]
-     *
-     * @internal
-     */
-    this.initialValue = "on";
-    this.defaultSlottedNodes = [];
-    /**
-     * @internal
-     */
-    this.keypressHandler = (e) => {
-      switch (e.key) {
-        case keySpace:
-          if (!this.checked && !this.readOnly) {
-            this.checked = true;
-          }
-          return;
-      }
-      return true;
-    };
-    this.proxy.setAttribute("type", "radio");
-  }
-  // Map to proxy element
-  /**
-   * @internal
-   */
-  readOnlyChanged() {
-    if (this.proxy instanceof HTMLInputElement) {
-      this.proxy.readOnly = this.readOnly;
-    }
-  }
-  /**
-   * @internal
-   */
-  defaultCheckedChanged() {
-    if (this.$fastController.isConnected && !this.dirtyChecked) {
-      if (!this.isInsideRadioGroup()) {
-        this.checked = this.defaultChecked;
-        this.dirtyChecked = false;
-      }
-    }
-  }
-  /**
-   * @internal
-   */
-  connectedCallback() {
-    super.connectedCallback();
-    this.validate();
-    if (this.parentElement.getAttribute("role") !== "radiogroup" && this.getAttribute("tabindex") === null) {
-      if (!this.disabled) {
-        this.setAttribute("tabindex", "0");
-      }
-    }
-    if (this.checkedAttribute) {
-      if (!this.dirtyChecked) {
-        if (!this.isInsideRadioGroup()) {
-          this.checked = this.defaultChecked;
-          this.dirtyChecked = false;
-        }
-      }
-    }
-  }
-  isInsideRadioGroup() {
-    const parent = this.closest(
-      "[role=radiogroup]"
-    );
-    return parent !== null;
-  }
-  /**
-   * @internal
-   */
-  clickHandler(_) {
-    if (!this.disabled && !this.readOnly && !this.checked) {
-      this.checked = true;
-    }
-  }
-}
-__decorateClass([
-  attr({ attribute: "aria-label" })
-], Radio.prototype, "ariaLabel");
-__decorateClass([
-  attr
-], Radio.prototype, "label");
-__decorateClass([
-  attr
-], Radio.prototype, "connotation");
-__decorateClass([
-  attr({ attribute: "readonly", mode: "boolean" })
-], Radio.prototype, "readOnly");
-__decorateClass([
-  observable
-], Radio.prototype, "name");
-__decorateClass([
-  observable
-], Radio.prototype, "defaultSlottedNodes");
-
-export { Radio as R };

package/shared/select.options.cjs

@@ -1,12 +0,0 @@
-'use strict';
-
-/**
- * Positioning directions for the listbox when a select is open.
- * @public
- */
-const SelectPosition = {
-    above: "above",
-    below: "below",
-};
-
-exports.SelectPosition = SelectPosition;

package/shared/select.options.js

@@ -1,10 +0,0 @@
-/**
- * Positioning directions for the listbox when a select is open.
- * @public
- */
-const SelectPosition = {
-    above: "above",
-    below: "below",
-};
-
-export { SelectPosition as S };