@vonage/vivid-react 2.10.76 → 2.10.78

package/v3/VwcSelectableBox/index.js

@@ -16,6 +16,14 @@ Code in this file were generated using following JSON:
    "name": "--vvd-selectable-box-cta-pale",
    "default": "var(--vvd-color-cta-300)"
   },
+  {
+   "name": "--vvd-selectable-box-cta-fierce",
+   "default": "var(--vvd-color-cta-700)"
+  },
+  {
+   "name": "--vvd-selectable-box-cta-faint",
+   "default": "var(--vvd-color-cta-50)"
+  },
   {
    "name": "--vvd-selectable-box-cta-soft",
    "default": "var(--vvd-color-cta-100)"
@@ -28,6 +36,14 @@ Code in this file were generated using following JSON:
    "name": "--vvd-selectable-box-accent-pale",
    "default": "var(--vvd-color-neutral-300)"
   },
+  {
+   "name": "--vvd-selectable-box-accent-fierce",
+   "default": "var(--vvd-color-neutral-700)"
+  },
+  {
+   "name": "--vvd-selectable-box-accent-faint",
+   "default": "var(--vvd-color-neutral-50)"
+  },
   {
    "name": "--vvd-selectable-box-accent-soft",
    "default": "var(--vvd-color-neutral-100)"
@@ -42,51 +58,49 @@ Code in this file were generated using following JSON:
  "members": [
   {
    "kind": "field",
-   "name": "checked",
+   "name": "ariaLabel",
    "type": {
-    "text": "boolean"
+    "text": "string | null"
    },
-   "default": "false",
-   "description": "Controls the checked state of the box",
-   "privacy": "public"
+   "default": "null"
   },
   {
    "kind": "field",
-   "name": "clickable",
+   "name": "checked",
    "type": {
     "text": "boolean"
    },
    "default": "false",
-   "description": "Makes the whole selectable box clickable",
+   "description": "Controls the checked state of the box",
    "privacy": "public"
   },
   {
    "kind": "field",
-   "name": "connotation",
+   "name": "clickable",
    "type": {
-    "text": "SelectableBoxConnotation | undefined"
+    "text": "boolean"
    },
-   "description": "The connotation the selectable box should have.",
+   "default": "false",
+   "description": "DEPRECATED: Replaced by the clickable-box prop",
    "privacy": "public"
   },
   {
    "kind": "field",
-   "name": "controlAriaLabel",
+   "name": "clickableBox",
    "type": {
-    "text": "string | null"
+    "text": "boolean"
    },
-   "default": "null",
-   "description": "Adds an accessible label to selectable box",
+   "default": "false",
+   "description": "Makes the entire selectable box clickable",
    "privacy": "public"
   },
   {
    "kind": "field",
-   "name": "controlAriaLabelledby",
+   "name": "connotation",
    "type": {
-    "text": "string | null"
+    "text": "SelectableBoxConnotation | undefined"
    },
-   "default": "null",
-   "description": "Links a piece of content as an accessible label",
+   "description": "The connotation the selectable box should have.",
    "privacy": "public"
   },
   {
@@ -116,6 +130,14 @@ Code in this file were generated using following JSON:
   }
  ],
  "attributes": [
+  {
+   "name": "aria-label",
+   "type": {
+    "text": "string | null"
+   },
+   "default": "null",
+   "fieldName": "ariaLabel"
+  },
   {
    "type": {
     "text": "boolean"
@@ -129,34 +151,25 @@ Code in this file were generated using following JSON:
     "text": "boolean"
    },
    "default": "false",
-   "description": "Makes the whole selectable box clickable",
+   "description": "DEPRECATED: Replaced by the clickable-box prop",
    "fieldName": "clickable"
   },
   {
-   "name": "connotation",
-   "type": {
-    "text": "SelectableBoxConnotation | undefined"
-   },
-   "description": "The connotation the selectable box should have.",
-   "fieldName": "connotation"
-  },
-  {
-   "name": "control-aria-label",
+   "name": "clickable-box",
    "type": {
-    "text": "string | null"
+    "text": "boolean"
    },
-   "default": "null",
-   "description": "Adds an accessible label to selectable box",
-   "fieldName": "controlAriaLabel"
+   "default": "false",
+   "description": "Makes the entire selectable box clickable",
+   "fieldName": "clickableBox"
   },
   {
-   "name": "control-aria-labelledby",
+   "name": "connotation",
    "type": {
-    "text": "string | null"
+    "text": "SelectableBoxConnotation | undefined"
    },
-   "default": "null",
-   "description": "Links a piece of content as an accessible label",
-   "fieldName": "controlAriaLabelledby"
+   "description": "The connotation the selectable box should have.",
+   "fieldName": "connotation"
   },
   {
    "name": "control-type",
@@ -189,7 +202,7 @@ registerSelectableBox('vvd3')
 const VwcSelectableBox = wrapper(`vvd3-selectable-box`,  {
     events: [{"name":"change","propName":"onChange"}],
     attributes: [],
-    properties: ['checked', 'clickable', 'connotation', 'controlAriaLabel', 'controlAriaLabelledby', 'controlType', 'tight']
+    properties: ['ariaLabel', 'checked', 'clickable', 'clickableBox', 'connotation', 'controlType', 'tight']
 })
 
 VwcSelectableBox.displayName = 'VwcSelectableBox'

package/v3/VwcSelectableBox/package.json

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

package/v3/VwcSideDrawer/package.json

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

package/v3/VwcSlider/package.json

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

package/v3/VwcSplitButton/index.d.ts

@@ -13,6 +13,9 @@ import React, { ReactNode, SyntheticEvent } from 'react';
 * @param {boolean} disabled - Indicates if the button is disabled. **attribute** `disabled`
 * @param {string | null} ariaLabel  **attribute** `aria-label`
 * @param {string | null} ariaExpanded  **attribute** `aria-expanded`
+* @param {string | null} indicatorAriaLabel - Defines a string value that labels the indicator element.
+
+https://www.w3.org/TR/wai-aria-1.1/#aria-label **attribute** `indicator-aria-label`
 */
 declare const VwcSplitButton: {
     (props: {
@@ -21,6 +24,8 @@ declare const VwcSplitButton: {
         id?: string | undefined;
         style?: React.CSSProperties | undefined;
         ref?: React.RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
+        onActionClick?: ((event: SyntheticEvent) => void) | undefined;
+        onIndicatorClick?: ((event: SyntheticEvent) => void) | undefined;
         onClick?: ((event: SyntheticEvent) => void) | undefined;
         _action?: any;
         _indicator?: any;
@@ -34,6 +39,7 @@ declare const VwcSplitButton: {
         disabled?: boolean | undefined;
         ariaLabel?: string | null | undefined;
         ariaExpanded?: string | null | undefined;
+        indicatorAriaLabel?: string | null | undefined;
     }): JSX.Element;
     displayName: string;
 };

package/v3/VwcSplitButton/index.js

@@ -40,6 +40,70 @@ Code in this file were generated using following JSON:
    "name": "--vvd-split-button-cta-faint",
    "default": "var(--vvd-color-cta-50)"
   },
+  {
+   "name": "--vvd-split-button-success-primary",
+   "default": "var(--vvd-color-success-500)"
+  },
+  {
+   "name": "--vvd-split-button-success-primary-text",
+   "default": "var(--vvd-color-canvas)"
+  },
+  {
+   "name": "--vvd-split-button-success-primary-increment",
+   "default": "var(--vvd-color-success-600)"
+  },
+  {
+   "name": "--vvd-split-button-success-contrast",
+   "default": "var(--vvd-color-success-800)"
+  },
+  {
+   "name": "--vvd-split-button-success-fierce",
+   "default": "var(--vvd-color-success-700)"
+  },
+  {
+   "name": "--vvd-split-button-success-firm",
+   "default": "var(--vvd-color-success-600)"
+  },
+  {
+   "name": "--vvd-split-button-success-soft",
+   "default": "var(--vvd-color-success-100)"
+  },
+  {
+   "name": "--vvd-split-button-success-faint",
+   "default": "var(--vvd-color-success-50)"
+  },
+  {
+   "name": "--vvd-split-button-alert-primary",
+   "default": "var(--vvd-color-alert-500)"
+  },
+  {
+   "name": "--vvd-split-button-alert-primary-text",
+   "default": "var(--vvd-color-canvas)"
+  },
+  {
+   "name": "--vvd-split-button-alert-primary-increment",
+   "default": "var(--vvd-color-alert-600)"
+  },
+  {
+   "name": "--vvd-split-button-alert-contrast",
+   "default": "var(--vvd-color-alert-800)"
+  },
+  {
+   "name": "--vvd-split-button-alert-fierce",
+   "default": "var(--vvd-color-alert-700)"
+  },
+  {
+   "name": "--vvd-split-button-alert-firm",
+   "default": "var(--vvd-color-alert-600)"
+  },
+  {
+   "name": "--vvd-split-button-alert-soft",
+   "default": "var(--vvd-color-alert-100)"
+  },
+  {
+   "name": "--vvd-split-button-alert-faint",
+   "default": "var(--vvd-color-alert-50)"
+  },
   {
    "name": "--vvd-split-button-accent-primary",
    "default": "var(--vvd-color-canvas-text)"
@@ -203,6 +267,26 @@ Code in this file were generated using following JSON:
     "text": "string | null"
    },
    "default": "null"
+  },
+  {
+   "kind": "field",
+   "name": "indicatorAriaLabel",
+   "type": {
+    "text": "string | null"
+   },
+   "default": "null",
+   "description": "Defines a string value that labels the indicator element.\n\nhttps://www.w3.org/TR/wai-aria-1.1/#aria-label",
+   "privacy": "public"
+  }
+ ],
+ "events": [
+  {
+   "description": "Event emitted when the action button is clicked",
+   "name": "action-click"
+  },
+  {
+   "description": "Event emitted when the indicator button is clicked",
+   "name": "indicator-click"
   }
  ],
  "attributes": [
@@ -287,6 +371,15 @@ Code in this file were generated using following JSON:
    },
    "default": "null",
    "fieldName": "ariaExpanded"
+  },
+  {
+   "name": "indicator-aria-label",
+   "type": {
+    "text": "string | null"
+   },
+   "default": "null",
+   "description": "Defines a string value that labels the indicator element.\n\nhttps://www.w3.org/TR/wai-aria-1.1/#aria-label",
+   "fieldName": "indicatorAriaLabel"
   }
  ],
  "superclass": {
@@ -301,9 +394,9 @@ import { registerSplitButton } from '@vonage/vivid'
 registerSplitButton('vvd3')
 
 const VwcSplitButton = wrapper(`vvd3-split-button`,  {
-    events: [{"name":"click","propName":"onClick"}],
+    events: [{"name":"click","propName":"onClick"},{"name":"indicator-click","propName":"onIndicatorClick"},{"name":"action-click","propName":"onActionClick"}],
     attributes: [],
-    properties: ['_action', '_indicator', 'connotation', 'shape', 'appearance', 'size', 'label', 'icon', 'splitIndicator', 'disabled', 'ariaLabel', 'ariaExpanded']
+    properties: ['_action', '_indicator', 'connotation', 'shape', 'appearance', 'size', 'label', 'icon', 'splitIndicator', 'disabled', 'ariaLabel', 'ariaExpanded', 'indicatorAriaLabel']
 })
 
 VwcSplitButton.displayName = 'VwcSplitButton'

package/v3/VwcSplitButton/package.json

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

package/v3/VwcSwitch/package.json

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

package/v3/VwcTab/package.json

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

package/v3/VwcTabPanel/package.json

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

package/v3/VwcTabs/index.d.ts

@@ -3,6 +3,7 @@ import React, { ReactNode, SyntheticEvent } from 'react';
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/tabs
 * @param {HTMLElement | undefined} tablist
 * @param {TabsConnotation | undefined} connotation - The connotation the tabs should have. **attribute** `connotation`
+* @param {Gutters | undefined} gutters - sets the initial preferred margin from predefined available options **attribute** `gutters`
 */
 declare const VwcTabs: {
     (props: {
@@ -14,6 +15,7 @@ declare const VwcTabs: {
         onChange?: ((event: SyntheticEvent) => void) | undefined;
         tablist?: any;
         connotation?: any;
+        gutters?: any;
     }): JSX.Element;
     displayName: string;
 };

package/v3/VwcTabs/index.js

@@ -40,6 +40,15 @@ Code in this file were generated using following JSON:
    "description": "The connotation the tabs should have.",
    "privacy": "public"
   },
+  {
+   "kind": "field",
+   "name": "gutters",
+   "type": {
+    "text": "Gutters | undefined"
+   },
+   "description": "sets the initial preferred margin from predefined available options",
+   "privacy": "public"
+  },
   {
    "kind": "method",
    "name": "connotationChanged"
@@ -133,6 +142,14 @@ Code in this file were generated using following JSON:
    },
    "description": "The connotation the tabs should have.",
    "fieldName": "connotation"
+  },
+  {
+   "name": "gutters",
+   "type": {
+    "text": "Gutters | undefined"
+   },
+   "description": "sets the initial preferred margin from predefined available options",
+   "fieldName": "gutters"
   }
  ],
  "superclass": {
@@ -149,7 +166,7 @@ registerTabs('vvd3')
 const VwcTabs = wrapper(`vvd3-tabs`,  {
     events: [{"name":"change","propName":"onChange"}],
     attributes: [],
-    properties: ['tablist', 'connotation']
+    properties: ['tablist', 'connotation', 'gutters']
 })
 
 VwcTabs.displayName = 'VwcTabs'

package/v3/VwcTabs/package.json

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

package/v3/VwcTag/package.json

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

package/v3/VwcTagGroup/package.json

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

package/v3/VwcTextAnchor/package.json

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

package/v3/VwcTextArea/index.js

@@ -111,7 +111,7 @@ Code in this file were generated using following JSON:
   }
  ],
  "superclass": {
-  "name": "FoundationElement",
+  "name": "FoundationTextArea",
   "package": "@microsoft/fast-foundation"
  }
 }

package/v3/VwcTextArea/package.json

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

package/v3/VwcTextField/package.json

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

package/v3/VwcToggletip/index.d.ts

@@ -4,7 +4,6 @@ import React, { ReactNode } from 'react';
 * @param {string | undefined} headline - the optional title of the toggletip **attribute** `headline`
 * @param {boolean} alternate - toggle color scheme **attribute** `alternate`
 * @param {Placement | undefined} placement - placement of the toggletip **attribute** `placement`
-* @param {AnchorType} anchor - id or direct reference to the toggletip's anchor element **attribute** `anchor`
 * @param {boolean} open - indicates whether the toggletip is open **attribute** `open`
 */
 declare const VwcToggletip: {
@@ -17,7 +16,6 @@ declare const VwcToggletip: {
         headline?: string | undefined;
         alternate?: boolean | undefined;
         placement?: any;
-        anchor?: any;
         open?: boolean | undefined;
     }): JSX.Element;
     displayName: string;