@vonage/vivid-react 2.10.84 → 2.10.85

package/v3/VwcTextArea/package.json

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

package/v3/VwcTextField/index.js

@@ -49,6 +49,10 @@ Code in this file were generated using following JSON:
   {
    "description": "Used to add action items to the end of the text-field.",
    "name": "action-items"
+  },
+  {
+   "description": "Describes how to use the text-field. Alternative to the `helper-text` attribute.",
+   "name": "helper-text"
   }
  ],
  "members": [
@@ -131,6 +135,18 @@ Code in this file were generated using following JSON:
  "superclass": {
   "name": "FoundationTextfield",
   "package": "@microsoft/fast-foundation"
+ },
+ "vividComponent": {
+  "public": true,
+  "name": "text-field",
+  "vueModels": [
+   {
+    "name": "modelValue",
+    "attributeName": "current-value",
+    "eventName": "input",
+    "valueMapping": "(event.target as HTMLInputElement).value"
+   }
+  ]
  }
 }
 */

package/v3/VwcTextField/package.json

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

package/v3/VwcTimePicker/index.d.ts

@@ -1,5 +1,5 @@
 import React, { ReactNode, SyntheticEvent } from 'react';
-/** Base class for time-picker
+/** VwcTimePicker
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/time-picker
 * @param {boolean} readOnly - Whether the time-picker is readonly. **attribute** `readonly`
 * @param {number | null} minutesStep - Distance between presented minute options. **attribute** `minutes-step`

package/v3/VwcTimePicker/index.js

@@ -5,13 +5,17 @@
 Code in this file were generated using following JSON:
 {
  "kind": "class",
- "description": "Base class for time-picker",
+ "description": "",
  "name": "TimePicker",
  "cssProperties": [
   {
    "name": "--vvd-time-picker-accent-primary",
    "default": "var(--vvd-color-canvas-text)"
   },
+  {
+   "name": "--vvd-time-picker-accent-firm",
+   "default": "var(--vvd-color-canvas-text)"
+  },
   {
    "name": "--vvd-time-picker-accent-faint",
    "default": "var(--vvd-color-neutral-50)"
@@ -29,6 +33,12 @@ Code in this file were generated using following JSON:
    "default": "var(--vvd-color-neutral-300)"
   }
  ],
+ "slots": [
+  {
+   "description": "Describes how to use the time-picker. Alternative to the `helper-text` attribute.",
+   "name": "helper-text"
+  }
+ ],
  "members": [
   {
    "kind": "field",
@@ -244,6 +254,18 @@ Code in this file were generated using following JSON:
  "superclass": {
   "name": "FormAssociatedTimePicker",
   "module": "/libs/components/src/lib/time-picker/time-picker.form-associated"
+ },
+ "vividComponent": {
+  "public": true,
+  "name": "time-picker",
+  "vueModels": [
+   {
+    "name": "modelValue",
+    "attributeName": "current-value",
+    "eventName": "input",
+    "valueMapping": "(event.target as HTMLInputElement).value"
+   }
+  ]
  }
 }
 */

package/v3/VwcTimePicker/package.json

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

package/v3/VwcToggletip/index.d.ts

@@ -1,5 +1,5 @@
 import React, { ReactNode } from 'react';
-/** Base class for toggletip
+/** VwcToggletip
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/toggletip
 * @param {string | undefined} headline - the optional title of the toggletip **attribute** `headline`
 * @param {boolean} alternate - toggle color scheme **attribute** `alternate`

package/v3/VwcToggletip/index.js

@@ -5,13 +5,17 @@
 Code in this file were generated using following JSON:
 {
  "kind": "class",
- "description": "Base class for toggletip",
+ "description": "",
  "name": "Toggletip",
  "slots": [
   {
    "description": "The content to display in the toggletip.",
    "name": ""
   },
+  {
+   "description": "Used to set the anchor element for the toggletip.",
+   "name": "anchor"
+  },
   {
    "description": "The content to display in the toggletip action items.",
    "name": "action-items"
@@ -182,6 +186,10 @@ Code in this file were generated using following JSON:
  "superclass": {
   "name": "FoundationElement",
   "package": "@microsoft/fast-foundation"
+ },
+ "vividComponent": {
+  "public": true,
+  "name": "toggletip"
  }
 }
 */

