@vonage/vivid-react 3.5.2 → 4.0.0

package/v3/VwcNumberField/index.js

@@ -886,6 +886,10 @@ Code in this file were generated using following JSON:
   }
  ],
  "mixins": [
+  {
+   "name": "WithContextualHelp",
+   "module": "/src/shared/patterns"
+  },
   {
    "name": "WithFeedback",
    "module": "/src/shared/feedback/mixins"
@@ -944,6 +948,70 @@ Code in this file were generated using following JSON:
     "valueMapping": "event.currentTarget.valueAsNumber"
    }
   ]
+ },
+ "vividTesting": {
+  "selectors": [],
+  "actions": [
+   {
+    "name": "fill",
+    "args": [
+     "fill",
+     "#control"
+    ]
+   },
+   {
+    "name": "clear",
+    "args": [
+     "clear",
+     "#control"
+    ]
+   },
+   {
+    "name": "clickIncrement",
+    "args": [
+     "clickButton",
+     "#incrementButton"
+    ]
+   },
+   {
+    "name": "clickDecrement",
+    "args": [
+     "clickButton",
+     "#decrementButton"
+    ]
+   }
+  ],
+  "queries": [
+   {
+    "name": "valueAsNumber",
+    "args": [
+     "valueAsNumber"
+    ]
+   }
+  ],
+  "refs": [
+   {
+    "name": "control",
+    "args": [
+     "shadow",
+     "input.control"
+    ]
+   },
+   {
+    "name": "incrementButton",
+    "args": [
+     "shadowButton",
+     "#add"
+    ]
+   },
+   {
+    "name": "decrementButton",
+    "args": [
+     "shadowButton",
+     "#subtract"
+    ]
+   }
+  ]
  }
 }
 */

package/v3/VwcNumberField/package.json

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

package/v3/VwcOption/index.d.ts

@@ -4,7 +4,7 @@ Implements https://www.w3.org/TR/wai-aria-1.1/#option | ARIA option .
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/option
 * @param {boolean | undefined} checked - The checked state is used when the parent listbox is in multiple selection mode.
 To avoid accessibility conflicts, the checked state should not be present in
-single selection mode.
+single selection mode. **attribute** `checked`
 * @param {boolean} defaultSelected - The defaultSelected state of the option. **attribute** `selected`
 * @param {boolean} disabled - The disabled state of the option. **attribute** `disabled`
 * @param  selectedAttribute
@@ -14,6 +14,7 @@ single selection mode.
 * @param {string} label
 * @param {string | undefined} _text  **attribute** `text`
 * @param  text
+* @param {string | undefined} textSecondary  **attribute** `text-secondary`
 * @param {string | undefined} matchedText - Text to highlighted as matching a search query. **attribute** `matched-text`
 * @param {OptionTagConnotation | undefined} tagConnotation - When displayed as a tag, the connotation of the tag. **attribute** `tag-connotation`
 * @param  proxy
@@ -41,6 +42,7 @@ declare const VwcOption: {
         label?: string | undefined;
         _text?: string | undefined;
         text?: any;
+        textSecondary?: string | undefined;
         matchedText?: string | undefined;
         tagConnotation?: any;
         proxy?: any;

package/v3/VwcOption/index.js

@@ -45,6 +45,10 @@ Code in this file were generated using following JSON:
   {
    "description": "The preferred way to add an icon to the component.",
    "name": "icon"
+  },
+  {
+   "description": "For additional elements at the end of the Option.",
+   "name": "trailing-meta"
   }
  ],
  "members": [
@@ -163,6 +167,15 @@ Code in this file were generated using following JSON:
    "kind": "field",
    "name": "text"
   },
