@vonage/vivid-react 2.10.84 → 2.10.86

package/v3/VwcElevation/index.js

@@ -5,7 +5,7 @@
 Code in this file were generated using following JSON:
 {
  "kind": "class",
- "description": "Base class for elevation",
+ "description": "",
  "name": "Elevation",
  "slots": [
   {
@@ -54,6 +54,9 @@ Code in this file were generated using following JSON:
  "superclass": {
   "name": "FoundationElement",
   "package": "@microsoft/fast-foundation"
+ },
+ "vividComponent": {
+  "name": "elevation"
  }
 }
 */

package/v3/VwcElevation/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@vonage/vivid-react-vvd3-elevation",
-  "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/VwcEmptyState/index.js

@@ -62,6 +62,10 @@ Code in this file were generated using following JSON:
  "superclass": {
   "name": "FoundationElement",
   "package": "@microsoft/fast-foundation"
+ },
+ "vividComponent": {
+  "public": true,
+  "name": "empty-state"
  }
 }
 */

package/v3/VwcEmptyState/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@vonage/vivid-react-vvd3-empty-state",
-  "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/VwcFab/index.d.ts

@@ -1,5 +1,5 @@
 import React, { ReactNode } from 'react';
-/** Base class for fab
+/** VwcFab
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/fab
 * @param {FabConnotation | undefined} connotation - The connotation the fab should have. **attribute** `connotation`
 * @param {FABSize | undefined} size - The size the FAB should have. **attribute** `size`

package/v3/VwcFab/index.js

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

package/v3/VwcFab/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@vonage/vivid-react-vvd3-fab",
-  "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/VwcFilePicker/index.d.ts

@@ -1,5 +1,5 @@
 import React, { ReactNode, SyntheticEvent } from 'react';
-/** File-picker component
+/** VwcFilePicker
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/file-picker
 * @param {number | undefined} maxFiles - The max files that can be selected. **attribute** `max-files`
 * @param {number} maxFileSize - The max file size that can be selected. **attribute** `max-file-size`

package/v3/VwcFilePicker/index.js

@@ -5,8 +5,14 @@
 Code in this file were generated using following JSON:
 {
  "kind": "class",
- "description": "File-picker component",
+ "description": "",
  "name": "FilePicker",
+ "slots": [
+  {
+   "description": "Describes how to use the file-picker. Alternative to the `helper-text` attribute.",
+   "name": "helper-text"
+  }
+ ],
  "members": [
   {
    "kind": "field",
@@ -281,6 +287,10 @@ Code in this file were generated using following JSON:
  "superclass": {
   "name": "FormAssociatedFilePicker",
   "module": "/libs/components/src/lib/file-picker/file-picker.form-associated"
+ },
+ "vividComponent": {
+  "public": true,
+  "name": "file-picker"
  }
 }
 */

package/v3/VwcFilePicker/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@vonage/vivid-react-vvd3-file-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/VwcFormAssociatedFilePicker/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@vonage/vivid-react-vvd3-form-associated-file-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/{VwcFocus → VwcFormAssociatedRangeSlider}/index.d.ts

@@ -1,16 +1,17 @@
 import React, { ReactNode } from 'react';
-/** Base class for focus
-* For more info on this Vivid element please visit https://vivid.deno.dev/components/focus
-
+/** VwcFormAssociatedRangeSlider
+* For more info on this Vivid element please visit https://vivid.deno.dev/components/form-associated-range-slider
+* @param  proxy
 */
-declare const VwcFocus: {
+declare const VwcFormAssociatedRangeSlider: {
     (props: {
         children?: ReactNode;
         slot?: string | undefined;
         id?: string | undefined;
         style?: React.CSSProperties | undefined;
         ref?: React.RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
+        proxy?: any;
     }): JSX.Element;
     displayName: string;
 };
-export default VwcFocus;
+export default VwcFormAssociatedRangeSlider;

package/v3/VwcFormAssociatedRangeSlider/index.js

@@ -0,0 +1,41 @@
+/*
+* DO NOT EDIT THIS FILE. IT IS GENERATED
+*/
+/*
+Code in this file were generated using following JSON:
+{
+ "kind": "class",
+ "description": "",
+ "name": "FormAssociatedRangeSlider",
+ "members": [
+  {
+   "kind": "field",
+   "name": "proxy"
+  }
+ ],
+ "mixins": [
+  {
+   "name": "FormAssociated",
+   "package": "@microsoft/fast-foundation"
+  }
+ ],
+ "superclass": {
+  "name": "_RangeSlider",
+  "module": "libs/components/src/lib/range-slider/range-slider.form-associated.ts"
+ }
+}
+*/
+import wrapper from '@vonage/vivid-react-wrapper'
+import { registerFormAssociatedRangeSlider } from '@vonage/vivid'
+
+registerFormAssociatedRangeSlider('vvd3')
+
+const VwcFormAssociatedRangeSlider = wrapper(`vvd3-form-associated-range-slider`,  {
+    events: [],
+    attributes: [],
+    properties: ['proxy']
+})
+
+VwcFormAssociatedRangeSlider.displayName = 'VwcFormAssociatedRangeSlider'
+
+export default VwcFormAssociatedRangeSlider

package/v3/VwcFormAssociatedRangeSlider/package.json

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

package/v3/VwcFormAssociatedTimePicker/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@vonage/vivid-react-vvd3-form-associated-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/VwcHeader/index.d.ts

@@ -1,5 +1,5 @@
 import React, { ReactNode } from 'react';
-/** Base class for header
+/** VwcHeader
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/header
 * @param {boolean} elevationShadow - header elevation shadow **attribute** `elevation-shadow`
 * @param {boolean} alternate - applies scheme alternate to header region **attribute** `alternate`

package/v3/VwcHeader/index.js

@@ -5,7 +5,7 @@
 Code in this file were generated using following JSON:
 {
  "kind": "class",
- "description": "Base class for header",
+ "description": "",
  "name": "Header",
  "slots": [
   {
@@ -65,6 +65,10 @@ Code in this file were generated using following JSON:
  "superclass": {
   "name": "FoundationElement",
   "package": "@microsoft/fast-foundation"
+ },
+ "vividComponent": {
+  "public": true,
+  "name": "header"
  }
 }
 */

package/v3/VwcHeader/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@vonage/vivid-react-vvd3-header",
-  "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/VwcIcon/index.js

@@ -112,6 +112,10 @@ Code in this file were generated using following JSON:
  "superclass": {
   "name": "FoundationElement",
   "package": "@microsoft/fast-foundation"
+ },
+ "vividComponent": {
+  "public": true,
+  "name": "icon"
  }
 }
 */

package/v3/VwcIcon/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@vonage/vivid-react-vvd3-icon",
-  "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/VwcLayout/index.d.ts

@@ -1,7 +1,5 @@
 import React, { ReactNode } from 'react';
-/** Base class for layout
-
-[--layout-grid-template-columns=repeat([the `auto-sizing` mapped value],
+/** [--layout-grid-template-columns=repeat([the `auto-sizing` mapped value],
 minmax([the `column-basis` mapped value], 1fr))] - Controls the `grid-template-columns` of the layout.
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/layout
 * @param {Gutters | undefined} gutters - sets the initial preferred margin from predefined available options **attribute** `gutters`

package/v3/VwcLayout/index.js

@@ -5,7 +5,7 @@
 Code in this file were generated using following JSON:
 {
  "kind": "class",
- "description": "Base class for layout\n\n[--layout-grid-template-columns=repeat([the `auto-sizing` mapped value],\nminmax([the `column-basis` mapped value], 1fr))] - Controls the `grid-template-columns` of the layout.",
+ "description": "[--layout-grid-template-columns=repeat([the `auto-sizing` mapped value],\nminmax([the `column-basis` mapped value], 1fr))] - Controls the `grid-template-columns` of the layout.",
  "name": "Layout",
  "slots": [
   {
@@ -105,6 +105,10 @@ Code in this file were generated using following JSON:
  "superclass": {
   "name": "FoundationElement",
   "package": "@microsoft/fast-foundation"
+ },
+ "vividComponent": {
+  "public": true,
+  "name": "layout"
  }
 }
 */

package/v3/VwcLayout/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@vonage/vivid-react-vvd3-layout",
-  "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/VwcListbox/index.d.ts

@@ -1,5 +1,5 @@
 import React, { ReactNode } from 'react';
-/** Base class for listbox
+/** VwcListbox
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/listbox
 * @param {LisboxAppearance | undefined} appearance - The appearance the listbox should have. **attribute** `appearance`
 * @param {'horizontal' | 'vertical' | undefined} orientation - The direction the listbox options should flow. **attribute** `orientation`

package/v3/VwcListbox/index.js

@@ -5,7 +5,7 @@
 Code in this file were generated using following JSON:
 {
  "kind": "class",
- "description": "Base class for listbox",
+ "description": "",
  "name": "Listbox",
  "cssProperties": [
   {
@@ -121,6 +121,9 @@ Code in this file were generated using following JSON:
  "superclass": {
   "name": "FoundationListboxElement",
   "package": "@microsoft/fast-foundation"
+ },
+ "vividComponent": {
+  "name": "listbox"
  }
 }
 */

package/v3/VwcListbox/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@vonage/vivid-react-vvd3-listbox",
-  "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/VwcMenu/index.d.ts

@@ -1,5 +1,5 @@
 import React, { ReactNode, SyntheticEvent } from 'react';
-/** Base class for menu
+/** VwcMenu
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/menu
 * @param {string | null} ariaLabel  **attribute** `aria-label`
 * @param {Placement | undefined} placement - placement of the menu **attribute** `placement`

package/v3/VwcMenu/index.js

@@ -5,13 +5,17 @@
 Code in this file were generated using following JSON:
 {
  "kind": "class",
- "description": "Base class for menu",
+ "description": "",
  "name": "Menu",
  "slots": [
   {
    "description": "Default slot.",
    "name": ""
   },
+  {
+   "description": "Used to set the anchor element for the menu.",
+   "name": "anchor"
+  },
   {
    "description": "Used to add additional content to the top of the menu.",
    "name": "header"
@@ -139,12 +143,23 @@ Code in this file were generated using following JSON:
   },
   {
    "kind": "field",
-   "name": "#updateClickOutsideListener",
+   "name": "#updateClickOutsideListeners",
+   "privacy": "private"
+  },
+  {
+   "kind": "field",
+   "name": "#wasOpenBeforeClick",
+   "privacy": "private",
+   "default": "new WeakMap<Event, boolean>()"
+  },
+  {
+   "kind": "field",
+   "name": "#onClickOutsideCapture",
    "privacy": "private"
   },
   {
    "kind": "field",
-   "name": "#closeOnClickOutside",
+   "name": "#onClickOutside",
    "privacy": "private"
   },
   {
@@ -207,6 +222,10 @@ Code in this file were generated using following JSON:
  "superclass": {
   "name": "FastMenu",
   "package": "@microsoft/fast-foundation"
+ },
+ "vividComponent": {
+  "public": true,
+  "name": "menu"
  }
 }
 */

package/v3/VwcMenu/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@vonage/vivid-react-vvd3-menu",
-  "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/VwcMenuItem/index.d.ts

@@ -1,8 +1,9 @@
 import React, { ReactNode, SyntheticEvent } from 'react';
-/** Base class for menu-item
+/** VwcMenuItem
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/menu-item
 * @param {string | undefined} text - Indicates the menu item's text. **attribute** `text`
 * @param {string | undefined} textSecondary - Indicates the menu item's secondary text. **attribute** `text-secondary`
+* @param {MenuItemConnotation | undefined} connotation - The connotation the fab should have. **attribute** `connotation`
 * @param {boolean} checkTrailing - Controls the placement of the menu item's checkmark or radio icon. **attribute** `check-trailing`
 * @param {CheckAppearance | undefined} checkedAppearance - Controls the appearance of the check indicator. **attribute** `check-appearance`
 * @param {HTMLElement[] | undefined} trailingMetaSlottedContent
@@ -19,6 +20,7 @@ declare const VwcMenuItem: {
         onChange?: ((event: SyntheticEvent) => void) | undefined;
         text?: string | undefined;
         textSecondary?: string | undefined;
+        connotation?: any;
         checkTrailing?: boolean | undefined;
         checkedAppearance?: any;
         trailingMetaSlottedContent?: any;

package/v3/VwcMenuItem/index.js

@@ -5,9 +5,41 @@
 Code in this file were generated using following JSON:
 {
  "kind": "class",
- "description": "Base class for menu-item",
+ "description": "",
  "name": "MenuItem",
  "cssProperties": [
+  {
+   "name": "--vvd-menu-item-cta-primary",
+   "default": "var(--vvd-color-cta-500)"
+  },
+  {
+   "name": "--vvd-menu-item-cta-primary-text",
+   "default": "var(--vvd-color-canvas)"
+  },
+  {
+   "name": "--vvd-menu-item-cta-primary-increment",
+   "default": "var(--vvd-color-cta-600)"
+  },
+  {
+   "name": "--vvd-menu-item-cta-firm",
+   "default": "var(--vvd-color-cta-600)"
+  },
+  {
+   "name": "--vvd-menu-item-cta-faint",
+   "default": "var(--vvd-color-cta-50)"
+  },
+  {
+   "name": "--vvd-menu-item-cta-soft",
+   "default": "var(--vvd-color-cta-100)"
+  },
+  {
+   "name": "--vvd-menu-item-cta-pale",
+   "default": "var(--vvd-color-cta-300)"
+  },
+  {
+   "name": "--vvd-menu-item-cta-dim",
+   "default": "var(--vvd-color-cta-200)"
+  },
   {
    "name": "--vvd-menu-item-accent-primary",
    "default": "var(--vvd-color-canvas-text)"
@@ -20,6 +52,10 @@ Code in this file were generated using following JSON:
    "name": "--vvd-menu-item-accent-primary-increment",
    "default": "var(--vvd-color-neutral-800)"
   },
+  {
+   "name": "--vvd-menu-item-accent-firm",
+   "default": "var(--vvd-color-canvas-text)"
+  },
   {
    "name": "--vvd-menu-item-accent-faint",
    "default": "var(--vvd-color-neutral-50)"
@@ -70,6 +106,15 @@ Code in this file were generated using following JSON:
    "description": "Indicates the menu item's secondary text.",
    "privacy": "public"
   },
+  {
+   "kind": "field",
+   "name": "connotation",
+   "type": {
+    "text": "MenuItemConnotation | undefined"
+   },
+   "description": "The connotation the fab should have.",
+   "privacy": "public"
+  },
   {
    "kind": "field",
    "name": "checkTrailing",
@@ -139,6 +184,14 @@ Code in this file were generated using following JSON:
    "description": "Indicates the menu item's secondary text.",
    "fieldName": "textSecondary"
   },
+  {
+   "name": "connotation",
+   "type": {
+    "text": "MenuItemConnotation | undefined"
+   },
+   "description": "The connotation the fab should have.",
+   "fieldName": "connotation"
+  },
   {
    "name": "check-trailing",
    "type": {
@@ -160,6 +213,18 @@ Code in this file were generated using following JSON:
  "superclass": {
   "name": "FastMenuItem",
   "package": "@microsoft/fast-foundation"
+ },
+ "vividComponent": {
+  "public": true,
+  "name": "menu-item",
+  "vueModels": [
+   {
+    "name": "modelValue",
+    "attributeName": "checked",
+    "eventName": "change",
+    "valueMapping": "(event.target as HTMLInputElement).checked"
+   }
+  ]
  }
 }
 */
@@ -171,7 +236,7 @@ registerMenuItem('vvd3')
 const VwcMenuItem = wrapper(`vvd3-menu-item`,  {
     events: [{"name":"change","propName":"onChange"}],
     attributes: [],
-    properties: ['text', 'textSecondary', 'checkTrailing', 'checkedAppearance', 'trailingMetaSlottedContent', 'updateSubmenu', 'icon']
+    properties: ['text', 'textSecondary', 'connotation', 'checkTrailing', 'checkedAppearance', 'trailingMetaSlottedContent', 'updateSubmenu', 'icon']
 })
 
 VwcMenuItem.displayName = 'VwcMenuItem'

package/v3/VwcMenuItem/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@vonage/vivid-react-vvd3-menu-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/VwcNav/index.d.ts

@@ -1,6 +1,5 @@
 import React, { ReactNode } from 'react';
-/** A Nav Item Custom HTML Element.
-Based largely on the https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a | <a> element .
+/** VwcNav
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/nav
 
 */