package/v3/VwcToggletip/package.json

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

package/v3/VwcTooltip/index.d.ts

@@ -1,5 +1,5 @@
 import React, { ReactNode } from 'react';
-/** Base class for tooltip
+/** VwcTooltip
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/tooltip
 * @param {string | undefined} text - the text of the tooltip
 accepts string **attribute** `text`

package/v3/VwcTooltip/index.js

@@ -5,8 +5,14 @@
 Code in this file were generated using following JSON:
 {
  "kind": "class",
- "description": "Base class for tooltip",
+ "description": "",
  "name": "Tooltip",
+ "slots": [
+  {
+   "description": "Used to set the anchor element for the tooltip.",
+   "name": "anchor"
+  }
+ ],
  "members": [
   {
    "kind": "field",
@@ -102,6 +108,10 @@ Code in this file were generated using following JSON:
  "superclass": {
   "name": "FoundationElement",
   "package": "@microsoft/fast-foundation"
+ },
+ "vividComponent": {
+  "public": true,
+  "name": "tooltip"
  }
 }
 */

package/v3/VwcTooltip/package.json

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

package/v3/VwcTreeItem/index.d.ts

@@ -1,5 +1,5 @@
 import React, { ReactNode } from 'react';
-/** Base class for tree-item
+/** VwcTreeItem
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/tree-item
 * @param {string | undefined} text - Indicates the text's text. **attribute** `text`
 */

package/v3/VwcTreeItem/index.js