+  {
+   "kind": "field",
+   "name": "textSecondary",
+   "type": {
+    "text": "string | undefined"
+   },
+   "privacy": "public",
+   "description": ""
+  },
   {
    "kind": "field",
    "name": "form",
@@ -267,6 +280,14 @@ Code in this file were generated using following JSON:
   }
  ],
  "attributes": [
+  {
+   "name": "checked",
+   "type": {
+    "text": "boolean | undefined"
+   },
+   "description": "The checked state is used when the parent listbox is in multiple selection mode.\nTo avoid accessibility conflicts, the checked state should not be present in\nsingle selection mode.",
+   "fieldName": "checked"
+  },
   {
    "name": "selected",
    "type": {
@@ -315,6 +336,13 @@ Code in this file were generated using following JSON:
    },
    "fieldName": "_text"
   },
+  {
+   "name": "text-secondary",
+   "type": {
+    "text": "string | undefined"
+   },
+   "fieldName": "textSecondary"
+  },
   {
    "name": "matched-text",
    "type": {
@@ -374,6 +402,20 @@ Code in this file were generated using following JSON:
  "vividComponent": {
   "public": true,
   "name": "option"
+ },
+ "vividTesting": {
+  "selectors": [],
+  "actions": [
+   {
+    "name": "click",
+    "args": [
+     "click",
+     "#locator"
+    ]
+   }
+  ],
+  "queries": [],
+  "refs": []
  }
 }
 */
@@ -385,7 +427,7 @@ registerOption('vvd3')
 const VwcOption = wrapper(`vvd3-option`,  {
     events: [],
     attributes: [],
-    properties: ['checked', 'defaultSelected', 'disabled', 'selectedAttribute', 'selected', 'value', '_label', 'label', '_text', 'text', 'matchedText', 'tagConnotation', 'proxy', '_vividAriaBehaviour', 'iconTrailing', 'icon', 'VIVID_VERSION', 'componentName']
+    properties: ['checked', 'defaultSelected', 'disabled', 'selectedAttribute', 'selected', 'value', '_label', 'label', '_text', 'text', 'textSecondary', 'matchedText', 'tagConnotation', 'proxy', '_vividAriaBehaviour', 'iconTrailing', 'icon', 'VIVID_VERSION', 'componentName']
 })
 
 VwcOption.displayName = 'VwcOption'

package/v3/VwcOption/package.json

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

package/v3/VwcOptionTag/package.json

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

package/v3/VwcPagination/index.js

@@ -231,7 +231,72 @@ Code in this file were generated using following JSON:
  },
  "vividComponent": {
   "public": true,
-  "name": "pagination"
+  "name": "pagination",
+  "vueModels": [
+   {
+    "name": "modelValue",
+    "propName": "selectedIndex",
+    "eventNames": [
+     "pagination-change"
+    ],
+    "valueMapping": "event.currentTarget.selectedIndex"
+   }
+  ]
+ },
+ "vividTesting": {
+  "selectors": [],
+  "actions": [
+   {
+    "name": "clickNext",
+    "args": [
+     "click",
+     "#nextButton"
+    ]
+   },
+   {
+    "name": "clickPrev",
+    "args": [
+     "click",
+     "#prevButton"
+    ]
+   },
+   {
+    "name": "clickPageIndex",
+    "args": [
+     "clickPaginationPage"
+    ]
+   }
+  ],
+  "queries": [
+   {
+    "name": "total",
+    "args": [
+     "total"
+    ]
+   },
+   {
+    "name": "selectedPage",
+    "args": [
+     "paginationSelectedPage"
+    ]
+   }
+  ],
+  "refs": [
+   {
+    "name": "nextButton",
+    "args": [
+     "shadow",
+     ".next-button"
+    ]
+   },
+   {
+    "name": "prevButton",
+    "args": [
+     "shadow",
+     ".prev-button"
+    ]
+   }
+  ]
  }
 }
 */

package/v3/VwcPagination/package.json

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

package/v3/VwcPickerField/index.d.ts

