@vonage/vivid-react 4.0.0 → 5.20.0

package/v3/VwcAudioPlayer/index.js

@@ -54,7 +54,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "AudioPlayerConnotation | undefined"
    },
-   "description": "The connotation the audio-player should have.",
+   "description": "Sets the color of the audio player",
    "privacy": "public"
   },
   {
@@ -63,13 +63,9 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string | undefined"
    },
-   "description": "Indicates the audio-player's src.",
+   "description": "Sets the audio source URL",
    "privacy": "public"
   },
-  {
-   "kind": "method",
-   "name": "srcChanged"
-  },
   {
    "kind": "method",
    "name": "revokeSrc",
@@ -134,7 +130,7 @@ Code in this file were generated using following JSON:
     "text": "boolean"
    },
    "default": "false",
-   "description": "Indicates whether audio player is disabled.",
+   "description": "Sets the disabled state of the audio player",
    "privacy": "public"
   },
   {
@@ -144,8 +140,8 @@ Code in this file were generated using following JSON:
     "text": "boolean"
    },
    "default": "false",
-   "privacy": "public",
-   "description": ""
+   "description": "Hides the time stamp",
+   "privacy": "public"
   },
   {
    "kind": "field",
@@ -163,7 +159,7 @@ Code in this file were generated using following JSON:
     "text": "string | null"
    },
    "default": "null",
-   "description": "Sets the available playback rates. When an empty string, no choices will be available",
+   "description": "Comma-separated string of numbers to define playback speeds",
    "privacy": "public"
   },
   {
@@ -244,6 +240,16 @@ Code in this file were generated using following JSON:
    "kind": "method",
    "name": "pause"
   },
+  {
+   "kind": "field",
+   "name": "#onPlay",
+   "privacy": "private"
+  },
+  {
+   "kind": "field",
+   "name": "#onPause",
+   "privacy": "private"
+  },
   {
    "kind": "method",
    "name": "#setSliderInteractionListeners",
@@ -315,6 +321,22 @@ Code in this file were generated using following JSON:
    }
   }
  ],
+ "events": [
+  {
+   "type": {
+    "text": "CustomEvent<undefined>"
+   },
+   "description": "Fires when the audio playback is started.",
+   "name": "play"
+  },
+  {
+   "type": {
+    "text": "CustomEvent<undefined>"
+   },
+   "description": "Fires when the audio playback is paused.",
+   "name": "pause"
+  }
+ ],
  "attributes": [
   {
    "name": "play-button-aria-label",
@@ -361,7 +383,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "AudioPlayerConnotation | undefined"
    },
-   "description": "The connotation the audio-player should have.",
+   "description": "Sets the color of the audio player",
    "fieldName": "connotation"
   },
   {
@@ -369,7 +391,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string | undefined"
    },
-   "description": "Indicates the audio-player's src.",
+   "description": "Sets the audio source URL",
    "fieldName": "src"
   },
   {
@@ -378,7 +400,7 @@ Code in this file were generated using following JSON:
     "text": "boolean"
    },
    "default": "false",
-   "description": "Indicates whether audio player is disabled.",
+   "description": "Sets the disabled state of the audio player",
    "fieldName": "disabled"
   },
   {
@@ -387,6 +409,7 @@ Code in this file were generated using following JSON:
     "text": "boolean"
    },
    "default": "false",
+   "description": "Hides the time stamp",
    "fieldName": "notime"
   },
   {
@@ -403,7 +426,7 @@ Code in this file were generated using following JSON:
     "text": "string | null"
    },
    "default": "null",
-   "description": "Sets the available playback rates. When an empty string, no choices will be available",
+   "description": "Comma-separated string of numbers to define playback speeds",
    "fieldName": "playbackRates"
   },
   {
@@ -432,13 +455,13 @@ Code in this file were generated using following JSON:
  }
 }
 */
-import wrapper from '@vonage/vivid-react-wrapper'
+import wrapper from '@repo/react-component-wrapper'
 import { registerAudioPlayer } from '@vonage/vivid'
 
 registerAudioPlayer('vvd3')
 
 const VwcAudioPlayer = wrapper(`vvd3-audio-player`,  {
-    events: [],
+    events: [{"name":"pause","propName":"onPause"},{"name":"play","propName":"onPlay"}],
     attributes: [],
     properties: ['playButtonAriaLabel', 'pauseButtonAriaLabel', 'sliderAriaLabel', 'skipForwardButtonAriaLabel', 'skipBackwardButtonAriaLabel', 'connotation', 'src', 'playbackRate', 'disabled', 'notime', 'skipBy', 'playbackRates', 'paused', 'duration', 'currentTime', 'durationFallback', 'VIVID_VERSION', 'componentName']
 })

