@vonage/vivid-react 3.2.0 → 3.3.1

package/v3/VwcMenu/index.d.ts

@@ -5,11 +5,10 @@ import React, { ReactNode, SyntheticEvent } from 'react';
 * @param {Placement | undefined} placement - placement of the menu **attribute** `placement`
 * @param {'auto' | 'legacy' | 'off' | undefined} trigger - Controls how the menu opens and closes itself. **attribute** `trigger`
 * @param {boolean} autoDismiss - indicates whether the menu will automatically close when focus moves away from it. **attribute** `auto-dismiss`
+* @param {Strategy | undefined} positionStrategy - The strategy-absolute attribute. **attribute** `position-strategy`
 * @param {boolean} open - indicates whether the menu is open **attribute** `open`
 * @param  _onFocusout
 * @param {HTMLElement[] | undefined} actionItemsSlottedContent
-* @param  handleFocusOut
-* @param  domChildren
 */
 declare const VwcMenu: {
     (props: {
@@ -24,11 +23,10 @@ declare const VwcMenu: {
         placement?: any;
         trigger?: any;
         autoDismiss?: boolean | undefined;
+        positionStrategy?: any;
         open?: boolean | undefined;
         _onFocusout?: any;
         actionItemsSlottedContent?: any;
-        handleFocusOut?: any;
-        domChildren?: any;
     }): JSX.Element;
     displayName: string;
 };

package/v3/VwcMenu/index.js

@@ -26,6 +26,132 @@ Code in this file were generated using following JSON:
   }
  ],
  "members": [
+  {
+   "kind": "field",
+   "name": "menuItems",
+   "type": {
+    "text": "Element[] | undefined"
+   },
+   "privacy": "private"
+  },
+  {
+   "kind": "field",
+   "name": "expandedItem",
+   "type": {
+    "text": "MenuItem | null"
+   },
+   "privacy": "private",
+   "default": "null"
+  },
+  {
+   "kind": "field",
+   "name": "focusIndex",
+   "type": {
+    "text": "number"
+   },
+   "privacy": "private",
+   "default": "-1",
+   "description": "The index of the focusable element in the items array\ndefaults to -1"
+  },
+  {
+   "kind": "field",
+   "name": "focusableElementRoles",
+   "type": {
+    "text": "{ [key: string]: string }"
+   },
+   "privacy": "private",
+   "static": true,
+   "default": "roleForMenuItem"
+  },
+  {
+   "kind": "method",
+   "name": "focus",
+   "return": {
+    "type": {
+     "text": "void"
+    }
+   },
+   "description": "Moves focus into the menu. If there is a child with the `autofocus` attribute, it will be focused.\nOtherwise, the first focusable child will be focused.",
+   "privacy": "public"
+  },
+  {
+   "kind": "method",
+   "name": "collapseExpandedItem",
+   "return": {
+    "type": {
+     "text": "void"
+    }
+   },
+   "description": "Collapses any expanded Menu Items.",
+   "privacy": "public"
+  },
+  {
+   "kind": "field",
+   "name": "handleItemFocus",
+   "privacy": "private"
+  },
+  {
+   "kind": "field",
+   "name": "handleExpandedChanged",
+   "privacy": "private"
+  },
+  {
+   "kind": "field",
+   "name": "removeItemListeners",
+   "privacy": "private"
+  },
+  {
+   "kind": "field",
+   "name": "setItems",
+   "privacy": "private"
+  },
+  {
+   "kind": "method",
+   "name": "domChildren",
+   "privacy": "private",
+   "return": {
+    "type": {
+     "text": "Element[]"
+    }
+   },
+   "description": "get an array of valid DOM children"
+  },
+  {
+   "kind": "field",
+   "name": "isMenuItemElement",
+   "privacy": "private",
+   "description": "check if the item is a menu item"
+  },
+  {
+   "kind": "field",
+   "name": "isFocusableElement",
+   "privacy": "private",
+   "description": "check if the item is focusable"
+  },
+  {
+   "kind": "method",
+   "name": "setFocus",
+   "privacy": "private",
+   "return": {
+    "type": {
+     "text": "void"
+    }
+   },
+   "parameters": [
+    {
+     "name": "focusIndex",
+     "type": {
+      "text": "number"
+     }
+    },
+    {
+     "name": "adjustment",
+     "type": {
+      "text": "number"
+     }
+    }
+   ]
+  },
   {
    "kind": "field",
    "name": "ariaLabel",
@@ -72,6 +198,16 @@ Code in this file were generated using following JSON:
    "description": "indicates whether the menu will automatically close when focus moves away from it.",
    "privacy": "public"
   },
+  {
+   "kind": "field",
+   "name": "positionStrategy",
+   "type": {
+    "text": "Strategy | undefined"
+   },
+   "default": "'fixed'",
+   "description": "The strategy-absolute attribute.",
+   "privacy": "public"
+  },
   {
    "kind": "field",
    "name": "open",
@@ -156,14 +292,6 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "HTMLElement[] | undefined"
    }
-  },
-  {
-   "kind": "field",
-   "name": "handleFocusOut"
-  },
-  {
-   "kind": "field",
-   "name": "domChildren"
   }
  ],
  "events": [
@@ -216,6 +344,15 @@ Code in this file were generated using following JSON:
    "description": "indicates whether the menu will automatically close when focus moves away from it.",
    "fieldName": "autoDismiss"
   },