@@ -18,7 +18,6 @@ only when the `value` property has not been explicitly set. **attribute** `value
 * @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
-* @param {boolean} specialHandling
 * @param {VividAriaBehaviour} _vividAriaBehaviour
 */
 declare const VwcPickerField: {
@@ -41,7 +40,6 @@ declare const VwcPickerField: {
         required?: boolean | undefined;
         VIVID_VERSION?: string | undefined;
         componentName?: string | undefined;
-        specialHandling?: boolean | undefined;
         _vividAriaBehaviour?: any;
     }): JSX.Element;
     displayName: string;

package/v3/VwcPickerField/index.js

@@ -42,7 +42,7 @@ Code in this file were generated using following JSON:
    "name": "#localeChangeObserver",
    "privacy": "private",
    "type": {
-    "text": "BindingObserver"
+    "text": "ExpressionNotifier"
    }
   },
   {
@@ -357,18 +357,6 @@ Code in this file were generated using following JSON:
     "module": "src/shared/foundation/vivid-element/vivid-element.ts"
    }
   },
-  {
-   "kind": "field",
-   "name": "specialHandling",
-   "type": {
-    "text": "boolean"
-   },
-   "default": "false",
-   "inheritedFrom": {
-    "name": "VividElement",
-    "module": "src/shared/foundation/vivid-element/vivid-element.ts"
-   }
-  },
   {
    "kind": "field",
    "name": "_vividAriaBehaviour",
@@ -508,6 +496,10 @@ Code in this file were generated using following JSON:
   }
  ],
  "mixins": [
+  {
+   "name": "WithContextualHelp",
+   "module": "/src/shared/patterns"
+  },
   {
    "name": "WithFeedback",
    "module": "/src/shared/feedback/mixins"
@@ -536,6 +528,41 @@ Code in this file were generated using following JSON:
  "superclass": {
   "name": "VividElement",
   "module": "/src/shared/foundation/vivid-element/vivid-element"
+ },
+ "vividTesting": {
+  "selectors": [],
+  "actions": [
+   {
+    "name": "clear",
+    "args": [
+     "clearPicker"
+    ]
+   }
+  ],
+  "queries": [],
+  "refs": [
+   {
+    "name": "control",
+    "args": [
+     "shadowTextField",
+     "[data-vvd-component=text-field].control"
+    ]
+   },
+   {
+    "name": "pickerButton",
+    "args": [
+     "shadowButton",
+     "#picker-button"
+    ]
+   },
+   {
+    "name": "clearButton",
+    "args": [
+     "shadowButton",
+     "#clear-button"
+    ]
+   }
+  ]
  }
 }
 */
@@ -547,7 +574,7 @@ registerPickerField('vvd3')
 const VwcPickerField = wrapper(`vvd3-picker-field`,  {
     events: [],
     attributes: [],
-    properties: ['readOnly', 'value', 'helperText', 'errorText', 'validate', 'label', 'currentValue', 'initialValue', 'disabled', 'name', 'required', 'VIVID_VERSION', 'componentName', 'specialHandling', '_vividAriaBehaviour']
+    properties: ['readOnly', 'value', 'helperText', 'errorText', 'validate', 'label', 'currentValue', 'initialValue', 'disabled', 'name', 'required', 'VIVID_VERSION', 'componentName', '_vividAriaBehaviour']
 })
 
 VwcPickerField.displayName = 'VwcPickerField'

package/v3/VwcPickerField/package.json

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

package/v3/VwcPopup/package.json

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

package/v3/VwcProgress/package.json

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

package/v3/VwcProgressRing/package.json

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

package/v3/VwcProseMirrorFacade/package.json

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

package/v3/VwcRadio/index.d.ts

@@ -1,7 +1,6 @@
 import React, { ReactNode, SyntheticEvent } from 'react';
 /** VwcRadio
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/radio
-* @param {string | null} ariaLabel  **attribute** `aria-label`
 * @param {RadioConnotation | undefined} connotation - The connotation the radioButton should have. **attribute** `connotation`
 * @param {boolean} readOnly - When true, the control will be immutable by user interaction. See https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly | readonly HTML attribute for more information. **attribute** `readonly`
 * @param {boolean} checked - The current checkedness of the element. **attribute** `current-checked`
@@ -32,7 +31,6 @@ declare const VwcRadio: {
         style?: React.CSSProperties | undefined;
         ref?: React.RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
         onChange?: ((event: SyntheticEvent) => void) | undefined;
-        ariaLabel?: string | null | undefined;
         connotation?: any;
         readOnly?: boolean | undefined;
         checked?: boolean | undefined;

package/v3/VwcRadio/index.js

@@ -58,14 +58,6 @@ Code in this file were generated using following JSON:
   }
  ],
  "members": [
-  {
-   "kind": "field",
-   "name": "ariaLabel",
-   "type": {
-    "text": "string | null"
-   },
-   "default": "null"
-  },
   {
    "kind": "field",
    "name": "connotation",
@@ -465,14 +457,6 @@ Code in this file were generated using following JSON:
   }
  ],
  "attributes": [
-  {
-   "name": "aria-label",
-   "type": {
-    "text": "string | null"
-   },
-   "default": "null",
-   "fieldName": "ariaLabel"
-  },
   {
    "name": "connotation",
    "type": {
@@ -622,6 +606,43 @@ Code in this file were generated using following JSON:
  "vividComponent": {
   "public": true,
   "name": "radio"
+ },
+ "vividTesting": {
+  "selectors": [],
+  "actions": [
+   {
+    "name": "check",
+    "args": [
+     "click",
+     "#control"
+    ]
+   }
+  ],
+  "queries": [
+   {
+    "name": "checked",
+    "args": [
+     "checked",
+     "true"
+    ]
+   },
+   {
+    "name": "unchecked",
+    "args": [
+     "checked",
+     "false"
+    ]
+   }
+  ],
+  "refs": [
+   {
+    "name": "control",
+    "args": [
+     "shadow",
+     ".control"
+    ]
+   }
+  ]
  }
 }
 */
@@ -633,7 +654,7 @@ registerRadio('vvd3')
 const VwcRadio = wrapper(`vvd3-radio`,  {
     events: [{"name":"change","propName":"onChange"}],
     attributes: [],
-    properties: ['ariaLabel', 'connotation', 'readOnly', 'checked', 'dirtyChecked', 'errorText', 'validate', 'label', 'defaultChecked', 'checkedAttribute', 'currentChecked', 'value', 'currentValue', 'initialValue', 'disabled', 'name', 'required', 'VIVID_VERSION', 'componentName']
+    properties: ['connotation', 'readOnly', 'checked', 'dirtyChecked', 'errorText', 'validate', 'label', 'defaultChecked', 'checkedAttribute', 'currentChecked', 'value', 'currentValue', 'initialValue', 'disabled', 'name', 'required', 'VIVID_VERSION', 'componentName']
 })
 
 VwcRadio.displayName = 'VwcRadio'

package/v3/VwcRadio/package.json

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

package/v3/VwcRadioGroup/package.json

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