package/v3/VwcAudioPlayer/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@vonage/vivid-react-vvd3-audio-player",
-  "version": "5.5.0",
+  "version": "5.20.0",
   "main": "index.js",
   "types": "index.d.ts",
   "private": true,
   "license": "MIT",
   "dependencies": {
-    "@vonage/vivid": "5.5.0"
+    "@vonage/vivid": "5.20.0"
   }
 }

package/v3/VwcAvatar/index.d.ts

@@ -1,12 +1,12 @@
 import React, { ReactNode } from 'react';
 /** VwcAvatar
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/avatar
-* @param {AvatarConnotation | undefined} connotation - The connotation the avatar should have. **attribute** `connotation`
-* @param {AvatarShape | undefined} shape - The shape the avatar should have. **attribute** `shape`
-* @param {AvatarAppearance | undefined} appearance - The appearance the avatar should have. **attribute** `appearance`
-* @param {AvatarSize | undefined} size - The size the avatar should have. **attribute** `size`
-* @param {string | undefined} icon  **attribute** `icon`
-* @param {string | undefined} initials - avatar name **attribute** `initials`
+* @param {AvatarConnotation | undefined} connotation - Sets the element's connotation **attribute** `connotation`
+* @param {AvatarShape | undefined} shape - Sets the element's shape **attribute** `shape`
+* @param {AvatarAppearance | undefined} appearance - Sets the element's appearance **attribute** `appearance`
+* @param {AvatarSize | undefined} size - Sets the element's size **attribute** `size`
+* @param {string | undefined} icon - Sets the element's icon **attribute** `icon`
+* @param {string | undefined} initials - Sets the initials on the Avatar **attribute** `initials`
 * @param {boolean} clickable - Indicates whether avatar should be a clickable <button> element. **attribute** `clickable`
 * @param {string | undefined} download - Prompts the user to save the linked URL. See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a | <a> element  for more information. **attribute** `download`
 * @param {string | undefined} href - The URL the hyperlink references. See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a | <a> element  for more information. **attribute** `href`
@@ -17,7 +17,6 @@ import React, { ReactNode } from 'react';
 * @param {'_self' | '_blank' | '_parent' | '_top' | undefined} target - See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a | <a> element  for more information. **attribute** `target`
 * @param {string | undefined} type - See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a | <a> element  for more information. **attribute** `type`
 * @param {HTMLAnchorElement} control - References the root element
-* @param {'delegate'} _vividAriaBehaviour
 * @param {string} VIVID_VERSION - The current version of the Vivid library, which is useful for debugging.
 It can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.
 * @param {string} componentName - Core component name, without prefix
@@ -25,29 +24,28 @@ It can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.
 declare const VwcAvatar: {
     (props: {
         children?: ReactNode;
-        slot?: string | undefined;
-        id?: string | undefined;
-        style?: React.CSSProperties | undefined;
-        ref?: React.RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-        connotation?: any;
-        shape?: any;
-        appearance?: any;
-        size?: any;
-        icon?: string | undefined;
-        initials?: string | undefined;
-        clickable?: boolean | undefined;
-        download?: string | undefined;
-        href?: string | undefined;
-        hreflang?: string | undefined;
-        ping?: string | undefined;
-        referrerpolicy?: string | undefined;
-        rel?: string | undefined;
-        target?: any;
-        type?: string | undefined;
-        control?: any;
-        _vividAriaBehaviour?: any;
-        VIVID_VERSION?: string | undefined;
-        componentName?: string | undefined;
+        slot?: string;
+        id?: string;
+        style?: React.CSSProperties;
+        ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+        "connotation"?: any;
+        "shape"?: any;
+        "appearance"?: any;
+        "size"?: any;
+        "icon"?: string | undefined;
+        "initials"?: string | undefined;
+        "clickable"?: boolean;
+        "download"?: string | undefined;
+        "href"?: string | undefined;
+        "hreflang"?: string | undefined;
+        "ping"?: string | undefined;
+        "referrerpolicy"?: string | undefined;
+        "rel"?: string | undefined;
+        "target"?: "_self" | "_blank" | "_parent" | "_top" | undefined;
+        "type"?: string | undefined;
+        "control"?: any;
+        "VIVID_VERSION"?: string;
+        "componentName"?: string;
     }): JSX.Element;
     displayName: string;
 };

package/v3/VwcAvatar/index.js

@@ -90,7 +90,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "AvatarConnotation | undefined"
    },
-   "description": "The connotation the avatar should have.",
+   "description": "Sets the element's connotation",
    "privacy": "public"
   },
   {
@@ -99,7 +99,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "AvatarShape | undefined"
    },
-   "description": "The shape the avatar should have.",
+   "description": "Sets the element's shape",
    "privacy": "public"
   },
   {
@@ -108,7 +108,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "AvatarAppearance | undefined"
    },
-   "description": "The appearance the avatar should have.",
+   "description": "Sets the element's appearance",
    "privacy": "public"
   },
   {
@@ -117,7 +117,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "AvatarSize | undefined"
    },
-   "description": "The size the avatar should have.",
+   "description": "Sets the element's size",
    "privacy": "public"
   },
   {
@@ -126,8 +126,8 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string | undefined"
    },
-   "privacy": "public",
-   "description": ""
+   "description": "Sets the element's icon",
+   "privacy": "public"
   },
   {
    "kind": "field",
@@ -135,7 +135,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string | undefined"
    },
-   "description": "avatar name",
+   "description": "Sets the initials on the Avatar",
    "privacy": "public"
   },
   {
@@ -264,18 +264,6 @@ Code in this file were generated using following JSON:
     "module": "src/shared/patterns/linkable.ts"
    }
   },
-  {
-   "kind": "field",
-   "name": "_vividAriaBehaviour",
-   "default": "'delegate'",
-   "type": {
-    "text": "'delegate'"
-   },
-   "inheritedFrom": {
-    "name": "DelegatesAria",
-    "module": "src/shared/aria/delegates-aria.ts"
-   }
-  },
   {
    "kind": "field",
    "name": "VIVID_VERSION",
@@ -310,7 +298,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "AvatarConnotation | undefined"
    },
-   "description": "The connotation the avatar should have.",
+   "description": "Sets the element's connotation",
    "fieldName": "connotation"
   },
   {
@@ -318,7 +306,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "AvatarShape | undefined"
    },
-   "description": "The shape the avatar should have.",
+   "description": "Sets the element's shape",
    "fieldName": "shape"
   },
   {
@@ -326,7 +314,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "AvatarAppearance | undefined"
    },
-   "description": "The appearance the avatar should have.",
+   "description": "Sets the element's appearance",
    "fieldName": "appearance"
   },
   {
@@ -334,7 +322,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "AvatarSize | undefined"
    },
-   "description": "The size the avatar should have.",
+   "description": "Sets the element's size",
    "fieldName": "size"
   },
   {
@@ -342,6 +330,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string | undefined"
    },
+   "description": "Sets the element's icon",
    "fieldName": "icon"
   },
   {
@@ -349,7 +338,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string | undefined"
    },
-   "description": "avatar name",
+   "description": "Sets the initials on the Avatar",
    "fieldName": "initials"
   },
   {
@@ -474,7 +463,7 @@ Code in this file were generated using following JSON:
  }
 }
 */
