@vonage/vivid 4.14.2 → 4.14.4

package/styles/tokens/theme-dark.css

@@ -1,18 +1,18 @@
 /**
  * Do not edit directly
- * Generated on Tue, 28 Jan 2025 12:08:04 GMT
+ * Generated on Tue, 04 Feb 2025 16:43:13 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 28 Jan 2025 12:08:04 GMT
+ * Generated on Tue, 04 Feb 2025 16:43:13 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 28 Jan 2025 12:08:04 GMT
+ * Generated on Tue, 04 Feb 2025 16:43:13 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 28 Jan 2025 12:08:04 GMT
+ * Generated on Tue, 04 Feb 2025 16:43:13 GMT
  */
 @property --vvd-size-density {
   syntax: "<integer>";

package/styles/tokens/theme-light.css

@@ -1,18 +1,18 @@
 /**
  * Do not edit directly
- * Generated on Tue, 28 Jan 2025 12:08:04 GMT
+ * Generated on Tue, 04 Feb 2025 16:43:13 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 28 Jan 2025 12:08:04 GMT
+ * Generated on Tue, 04 Feb 2025 16:43:13 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 28 Jan 2025 12:08:04 GMT
+ * Generated on Tue, 04 Feb 2025 16:43:13 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 28 Jan 2025 12:08:04 GMT
+ * Generated on Tue, 04 Feb 2025 16:43:13 GMT
  */
 @property --vvd-size-density {
   syntax: "<integer>";

package/styles/tokens/vivid-2-compat.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 28 Jan 2025 12:08:04 GMT
+ * Generated on Tue, 04 Feb 2025 16:43:13 GMT
  */
 .vvd-root, ::part(vvd-root),
 .vvd-theme-alternate, ::part(vvd-theme-alternate) {

package/vivid.api.json

@@ -195,6 +195,73 @@
       "name": "",
       "preserveMemberOrder": false,
       "members": [
+        {
+          "kind": "TypeAlias",
+          "canonicalReference": "@vonage/vivid!AccordionExpandMode:type",
+          "docComment": "",
+          "excerptTokens": [
+            {
+              "kind": "Content",
+              "text": "export type AccordionExpandMode = "
+            },
+            {
+              "kind": "Content",
+              "text": "typeof "
+            },
+            {
+              "kind": "Reference",
+              "text": "AccordionExpandMode",
+              "canonicalReference": "@vonage/vivid!AccordionExpandMode:var"
+            },
+            {
+              "kind": "Content",
+              "text": "[keyof typeof "
+            },
+            {
+              "kind": "Reference",
+              "text": "AccordionExpandMode",
+              "canonicalReference": "@vonage/vivid!AccordionExpandMode:var"
+            },
+            {
+              "kind": "Content",
+              "text": "]"
+            },
+            {
+              "kind": "Content",
+              "text": ";"
+            }
+          ],
+          "fileUrlPath": "../../dist/libs/components/lib/accordion/definition.d.ts",
+          "releaseTag": "Public",
+          "name": "AccordionExpandMode",
+          "typeTokenRange": {
+            "startIndex": 1,
+            "endIndex": 6
+          }
+        },
+        {
+          "kind": "Variable",
+          "canonicalReference": "@vonage/vivid!AccordionExpandMode:var",
+          "docComment": "",
+          "excerptTokens": [
+            {
+              "kind": "Content",
+              "text": "AccordionExpandMode: "
+            },
+            {
+              "kind": "Content",
+              "text": "{\n    readonly single: \"single\";\n    readonly multi: \"multi\";\n}"
+            }
+          ],
+          "fileUrlPath": "../../dist/libs/components/lib/accordion/definition.d.ts",
+          "isReadonly": true,
+          "releaseTag": "Public",
+          "name": "AccordionExpandMode",
+          "variableTypeTokenRange": {
+            "startIndex": 1,
+            "endIndex": 2
+          }
+        },
         {
           "kind": "TypeAlias",
           "canonicalReference": "@vonage/vivid!ActionGroupAppearance:type",
@@ -3050,7 +3117,7 @@
               "text": ";"
             }
           ],
-          "fileUrlPath": "../../dist/libs/components/lib/menu-item/menu-item.d.ts",
+          "fileUrlPath": "../../dist/libs/components/lib/menu-item/menu-item-role.d.ts",
           "releaseTag": "Public",
           "name": "MenuItemRole",
           "typeTokenRange": {
@@ -3069,10 +3136,10 @@
             },
             {
               "kind": "Content",
-              "text": "{\n    readonly presentation: \"presentation\";\n    readonly menuitem: \"menuitem\";\n    readonly menuitemcheckbox: \"menuitemcheckbox\";\n    readonly menuitemradio: \"menuitemradio\";\n}"
+              "text": "{\n    readonly menuitem: \"menuitem\";\n    readonly menuitemcheckbox: \"menuitemcheckbox\";\n    readonly menuitemradio: \"menuitemradio\";\n    readonly presentation: \"presentation\";\n}"
             }
           ],
-          "fileUrlPath": "../../dist/libs/components/lib/menu-item/menu-item.d.ts",
+          "fileUrlPath": "../../dist/libs/components/lib/menu-item/menu-item-role.d.ts",
           "isReadonly": true,
           "releaseTag": "Public",
           "name": "MenuItemRole",

package/shared/apply-mixins2.cjs

@@ -1,25 +0,0 @@
-'use strict';
-
-const vividElement = require('./vivid-element.cjs');
-
-/**
- * Apply mixins to a constructor.
- * Sourced from {@link https://www.typescriptlang.org/docs/handbook/mixins.html | TypeScript Documentation }.
- * @public
- */
-function applyMixins(derivedCtor, ...baseCtors) {
-    const derivedAttributes = vividElement.AttributeConfiguration.locate(derivedCtor);
-    baseCtors.forEach(baseCtor => {
-        Object.getOwnPropertyNames(baseCtor.prototype).forEach(name => {
-            if (name !== "constructor") {
-                Object.defineProperty(derivedCtor.prototype, name, 
-                /* eslint-disable-next-line @typescript-eslint/no-non-null-assertion */
-                Object.getOwnPropertyDescriptor(baseCtor.prototype, name));
-            }
-        });
-        const baseAttributes = vividElement.AttributeConfiguration.locate(baseCtor);
-        baseAttributes.forEach(x => derivedAttributes.push(x));
-    });
-}
-
-exports.applyMixins = applyMixins;

package/shared/apply-mixins2.js

@@ -1,23 +0,0 @@
-import { A as AttributeConfiguration } from './vivid-element.js';
-
-/**
- * Apply mixins to a constructor.
- * Sourced from {@link https://www.typescriptlang.org/docs/handbook/mixins.html | TypeScript Documentation }.
- * @public
- */
-function applyMixins(derivedCtor, ...baseCtors) {
-    const derivedAttributes = AttributeConfiguration.locate(derivedCtor);
-    baseCtors.forEach(baseCtor => {
-        Object.getOwnPropertyNames(baseCtor.prototype).forEach(name => {
-            if (name !== "constructor") {
-                Object.defineProperty(derivedCtor.prototype, name, 
-                /* eslint-disable-next-line @typescript-eslint/no-non-null-assertion */
-                Object.getOwnPropertyDescriptor(baseCtor.prototype, name));
-            }
-        });
-        const baseAttributes = AttributeConfiguration.locate(baseCtor);
-        baseAttributes.forEach(x => derivedAttributes.push(x));
-    });
-}
-
-export { applyMixins as a };

package/shared/form-associated2.cjs

@@ -1,383 +0,0 @@
-'use strict';
-
-const vividElement = require('./vivid-element.cjs');
-const keyCodes = require('./key-codes2.cjs');
-
-const proxySlotName = "form-associated-proxy";
-const ElementInternalsKey = "ElementInternals";
-/**
- * @alpha
- */
-const supportsElementInternals = ElementInternalsKey in window &&
-    "setFormValue" in window[ElementInternalsKey].prototype;
-const InternalsMap = new WeakMap();
-/**
- * Base function for providing Custom Element Form Association.
- *
- * @alpha
- */
-function FormAssociated(BaseCtor) {
-    const C = class extends BaseCtor {
-        constructor(...args) {
-            super(...args);
-            /**
-             * Track whether the value has been changed from the initial value
-             */
-            this.dirtyValue = false;
-            /**
-             * Sets the element's disabled state. A disabled element will not be included during form submission.
-             *
-             * @remarks
-             * HTML Attribute: disabled
-             */
-            this.disabled = false;
-            /**
-             * These are events that are still fired by the proxy
-             * element based on user / programmatic interaction.
-             *
-             * The proxy implementation should be transparent to
-             * the app author, so block these events from emitting.
-             */
-            this.proxyEventsToBlock = ["change", "click"];
-            this.proxyInitialized = false;
-            this.required = false;
-            this.initialValue = this.initialValue || "";
-            if (!this.elementInternals) {
-                // When elementInternals is not supported, formResetCallback is
-                // bound to an event listener, so ensure the handler's `this`
-                // context is correct.
-                this.formResetCallback = this.formResetCallback.bind(this);
-            }
-        }
-        /**
-         * Must evaluate to true to enable elementInternals.
-         * Feature detects API support and resolve respectively
-         *
-         * @internal
-         */
-        static get formAssociated() {
-            return supportsElementInternals;
-        }
-        /**
-         * Returns the validity state of the element
-         *
-         * @alpha
-         */
-        get validity() {
-            return this.elementInternals
-                ? this.elementInternals.validity
-                : this.proxy.validity;
-        }
-        /**
-         * Retrieve a reference to the associated form.
-         * Returns null if not associated to any form.
-         *
-         * @alpha
-         */
-        get form() {
-            return this.elementInternals ? this.elementInternals.form : this.proxy.form;
-        }
-        /**
-         * Retrieve the localized validation message,
-         * or custom validation message if set.
-         *
-         * @alpha
-         */
-        get validationMessage() {
-            return this.elementInternals
-                ? this.elementInternals.validationMessage
-                : this.proxy.validationMessage;
-        }
-        /**
-         * Whether the element will be validated when the
-         * form is submitted
-         */
-        get willValidate() {
-            return this.elementInternals
-                ? this.elementInternals.willValidate
-                : this.proxy.willValidate;
-        }
-        /**
-         * A reference to all associated label elements
-         */
-        get labels() {
-            if (this.elementInternals) {
-                return Object.freeze(Array.from(this.elementInternals.labels));
-            }
-            else if (this.proxy instanceof HTMLElement &&
-                this.proxy.ownerDocument &&
-                this.id) {
-                // Labels associated by wrapping the element: <label><custom-element></custom-element></label>
-                const parentLabels = this.proxy.labels;
-                // Labels associated using the `for` attribute
-                const forLabels = Array.from(this.proxy.getRootNode().querySelectorAll(`[for='${this.id}']`));
-                const labels = parentLabels
-                    ? forLabels.concat(Array.from(parentLabels))
-                    : forLabels;
-                return Object.freeze(labels);
-            }
-            else {
-                return vividElement.emptyArray;
-            }
-        }
-        /**
-         * Invoked when the `value` property changes
-         * @param previous - the previous value
-         * @param next - the new value
-         *
-         * @remarks
-         * If elements extending `FormAssociated` implement a `valueChanged` method
-         * They must be sure to invoke `super.valueChanged(previous, next)` to ensure
-         * proper functioning of `FormAssociated`
-         */
-        valueChanged(previous, next) {
-            this.dirtyValue = true;
-            if (this.proxy instanceof HTMLElement) {
-                this.proxy.value = this.value;
-            }
-            this.currentValue = this.value;
-            this.setFormValue(this.value);
-            this.validate();
-        }
-        currentValueChanged() {
-            this.value = this.currentValue;
-        }
-        /**
-         * Invoked when the `initialValue` property changes
-         *
-         * @param previous - the previous value
-         * @param next - the new value
-         *
-         * @remarks
-         * If elements extending `FormAssociated` implement a `initialValueChanged` method
-         * They must be sure to invoke `super.initialValueChanged(previous, next)` to ensure
-         * proper functioning of `FormAssociated`
-         */
-        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;
-            }
-        }
-        /**
-         * Invoked when the `disabled` property changes
-         *
-         * @param previous - the previous value
-         * @param next - the new value
-         *
-         * @remarks
-         * If elements extending `FormAssociated` implement a `disabledChanged` method
-         * They must be sure to invoke `super.disabledChanged(previous, next)` to ensure
-         * proper functioning of `FormAssociated`
-         */
-        disabledChanged(previous, next) {
-            if (this.proxy instanceof HTMLElement) {
-                this.proxy.disabled = this.disabled;
-            }
-            vividElement.DOM.queueUpdate(() => this.classList.toggle("disabled", this.disabled));
-        }
-        /**
-         * Invoked when the `name` property changes
-         *
-         * @param previous - the previous value
-         * @param next - the new value
-         *
-         * @remarks
-         * If elements extending `FormAssociated` implement a `nameChanged` method
-         * They must be sure to invoke `super.nameChanged(previous, next)` to ensure
-         * proper functioning of `FormAssociated`
-         */
-        nameChanged(previous, next) {
-            if (this.proxy instanceof HTMLElement) {
-                this.proxy.name = this.name;
-            }
-        }
-        /**
-         * Invoked when the `required` property changes
-         *
-         * @param previous - the previous value
-         * @param next - the new value
-         *
-         * @remarks
-         * If elements extending `FormAssociated` implement a `requiredChanged` method
-         * They must be sure to invoke `super.requiredChanged(previous, next)` to ensure
-         * proper functioning of `FormAssociated`
-         */
-        requiredChanged(prev, next) {
-            if (this.proxy instanceof HTMLElement) {
-                this.proxy.required = this.required;
-            }
-            vividElement.DOM.queueUpdate(() => this.classList.toggle("required", this.required));
-            this.validate();
-        }
-        /**
-         * The element internals object. Will only exist
-         * in browsers supporting the attachInternals API
-         */
-        get elementInternals() {
-            if (!supportsElementInternals) {
-                return null;
-            }
-            let internals = InternalsMap.get(this);
-            if (!internals) {
-                internals = this.attachInternals();
-                InternalsMap.set(this, internals);
-            }
-            return internals;
-        }
-        /**
-         * @internal
-         */
-        connectedCallback() {
-            super.connectedCallback();
-            this.addEventListener("keypress", this._keypressHandler);
-            if (!this.value) {
-                this.value = this.initialValue;
-                this.dirtyValue = false;
-            }
-            if (!this.elementInternals) {
-                this.attachProxy();
-                if (this.form) {
-                    this.form.addEventListener("reset", this.formResetCallback);
-                }
-            }
-        }
-        /**
-         * @internal
-         */
-        disconnectedCallback() {
-            super.disconnectedCallback();
-            this.proxyEventsToBlock.forEach(name => this.proxy.removeEventListener(name, this.stopPropagation));
-            if (!this.elementInternals && this.form) {
-                this.form.removeEventListener("reset", this.formResetCallback);
-            }
-        }
-        /**
-         * Return the current validity of the element.
-         */
-        checkValidity() {
-            return this.elementInternals
-                ? this.elementInternals.checkValidity()
-                : this.proxy.checkValidity();
-        }
-        /**
-         * Return the current validity of the element.
-         * If false, fires an invalid event at the element.
-         */
-        reportValidity() {
-            return this.elementInternals
-                ? this.elementInternals.reportValidity()
-                : this.proxy.reportValidity();
-        }
-        /**
-         * Set the validity of the control. In cases when the elementInternals object is not
-         * available (and the proxy element is used to report validity), this function will
-         * do nothing unless a message is provided, at which point the setCustomValidity method
-         * of the proxy element will be invoked with the provided message.
-         * @param flags - Validity flags
-         * @param message - Optional message to supply
-         * @param anchor - Optional element used by UA to display an interactive validation UI
-         */
-        setValidity(flags, message, anchor) {
-            if (this.elementInternals) {
-                this.elementInternals.setValidity(flags, message, anchor);
-            }
-            else if (typeof message === "string") {
-                this.proxy.setCustomValidity(message);
-            }
-        }
-        /**
-         * Invoked when a connected component's form or fieldset has its disabled
-         * state changed.
-         * @param disabled - the disabled value of the form / fieldset
-         */
-        formDisabledCallback(disabled) {
-            this.disabled = disabled;
-        }
-        formResetCallback() {
-            this.value = this.initialValue;
-            this.dirtyValue = false;
-        }
-        /**
-         * Attach the proxy element to the DOM
-         */
-        attachProxy() {
-            var _a;
-            if (!this.proxyInitialized) {
-                this.proxyInitialized = true;
-                this.proxy.style.display = "none";
-                this.proxyEventsToBlock.forEach(name => this.proxy.addEventListener(name, this.stopPropagation));
-                // These are typically mapped to the proxy during
-                // property change callbacks, but during initialization
-                // on the initial call of the callback, the proxy is
-                // still undefined. We should find a better way to address this.
-                this.proxy.disabled = this.disabled;
-                this.proxy.required = this.required;
-                if (typeof this.name === "string") {
-                    this.proxy.name = this.name;
-                }
-                if (typeof this.value === "string") {
-                    this.proxy.value = this.value;
-                }
-                this.proxy.setAttribute("slot", proxySlotName);
-                this.proxySlot = document.createElement("slot");
-                this.proxySlot.setAttribute("name", proxySlotName);
-            }
-            (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.appendChild(this.proxySlot);
-            this.appendChild(this.proxy);
-        }
-        /**
-         * Detach the proxy element from the DOM
-         */
-        detachProxy() {
-            var _a;
-            this.removeChild(this.proxy);
-            (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.removeChild(this.proxySlot);
-        }
-        /** {@inheritDoc (FormAssociated:interface).validate} */
-        validate(anchor) {
-            if (this.proxy instanceof HTMLElement) {
-                this.setValidity(this.proxy.validity, this.proxy.validationMessage, anchor);
-            }
-        }
-        /**
-         * Associates the provided value (and optional state) with the parent form.
-         * @param value - The value to set
-         * @param state - The state object provided to during session restores and when autofilling.
-         */
-        setFormValue(value, state) {
-            if (this.elementInternals) {
-                this.elementInternals.setFormValue(value, state || value);
-            }
-        }
-        _keypressHandler(e) {
-            switch (e.key) {
-                case keyCodes.keyEnter:
-                    if (this.form instanceof HTMLFormElement) {
-                        // Implicit submission
-                        const defaultButton = this.form.querySelector("[type=submit]");
-                        defaultButton === null || defaultButton === void 0 ? void 0 : defaultButton.click();
-                    }
-                    break;
-            }
-        }
-        /**
-         * Used to stop propagation of proxy element events
-         * @param e - Event object
-         */
-        stopPropagation(e) {
-            e.stopPropagation();
-        }
-    };
-    vividElement.attr({ mode: "boolean" })(C.prototype, "disabled");
-    vividElement.attr({ mode: "fromView", attribute: "value" })(C.prototype, "initialValue");
-    vividElement.attr({ attribute: "current-value" })(C.prototype, "currentValue");
-    vividElement.attr(C.prototype, "name");
-    vividElement.attr({ mode: "boolean" })(C.prototype, "required");
-    vividElement.observable(C.prototype, "value");
-    return C;
-}
-
-exports.FormAssociated = FormAssociated;