+  {
+   "name": "position-strategy",
+   "type": {
+    "text": "Strategy | undefined"
+   },
+   "default": "'fixed'",
+   "description": "The strategy-absolute attribute.",
+   "fieldName": "positionStrategy"
+  },
   {
    "type": {
     "text": "boolean"
@@ -226,8 +363,8 @@ Code in this file were generated using following JSON:
   }
  ],
  "superclass": {
-  "name": "FastMenu",
-  "package": "@microsoft/fast-foundation"
+  "name": "VividElement",
+  "module": "/libs/components/src/shared/foundation/vivid-element/vivid-element"
  },
  "vividComponent": {
   "public": true,
@@ -243,7 +380,7 @@ registerMenu('vvd3')
 const VwcMenu = wrapper(`vvd3-menu`,  {
     events: [{"name":"close","propName":"onClose"},{"name":"open","propName":"onOpen"}],
     attributes: [],
-    properties: ['ariaLabel', 'placement', 'trigger', 'autoDismiss', 'open', '_onFocusout', 'actionItemsSlottedContent', 'handleFocusOut', 'domChildren']
+    properties: ['ariaLabel', 'placement', 'trigger', 'autoDismiss', 'positionStrategy', 'open', '_onFocusout', 'actionItemsSlottedContent']
 })
 
 VwcMenu.displayName = 'VwcMenu'

package/v3/VwcMenu/package.json

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

package/v3/VwcMenuItem/index.d.ts

@@ -1,13 +1,16 @@
 import React, { ReactNode, SyntheticEvent } from 'react';
 /** VwcMenuItem
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/menu-item
+* @param {boolean} disabled - The disabled state of the element. **attribute** `disabled`
+* @param {boolean} expanded - The expanded state of the element. **attribute** `expanded`
+* @param {MenuItemRole} role - The role of the element. **attribute** `role`
+* @param {boolean} checked - The checked value of the element. **attribute** `checked`
 * @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
-* @param  updateSubmenu
 * @param {string | undefined} icon
 */
 declare const VwcMenuItem: {
@@ -19,13 +22,16 @@ declare const VwcMenuItem: {
         ref?: React.RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
         onExpandedChange?: ((event: SyntheticEvent) => void) | undefined;
         onChange?: ((event: SyntheticEvent) => void) | undefined;
+        disabled?: boolean | undefined;
+        expanded?: boolean | undefined;
+        role?: any;
+        checked?: boolean | undefined;
         text?: string | undefined;
         textSecondary?: string | undefined;
         connotation?: any;
         checkTrailing?: boolean | undefined;
         checkedAppearance?: any;
         trailingMetaSlottedContent?: any;
-        updateSubmenu?: any;
         icon?: string | undefined;
     }): JSX.Element;
     displayName: string;

package/v3/VwcMenuItem/index.js

@@ -88,6 +88,55 @@ Code in this file were generated using following JSON:
   }
  ],
  "members": [
+  {
+   "kind": "field",
+   "name": "disabled",
+   "type": {
+    "text": "boolean"
+   },
+   "description": "The disabled state of the element.",
+   "privacy": "public"
+  },
+  {
+   "kind": "field",
+   "name": "expanded",
+   "type": {
+    "text": "boolean"
+   },
+   "description": "The expanded state of the element.",
+   "privacy": "public"
+  },
+  {
+   "kind": "field",
+   "name": "role",
+   "type": {
+    "text": "MenuItemRole"
+   },
+   "description": "The role of the element.",
+   "privacy": "public"
+  },
+  {
+   "kind": "field",
+   "name": "checked",
+   "type": {
+    "text": "boolean"
+   },
+   "description": "The checked value of the element.",
+   "privacy": "public"
+  },
+  {
+   "kind": "field",
+   "name": "observer",
+   "type": {
+    "text": "MutationObserver | undefined"
+   },
+   "privacy": "private"
+  },
+  {
+   "kind": "field",
+   "name": "invoke",
+   "privacy": "private"
+  },
   {
    "kind": "field",
    "name": "text",
@@ -152,7 +201,8 @@ Code in this file were generated using following JSON:
   },
   {
    "kind": "method",
-   "name": "#updateSubmenu"
+   "name": "updateSubmenu",
+   "privacy": "private"
   },
   {
    "kind": "method",
@@ -164,7 +214,13 @@ Code in this file were generated using following JSON:
   },
   {
    "kind": "field",
-   "name": "updateSubmenu"
+   "name": "#syntheticClickEvents",
+   "privacy": "private",
+   "default": "new WeakSet<Event>()"
+  },
+  {
+   "kind": "method",
+   "name": "#emitSyntheticClick"
   }
  ],
  "events": [
@@ -184,6 +240,35 @@ Code in this file were generated using following JSON:
   }
  ],
  "attributes": [
+  {
+   "type": {
+    "text": "boolean"
+   },
+   "description": "The disabled state of the element.",
+   "fieldName": "disabled"
+  },
+  {
+   "type": {
+    "text": "boolean"
+   },
+   "description": "The expanded state of the element.",
+   "fieldName": "expanded"
+  },
+  {
+   "name": "role",
+   "type": {
+    "text": "MenuItemRole"
+   },
+   "description": "The role of the element.",
+   "fieldName": "role"
+  },
+  {
+   "type": {
+    "text": "boolean"
+   },
+   "description": "The checked value of the element.",
+   "fieldName": "checked"
+  },
   {
    "name": "text",
    "type": {
@@ -227,8 +312,8 @@ Code in this file were generated using following JSON:
   }
  ],
  "superclass": {
-  "name": "FastMenuItem",
-  "package": "@microsoft/fast-foundation"
+  "name": "VividElement",
+  "module": "/libs/components/src/shared/foundation/vivid-element/vivid-element"
  },
  "vividComponent": {
   "public": true,
@@ -237,7 +322,9 @@ Code in this file were generated using following JSON:
    {
     "name": "modelValue",
     "attributeName": "checked",
-    "eventName": "change",
+    "eventNames": [
+     "change"
+    ],
     "valueMapping": "(event.target as HTMLInputElement).checked"
    }
   ]
@@ -252,7 +339,7 @@ registerMenuItem('vvd3')
 const VwcMenuItem = wrapper(`vvd3-menu-item`,  {
     events: [{"name":"change","propName":"onChange"},{"name":"expanded-change","propName":"onExpandedChange"}],
     attributes: [],
-    properties: ['text', 'textSecondary', 'connotation', 'checkTrailing', 'checkedAppearance', 'trailingMetaSlottedContent', 'updateSubmenu', 'icon']
+    properties: ['disabled', 'expanded', 'role', 'checked', 'text', 'textSecondary', 'connotation', 'checkTrailing', 'checkedAppearance', 'trailingMetaSlottedContent', 'icon']
 })
 
 VwcMenuItem.displayName = 'VwcMenuItem'

package/v3/VwcMenuItem/package.json

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

package/v3/VwcNav/index.js

@@ -14,8 +14,8 @@ Code in this file were generated using following JSON:
   }
  ],
  "superclass": {
-  "name": "FoundationElement",
-  "package": "@microsoft/fast-foundation"
+  "name": "VividElement",
+  "module": "/libs/components/src/shared/foundation/vivid-element/vivid-element"
  },
  "vividComponent": {
   "public": true,

package/v3/VwcNav/package.json

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

package/v3/VwcNavDisclosure/index.js

@@ -205,8 +205,8 @@ Code in this file were generated using following JSON:
   }
  ],
  "superclass": {
-  "name": "FoundationElement",
-  "package": "@microsoft/fast-foundation"
+  "name": "VividElement",
+  "module": "/libs/components/src/shared/foundation/vivid-element/vivid-element"
  },
  "vividComponent": {
   "public": true,

package/v3/VwcNavDisclosure/package.json

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

package/v3/VwcNavItem/package.json

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

package/v3/VwcNote/index.js

@@ -127,8 +127,8 @@ Code in this file were generated using following JSON:
   }
  ],
  "superclass": {
-  "name": "FoundationElement",
-  "package": "@microsoft/fast-foundation"
+  "name": "VividElement",
+  "module": "/libs/components/src/shared/foundation/vivid-element/vivid-element"
  },
  "vividComponent": {
   "public": true,

package/v3/VwcNote/package.json

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

package/v3/VwcNumberField/index.d.ts

@@ -8,6 +8,7 @@ import React, { ReactNode, SyntheticEvent } from 'react';
 * @param {number} maxlength - The maximum number of characters a user can enter. **attribute** `maxlength`
 * @param {number} minlength - The minimum number of characters a user can enter. **attribute** `minlength`
 * @param {number} size - Sets the width of the element to a specified number of characters. **attribute** `size`
+* @param {NumberFieldSize | undefined} scale - The size the number-field should have. **attribute** `scale`
 * @param {number} step - Amount to increment or decrement the value by **attribute** `step`
 * @param {number} max - The maximum the value can be **attribute** `max`
 * @param {number} min - The minimum the value can be **attribute** `min`
@@ -37,6 +38,7 @@ declare const VwcNumberField: {
         maxlength?: number | undefined;
         minlength?: number | undefined;
         size?: number | undefined;
+        scale?: any;
         step?: number | undefined;
         max?: number | undefined;
         min?: number | undefined;

package/v3/VwcNumberField/index.js

@@ -113,6 +113,15 @@ Code in this file were generated using following JSON:
    "description": "Sets the width of the element to a specified number of characters.",
    "privacy": "public"
   },
+  {
+   "kind": "field",
+   "name": "scale",
+   "type": {
+    "text": "NumberFieldSize | undefined"
+   },
+   "description": "The size the number-field should have.",
+   "privacy": "public"
+  },
   {
    "kind": "field",
    "name": "step",
@@ -359,6 +368,14 @@ Code in this file were generated using following JSON:
    "description": "Sets the width of the element to a specified number of characters.",
    "fieldName": "size"
   },
+  {
+   "name": "scale",
+   "type": {
+    "text": "NumberFieldSize | undefined"
+   },
+   "description": "The size the number-field should have.",
+   "fieldName": "scale"
+  },
   {
    "type": {
     "text": "number"
@@ -430,7 +447,9 @@ Code in this file were generated using following JSON:
    {
     "name": "modelValue",
     "attributeName": "value",
-    "eventName": "input",
+    "eventNames": [
+     "input"
+    ],
     "valueMapping": "(event.target as HTMLInputElement).value"
    }
   ]
@@ -445,7 +464,7 @@ registerNumberField('vvd3')
 const VwcNumberField = wrapper(`vvd3-number-field`,  {
     events: [{"name":"input","propName":"onInput"},{"name":"change","propName":"onChange"}],
     attributes: [],
-    properties: ['readOnly', 'autofocus', 'placeholder', 'list', 'maxlength', 'minlength', 'size', 'step', 'max', 'min', 'valueAsNumber', 'incrementButtonAriaLabel', 'decrementButtonAriaLabel', 'appearance', 'shape', 'autoComplete', 'proxy']
+    properties: ['readOnly', 'autofocus', 'placeholder', 'list', 'maxlength', 'minlength', 'size', 'scale', 'step', 'max', 'min', 'valueAsNumber', 'incrementButtonAriaLabel', 'decrementButtonAriaLabel', 'appearance', 'shape', 'autoComplete', 'proxy']
 })
 
 VwcNumberField.displayName = 'VwcNumberField'

package/v3/VwcNumberField/package.json

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

package/v3/VwcOption/index.d.ts

@@ -1,10 +1,21 @@
 import React, { ReactNode } from 'react';
-/** VwcOption
+/** An Option Custom HTML Element.
+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 {string | undefined} _text  **attribute** `text`
-* @param  text
+* @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.
+* @param {boolean} defaultSelected - The defaultSelected state of the option.
+* @param {boolean} disabled - The disabled state of the option. **attribute** `disabled`
+* @param {boolean} selectedAttribute - The selected attribute value. This sets the initial selected value. **attribute** `selected`
+* @param {boolean} selected - The checked state of the control.
+* @param {boolean} dirtyValue - Track whether the value has been changed from the initial value
 * @param {string | undefined} _label  **attribute** `label`
 * @param {string} label
+* @param {string | undefined} _text  **attribute** `text`
+* @param  text
+* @param {string} value
+* @param  proxy
 */
 declare const VwcOption: {
     (props: {
@@ -13,10 +24,18 @@ declare const VwcOption: {
         id?: string | undefined;
         style?: React.CSSProperties | undefined;
         ref?: React.RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-        _text?: string | undefined;
-        text?: any;
+        checked?: any;
+        defaultSelected?: boolean | undefined;
+        disabled?: boolean | undefined;
+        selectedAttribute?: boolean | undefined;
+        selected?: boolean | undefined;
+        dirtyValue?: boolean | undefined;
         _label?: string | undefined;
         label?: string | undefined;
+        _text?: string | undefined;
+        text?: any;
+        value?: string | undefined;
+        proxy?: any;
     }): JSX.Element;
     displayName: string;
 };