-import wrapper from '@vonage/vivid-react-wrapper'
+import wrapper from '@repo/react-component-wrapper'
 import { registerAvatar } from '@vonage/vivid'
 
 registerAvatar('vvd3')
@@ -482,7 +471,7 @@ registerAvatar('vvd3')
 const VwcAvatar = wrapper(`vvd3-avatar`,  {
     events: [],
     attributes: [],
-    properties: ['connotation', 'shape', 'appearance', 'size', 'icon', 'initials', 'clickable', 'download', 'href', 'hreflang', 'ping', 'referrerpolicy', 'rel', 'target', 'type', 'control', '_vividAriaBehaviour', 'VIVID_VERSION', 'componentName']
+    properties: ['connotation', 'shape', 'appearance', 'size', 'icon', 'initials', 'clickable', 'download', 'href', 'hreflang', 'ping', 'referrerpolicy', 'rel', 'target', 'type', 'control', 'VIVID_VERSION', 'componentName']
 })
 
 VwcAvatar.displayName = 'VwcAvatar'

package/v3/VwcAvatar/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@vonage/vivid-react-vvd3-avatar",
-  "version": "5.5.0",
+  "version": "5.20.0",
   "main": "index.js",
   "types": "index.d.ts",
   "private": true,
   "license": "MIT",
   "dependencies": {
-    "@vonage/vivid": "5.5.0"
+    "@vonage/vivid": "5.20.0"
   }
 }