@@ -5,7 +5,7 @@
 Code in this file were generated using following JSON:
 {
  "kind": "class",
- "description": "Base class for tree-item",
+ "description": "",
  "name": "TreeItem",
  "cssProperties": [
   {
@@ -63,6 +63,10 @@ Code in this file were generated using following JSON:
  "superclass": {
   "name": "FastTreeItem",
   "package": "@microsoft/fast-foundation"
+ },
+ "vividComponent": {
+  "public": true,
+  "name": "tree-item"
  }
 }
 */

package/v3/VwcTreeItem/package.json

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

package/v3/VwcTreeView/index.d.ts

@@ -1,5 +1,5 @@
 import React, { ReactNode } from 'react';
-/** Base class for Tree View
+/** VwcTreeView
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/tree-view
 
 */

package/v3/VwcTreeView/index.js

@@ -5,7 +5,7 @@
 Code in this file were generated using following JSON:
 {
  "kind": "class",
- "description": "Base class for Tree View",
+ "description": "",
  "name": "TreeView",
  "slots": [
   {
@@ -16,6 +16,10 @@ Code in this file were generated using following JSON:
  "superclass": {
   "name": "FastTreeView",
   "package": "@microsoft/fast-foundation"
+ },
+ "vividComponent": {
+  "public": true,
+  "name": "tree-view"
  }
 }
 */

package/v3/VwcTreeView/package.json

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

package/v3/VwcVideoPlayer/index.d.ts

@@ -0,0 +1,30 @@
+import React, { ReactNode, SyntheticEvent } from 'react';
+/** Base class for video-player
+* For more info on this Vivid element please visit https://vivid.deno.dev/components/video-player
+* @param {string | undefined} poster - Reference to an image which is displayed before the video is played **attribute** `poster`
+* @param {string | undefined} src - URL of a video file **attribute** `src`
+* @param {boolean} autoplay - Allows the video will play automatically (muted) **attribute** `autoplay`
+* @param {boolean} loop - Allows the video to loop back to the beginning when finished **attribute** `loop`
+* @param {string} playbackRates - Sets the available playback rates. When an empty string, no choices will be available **attribute** `playback-rates`
+* @param {MediaSkipBy} skipBy - Allows the video to loop back to the beginning when finished **attribute** `skip-by`
+*/
+declare const VwcVideoPlayer: {
+    (props: {
+        children?: ReactNode;
+        slot?: string | undefined;
+        id?: string | undefined;
+        style?: React.CSSProperties | undefined;
+        ref?: React.RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
+        onPlay?: ((event: SyntheticEvent) => void) | undefined;
+        onPause?: ((event: SyntheticEvent) => void) | undefined;
+        onEnded?: ((event: SyntheticEvent) => void) | undefined;
+        poster?: string | undefined;
+        src?: string | undefined;
+        autoplay?: boolean | undefined;
+        loop?: boolean | undefined;
+        playbackRates?: string | undefined;
+        skipBy?: any;
+    }): JSX.Element;
+    displayName: string;
+};
+export default VwcVideoPlayer;

package/v3/VwcVideoPlayer/index.js

@@ -0,0 +1,212 @@
+/*
+* DO NOT EDIT THIS FILE. IT IS GENERATED
+*/
+/*
+Code in this file were generated using following JSON:
+{
+ "kind": "class",
+ "description": "Base class for video-player",
+ "name": "VideoPlayer",
+ "slots": [
+  {
+   "description": "Default slot",
+   "name": ""
+  }
+ ],
+ "members": [
+  {
+   "kind": "field",
+   "name": "poster",
+   "type": {
+    "text": "string | undefined"
+   },
+   "description": "Reference to an image which is displayed before the video is played",
+   "privacy": "public"
+  },
+  {
+   "kind": "field",
+   "name": "src",
+   "type": {
+    "text": "string | undefined"
+   },
+   "description": "URL of a video file",
+   "privacy": "public"
+  },
+  {
+   "kind": "field",
+   "name": "autoplay",
+   "type": {
+    "text": "boolean"
+   },
+   "default": "false",
+   "description": "Allows the video will play automatically (muted)",
+   "privacy": "public"
+  },
+  {
+   "kind": "field",
+   "name": "loop",
+   "type": {
+    "text": "boolean"
+   },
+   "default": "false",
+   "description": "Allows the video to loop back to the beginning when finished",
+   "privacy": "public"
+  },
+  {
+   "kind": "field",
+   "name": "playbackRates",
+   "type": {
+    "text": "string"
+   },
+   "default": "'0.5, 1, 1.5, 2'",
+   "description": "Sets the available playback rates. When an empty string, no choices will be available",
+   "privacy": "public"
+  },
+  {
+   "kind": "field",
+   "name": "skipBy",
+   "type": {
+    "text": "MediaSkipBy"
+   },
+   "description": "Allows the video to loop back to the beginning when finished",
+   "privacy": "public"
+  },
+  {
+   "kind": "field",
+   "name": "#noSourceErrorElement",
+   "privacy": "private",
+   "readonly": true
+  },
+  {
+   "kind": "method",
+   "name": "#disposePlayer"
+  },
+  {
+   "kind": "method",
+   "name": "#setupVideoElement"
+  },
+  {
+   "kind": "field",
+   "name": "#controlElement",
+   "privacy": "private",
+   "readonly": true
+  },
+  {
+   "kind": "method",
+   "name": "#hideNoSourceError",
+   "parameters": [
+    {
+     "name": "show",
+     "default": "true"
+    }
+   ]
+  },
+  {
+   "kind": "method",
+   "name": "#setupVideoPlayer",
+   "parameters": [
+    {
+     "name": "settings",
+     "type": {
+      "text": "any"
+     }
+    }
+   ]
+  },
+  {
+   "kind": "method",
+   "name": "#setupPlayerEvents"
+  }
+ ],
+ "events": [
+  {
+   "description": "Fired when the video is played",
+   "name": "play"
+  },
+  {
+   "description": "Fired when the video is paused",
+   "name": "pause"
+  },
+  {
+   "description": "Fired when the video is ended",
+   "name": "ended"
+  }
+ ],
+ "attributes": [
+  {
+   "name": "poster",
+   "type": {
+    "text": "string | undefined"
+   },
+   "description": "Reference to an image which is displayed before the video is played",
+   "fieldName": "poster"
+  },
+  {
+   "name": "src",
+   "type": {
+    "text": "string | undefined"
+   },
+   "description": "URL of a video file",
+   "fieldName": "src"
+  },
+  {
+   "type": {
+    "text": "boolean"
+   },
+   "default": "false",
+   "description": "Allows the video will play automatically (muted)",
+   "fieldName": "autoplay"
+  },
+  {
+   "type": {
+    "text": "boolean"
+   },
+   "default": "false",
+   "description": "Allows the video to loop back to the beginning when finished",
+   "fieldName": "loop"
+  },
+  {
+   "name": "playback-rates",
+   "type": {
+    "text": "string"
+   },
+   "default": "DEFAULT_PLAYBACK_RATES",
+   "description": "Sets the available playback rates. When an empty string, no choices will be available",
+   "resolveInitializer": {
+    "module": "libs/components/src/lib/video-player/video-player.ts"
+   },
+   "fieldName": "playbackRates"
+  },
+  {
+   "name": "skip-by",
+   "type": {
+    "text": "MediaSkipBy"
+   },
+   "description": "Allows the video to loop back to the beginning when finished",
+   "fieldName": "skipBy"
+  }
+ ],
+ "superclass": {
+  "name": "FoundationElement",
+  "package": "@microsoft/fast-foundation"
+ },
+ "vividComponent": {
+  "public": true,
+  "name": "video-player"
+ }
+}
+*/
+import wrapper from '@vonage/vivid-react-wrapper'
+import { registerVideoPlayer } from '@vonage/vivid'
+
+registerVideoPlayer('vvd3')
+
+const VwcVideoPlayer = wrapper(`vvd3-video-player`,  {
+    events: [{"name":"ended","propName":"onEnded"},{"name":"pause","propName":"onPause"},{"name":"play","propName":"onPlay"}],
+    attributes: [],
+    properties: ['poster', 'src', 'autoplay', 'loop', 'playbackRates', 'skipBy']
+})
+
+VwcVideoPlayer.displayName = 'VwcVideoPlayer'
+
+export default VwcVideoPlayer

package/v3/VwcVideoPlayer/package.json

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

package/v3/VwcFocus/index.js

@@ -1,29 +0,0 @@
-/*
-* DO NOT EDIT THIS FILE. IT IS GENERATED
-*/
-/*
-Code in this file were generated using following JSON:
-{
- "kind": "class",
- "description": "Base class for focus",
- "name": "Focus",
- "superclass": {
-  "name": "FoundationElement",
-  "package": "@microsoft/fast-foundation"
- }
-}
-*/
-import wrapper from '@vonage/vivid-react-wrapper'
-import { registerFocus } from '@vonage/vivid'
-
-registerFocus('vvd3')
-
-const VwcFocus = wrapper(`vvd3-focus`,  {
-    events: [],
-    attributes: [],
-    properties: []
-})
-
-VwcFocus.displayName = 'VwcFocus'
-
-export default VwcFocus

package/v3/VwcPopup/index.d.ts

@@ -1,33 +0,0 @@
-import React, { ReactNode } from 'react';
-/** Base class for popup
-* For more info on this Vivid element please visit https://vivid.deno.dev/components/popup
-* @param {HTMLElement} popupEl
-* @param {HTMLElement} arrowEl
-* @param {boolean} open - indicates whether the popup is open **attribute** `open`
-* @param {boolean} dismissible - adds close button to the popup **attribute** `dismissible`
-* @param {boolean} arrow - adds small triangle to indicate the trigger element **attribute** `arrow`
-* @param {boolean} alternate - set the color-scheme to dark **attribute** `alternate`
-* @param {Placement | undefined} placement - the placement of the popup **attribute** `placement`
-* @param {Strategy | undefined} strategy - the strategy of the popup **attribute** `strategy`
-* @param {HTMLElement | undefined} anchor - The element to anchor the popup to.
-*/
-declare const VwcPopup: {
-    (props: {
-        children?: ReactNode;
-        slot?: string | undefined;
-        id?: string | undefined;
-        style?: React.CSSProperties | undefined;
-        ref?: React.RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-        popupEl?: any;
-        arrowEl?: any;
-        open?: boolean | undefined;
-        dismissible?: boolean | undefined;
-        arrow?: boolean | undefined;
-        alternate?: boolean | undefined;
-        placement?: any;
-        strategy?: any;
-        anchor?: any;
-    }): JSX.Element;
-    displayName: string;
-};
-export default VwcPopup;