package/v3/VwcBadge/index.d.ts

@@ -1,13 +1,14 @@
 import React, { ReactNode } from 'react';
 /** VwcBadge
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/badge
-* @param {BadgeConnotation | undefined} connotation - The connotation the badge should have. **attribute** `connotation`
-* @param {BadgeShape | undefined} shape - The shape the badge should have. **attribute** `shape`
-* @param {BadgeSize | undefined} size - The size the badge should have. **attribute** `size`
-* @param {BadgeAppearance | undefined} appearance - The appearance the badge should have. **attribute** `appearance`
-* @param {string | undefined} text - Indicates the badge's text. **attribute** `text`
+* @param {BadgeConnotation | undefined} connotation - Sets the badge connotation **attribute** `connotation`
+* @param {BadgeShape | undefined} shape - Sets the badge border-radius **attribute** `shape`
+* @param {BadgeSize | undefined} size - Sets the badge size **attribute** `size`
+* @param {BadgeAppearance | undefined} appearance - Sets the badge appearance **attribute** `appearance`
+* @param {string | undefined} text - Sets a text on the badge **attribute** `text`
 * @param {boolean} iconTrailing - Indicates the icon affix alignment. **attribute** `icon-trailing`
-* @param {string | undefined} icon - A decorative icon the custom element should have. **attribute** `icon`
+* @param {string | undefined} icon - A decorative icon the custom element should have. See the [Vivid Icon
+Gallery](/icons/icons-gallery/) for available icons and `icon-name`s **attribute** `icon`
 * @param {string} VIVID_VERSION - The current version of the Vivid library, which is useful for debugging.
 It can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.
 * @param {string} componentName - Core component name, without prefix
@@ -15,19 +16,19 @@ It can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.
 declare const VwcBadge: {
     (props: {
         children?: ReactNode;
-        slot?: string | undefined;
-        id?: string | undefined;
-        style?: React.CSSProperties | undefined;
-        ref?: React.RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-        connotation?: any;
-        shape?: any;
-        size?: any;
-        appearance?: any;
-        text?: string | undefined;
-        iconTrailing?: boolean | undefined;
-        icon?: string | undefined;
-        VIVID_VERSION?: string | undefined;
-        componentName?: string | undefined;
+        slot?: string;
+        id?: string;
+        style?: React.CSSProperties;
+        ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+        "connotation"?: any;
+        "shape"?: any;
+        "size"?: any;
+        "appearance"?: any;
+        "text"?: string | undefined;
+        "iconTrailing"?: boolean;
+        "icon"?: string | undefined;
+        "VIVID_VERSION"?: string;
+        "componentName"?: string;
     }): JSX.Element;
     displayName: string;
 };

package/v3/VwcBadge/index.js

@@ -302,7 +302,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "BadgeConnotation | undefined"
    },
-   "description": "The connotation the badge should have.",
+   "description": "Sets the badge connotation",
    "privacy": "public"
   },
   {
@@ -311,7 +311,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "BadgeShape | undefined"
    },
-   "description": "The shape the badge should have.",
+   "description": "Sets the badge border-radius",
    "privacy": "public"
   },
   {
@@ -320,7 +320,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "BadgeSize | undefined"
    },
-   "description": "The size the badge should have.",
+   "description": "Sets the badge size",
    "privacy": "public"
   },
   {
@@ -329,7 +329,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "BadgeAppearance | undefined"
    },
-   "description": "The appearance the badge should have.",
+   "description": "Sets the badge appearance",
    "privacy": "public"
   },
   {
@@ -338,7 +338,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string | undefined"
    },
-   "description": "Indicates the badge's text.",
+   "description": "Sets a text on the badge",
    "privacy": "public"
   },
   {
@@ -361,7 +361,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string | undefined"
    },
-   "description": "A decorative icon the custom element should have.",
+   "description": "A decorative icon the custom element should have. See the [Vivid Icon\nGallery](/icons/icons-gallery/) for available icons and `icon-name`s",
    "privacy": "public",
    "inheritedFrom": {
     "name": "AffixIcon",
@@ -402,7 +402,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "BadgeConnotation | undefined"
    },
-   "description": "The connotation the badge should have.",
+   "description": "Sets the badge connotation",
    "fieldName": "connotation"
   },
   {
@@ -410,7 +410,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "BadgeShape | undefined"
    },
-   "description": "The shape the badge should have.",
+   "description": "Sets the badge border-radius",
    "fieldName": "shape"
   },
   {
@@ -418,7 +418,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "BadgeSize | undefined"
    },
-   "description": "The size the badge should have.",
+   "description": "Sets the badge size",
    "fieldName": "size"
   },
   {
@@ -426,7 +426,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "BadgeAppearance | undefined"
    },
-   "description": "The appearance the badge should have.",
+   "description": "Sets the badge appearance",
    "fieldName": "appearance"
   },
   {
@@ -434,7 +434,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string | undefined"
    },
-   "description": "Indicates the badge's text.",
+   "description": "Sets a text on the badge",
    "fieldName": "text"
   },
   {
@@ -455,7 +455,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string | undefined"
    },
-   "description": "A decorative icon the custom element should have.",
+   "description": "A decorative icon the custom element should have. See the [Vivid Icon\nGallery](/icons/icons-gallery/) for available icons and `icon-name`s",
    "fieldName": "icon",
    "inheritedFrom": {
     "name": "AffixIcon",
@@ -479,7 +479,7 @@ Code in this file were generated using following JSON:
  }
 }
 */
-import wrapper from '@vonage/vivid-react-wrapper'
+import wrapper from '@repo/react-component-wrapper'
 import { registerBadge } from '@vonage/vivid'
 
 registerBadge('vvd3')

package/v3/VwcBadge/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@vonage/vivid-react-vvd3-badge",
-  "version": "5.5.0",
+  "version": "5.20.0",
   "main": "index.js",
   "types": "index.d.ts",
   "private": true,
   "license": "MIT",
   "dependencies": {
-    "@vonage/vivid": "5.5.0"
+    "@vonage/vivid": "5.20.0"
   }
 }

package/v3/VwcBanner/index.d.ts

@@ -3,13 +3,11 @@ import React, { ReactNode } from 'react';
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/banner
 * @param {| string
         | null} dismissButtonAriaLabel  **attribute** `dismiss-aria-label`
-* @param {string | undefined} actionHref  **attribute** `action-href`
-* @param {string | undefined} actionText  **attribute** `action-text`
 * @param {boolean} removable  **attribute** `removable`
 * @param {string | undefined} text  **attribute** `text`
 * @param {BannerConnotation | undefined} connotation  **attribute** `connotation`
-* @param {string | undefined} icon - A decorative icon the custom element should have. **attribute** `icon`
-* @param {'delegate'} _vividAriaBehaviour
+* @param {string | undefined} icon - A decorative icon the custom element should have. See the [Vivid Icon
+Gallery](/icons/icons-gallery/) for available icons and `icon-name`s **attribute** `icon`
 * @param {string} VIVID_VERSION - The current version of the Vivid library, which is useful for debugging.
 It can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.
 * @param {string} componentName - Core component name, without prefix
@@ -17,20 +15,17 @@ It can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.
 declare const VwcBanner: {
     (props: {
         children?: ReactNode;
-        slot?: string | undefined;
-        id?: string | undefined;
-        style?: React.CSSProperties | undefined;
-        ref?: React.RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-        dismissButtonAriaLabel?: any;
-        actionHref?: string | undefined;
-        actionText?: string | undefined;
-        removable?: boolean | undefined;
-        text?: string | undefined;
-        connotation?: any;
-        icon?: string | undefined;
-        _vividAriaBehaviour?: any;
-        VIVID_VERSION?: string | undefined;
-        componentName?: string | undefined;
+        slot?: string;
+        id?: string;
+        style?: React.CSSProperties;
+        ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+        "dismissButtonAriaLabel"?: string | null;
+        "removable"?: boolean;
+        "text"?: string | undefined;
+        "connotation"?: any;
+        "icon"?: string | undefined;
+        "VIVID_VERSION"?: string;
+        "componentName"?: string;
     }): JSX.Element;
     displayName: string;
 };