@vonage/vivid-react 4.0.0 → 5.20.0

package/v3/VwcCalendar/index.d.ts

@@ -1,22 +1,11 @@
 import React, { ReactNode } from 'react';
 /** VwcCalendar
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/calendar
-* @param {Date | string | undefined} datetime - The date within a week of choice.
-Accepts any parameter acceptable by the `Date()` constructor. **attribute** `datetime`
-* @param {'sunday' | 'monday' | undefined} startDay - The day to show as the first within a work week.
-Accepts either Sunday or Monday
-Calendar will - programmatically - default to Monday if not specified
-
-(only applicable for views of more than a single day) **attribute** `start-day`
-* @param {string | string[] | undefined | undefined} locales - A locale string or array of locale strings that contain one or more language or locale tags.
-If you include more than one locale string,
-list them in descending order of priority so that the first entry is the preferred locale.
-If you omit this parameter, the default locale of the JavaScript runtime is used.
-This parameter must conform to BCP 47 standards; see the Intl.Collator object for details.
-e.g. en-US | en-US, he-IL **attribute** `locales`
-* @param {boolean} hour12 - The convention of displayed time in which the day runs from midnight to midnight and is divided into 24 or 12 hours.
-Unless provided, choice will be set according to local time preference (e.g. US = 12, IL = 24) **attribute** `hour12`
-* @param {CalendarSticky} stickyMode - Sticky header and sticky column options **attribute** `sticky-mode`
+* @param {Date | string | undefined} datetime - Sets the week to display **attribute** `datetime`
+* @param {'sunday' | 'monday' | undefined} startDay - Sets the first day of the week to display **attribute** `start-day`
+* @param {string | string[] | undefined | undefined} locales - Sets the locale to be displayed **attribute** `locales`
+* @param {boolean} hour12 - Displays a time in 12 hour format **attribute** `hour12`
+* @param {CalendarSticky} stickyMode - Set the `sticky-mode` attribute **attribute** `sticky-mode`
 * @param  getEventContext - Fire an event
 * @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`.
@@ -25,18 +14,18 @@ It can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.
 declare const VwcCalendar: {
     (props: {
         children?: ReactNode;
-        slot?: string | undefined;
-        id?: string | undefined;
-        style?: React.CSSProperties | undefined;
-        ref?: React.RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-        datetime?: any;
-        startDay?: any;
-        locales?: any;
-        hour12?: boolean | undefined;
-        stickyMode?: any;
-        getEventContext?: any;
-        VIVID_VERSION?: string | undefined;
-        componentName?: string | undefined;
+        slot?: string;
+        id?: string;
+        style?: React.CSSProperties;
+        ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+        "datetime"?: any;
+        "startDay"?: "sunday" | "monday" | undefined;
+        "locales"?: any;
+        "hour12"?: boolean;
+        "stickyMode"?: any;
+        "getEventContext"?: any;
+        "VIVID_VERSION"?: string;
+        "componentName"?: string;
     }): JSX.Element;
     displayName: string;
 };

package/v3/VwcCalendar/index.js

@@ -48,7 +48,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "Date | string | undefined"
    },
-   "description": "The date within a week of choice.\nAccepts any parameter acceptable by the `Date()` constructor.",
+   "description": "Sets the week to display",
    "privacy": "public"
   },
   {
@@ -57,7 +57,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "'sunday' | 'monday' | undefined"
    },
-   "description": "The day to show as the first within a work week.\nAccepts either Sunday or Monday\nCalendar will - programmatically - default to Monday if not specified\n\n(only applicable for views of more than a single day)",
+   "description": "Sets the first day of the week to display",
    "privacy": "public"
   },
   {
@@ -66,7 +66,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string | string[] | undefined | undefined"
    },
-   "description": "A locale string or array of locale strings that contain one or more language or locale tags.\nIf you include more than one locale string,\nlist them in descending order of priority so that the first entry is the preferred locale.\nIf you omit this parameter, the default locale of the JavaScript runtime is used.\nThis parameter must conform to BCP 47 standards; see the Intl.Collator object for details.\ne.g. en-US | en-US, he-IL",
+   "description": "Sets the locale to be displayed",
    "privacy": "public"
   },
   {
@@ -76,7 +76,7 @@ Code in this file were generated using following JSON:
     "text": "boolean"
    },
    "default": "false",
-   "description": "The convention of displayed time in which the day runs from midnight to midnight and is divided into 24 or 12 hours.\nUnless provided, choice will be set according to local time preference (e.g. US = 12, IL = 24)",
+   "description": "Displays a time in 12 hour format",
    "privacy": "public"
   },
   {
@@ -85,7 +85,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "CalendarSticky"
    },
-   "description": "Sticky header and sticky column options",
+   "description": "Set the `sticky-mode` attribute",
    "privacy": "public"
   },
   {
@@ -153,18 +153,6 @@ Code in this file were generated using following JSON:
     }
    ]
   },
-  {
-   "kind": "method",
-   "name": "onKeydown",
-   "parameters": [
-    {
-     "name": "{ key }",
-     "type": {
-      "text": "KeyboardEvent"
-     }
-    }
-   ]
-  },
   {
    "kind": "method",
    "name": "initializeScrollPosition",
@@ -204,7 +192,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "Date | string | undefined"
    },
-   "description": "The date within a week of choice.\nAccepts any parameter acceptable by the `Date()` constructor.",
+   "description": "Sets the week to display",
    "fieldName": "datetime"
   },
   {
@@ -212,7 +200,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "'sunday' | 'monday' | undefined"
    },
-   "description": "The day to show as the first within a work week.\nAccepts either Sunday or Monday\nCalendar will - programmatically - default to Monday if not specified\n\n(only applicable for views of more than a single day)",
+   "description": "Sets the first day of the week to display",
    "fieldName": "startDay"
   },
   {
@@ -220,7 +208,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string | string[] | undefined | undefined"
    },
-   "description": "A locale string or array of locale strings that contain one or more language or locale tags.\nIf you include more than one locale string,\nlist them in descending order of priority so that the first entry is the preferred locale.\nIf you omit this parameter, the default locale of the JavaScript runtime is used.\nThis parameter must conform to BCP 47 standards; see the Intl.Collator object for details.\ne.g. en-US | en-US, he-IL",
+   "description": "Sets the locale to be displayed",
    "fieldName": "locales"
   },
   {
@@ -229,7 +217,7 @@ Code in this file were generated using following JSON:
     "text": "boolean"
    },
    "default": "false",
-   "description": "The convention of displayed time in which the day runs from midnight to midnight and is divided into 24 or 12 hours.\nUnless provided, choice will be set according to local time preference (e.g. US = 12, IL = 24)",
+   "description": "Displays a time in 12 hour format",
    "fieldName": "hour12"
   },
   {
@@ -237,7 +225,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "CalendarSticky"
    },
-   "description": "Sticky header and sticky column options",
+   "description": "Set the `sticky-mode` attribute",
    "fieldName": "stickyMode"
   }
  ],
@@ -251,7 +239,7 @@ Code in this file were generated using following JSON:
  }
 }
 */
-import wrapper from '@vonage/vivid-react-wrapper'
+import wrapper from '@repo/react-component-wrapper'
 import { registerCalendar } from '@vonage/vivid'
 
 registerCalendar('vvd3')

package/v3/VwcCalendar/package.json

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

package/v3/VwcCalendarEvent/index.d.ts

@@ -1,14 +1,13 @@
 import React, { ReactNode } from 'react';
 /** VwcCalendarEvent
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/calendar-event
-* @param {string | undefined} heading - the heading of the event **attribute** `heading`
-* @param {string | undefined} description - the description of the event **attribute** `description`
-* @param {CalendarEventConnotation | undefined} connotation - The connotation the calendar event should have. **attribute** `connotation`
-* @param {CalendarEventAppearance | undefined} appearance - The appearance the calendar event should have. **attribute** `appearance`
-* @param {number | undefined} overlapCount - sets card display precendence and indentation **attribute** `overlap-count`
-* @param {number | undefined} start - time of day event starts **attribute** `start`
-* @param {number | undefined} duration - event's time duration in hours **attribute** `duration`
-* @param {'delegate'} _vividAriaBehaviour
+* @param {string | undefined} heading - Sets the event heading **attribute** `heading`
+* @param {string | undefined} description - Sets the event description **attribute** `description`
+* @param {CalendarEventConnotation | undefined} connotation - Sets the first day of the week to display **attribute** `connotation`
+* @param {CalendarEventAppearance | undefined} appearance - Sets the event's appearance **attribute** `appearance`
+* @param {number | undefined} overlapCount - Sets the stacking context of the event when it overlaps with another **attribute** `overlap-count`
+* @param {number | undefined} start - Sets the event start time (e.g. `14` = 2pm) **attribute** `start`
+* @param {number | undefined} duration - Sets the event duration (e.g. `2` = 2 hours) **attribute** `duration`
 * @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
@@ -16,20 +15,19 @@ It can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.
 declare const VwcCalendarEvent: {
     (props: {
         children?: ReactNode;
-        slot?: string | undefined;
-        id?: string | undefined;
-        style?: React.CSSProperties | undefined;
-        ref?: React.RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-        heading?: string | undefined;
-        description?: string | undefined;
-        connotation?: any;
-        appearance?: any;
-        overlapCount?: any;
-        start?: any;
-        duration?: any;
-        _vividAriaBehaviour?: any;
-        VIVID_VERSION?: string | undefined;
-        componentName?: string | undefined;
+        slot?: string;
+        id?: string;
+        style?: React.CSSProperties;
+        ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+        "heading"?: string | undefined;
+        "description"?: string | undefined;
+        "connotation"?: any;
+        "appearance"?: any;
+        "overlapCount"?: number | undefined;
+        "start"?: number | undefined;
+        "duration"?: number | undefined;
+        "VIVID_VERSION"?: string;
+        "componentName"?: string;
     }): JSX.Element;
     displayName: string;
 };

package/v3/VwcCalendarEvent/index.js

@@ -128,7 +128,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string | undefined"
    },
-   "description": "the heading of the event",
+   "description": "Sets the event heading",
    "privacy": "public"
   },
   {
@@ -137,7 +137,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string | undefined"
    },
-   "description": "the description of the event",
+   "description": "Sets the event description",
    "privacy": "public"
   },
   {
@@ -146,7 +146,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "CalendarEventConnotation | undefined"
    },
-   "description": "The connotation the calendar event should have.",
+   "description": "Sets the first day of the week to display",
    "privacy": "public"
   },
   {
@@ -155,7 +155,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "CalendarEventAppearance | undefined"
    },
-   "description": "The appearance the calendar event should have.",
+   "description": "Sets the event's appearance",
    "privacy": "public"
   },
   {
@@ -164,7 +164,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "number | undefined"
    },
-   "description": "sets card display precendence and indentation",
+   "description": "Sets the stacking context of the event when it overlaps with another",
    "privacy": "public"
   },
   {
@@ -173,7 +173,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "number | undefined"
    },
-   "description": "time of day event starts",
+   "description": "Sets the event start time (e.g. `14` = 2pm)",
    "privacy": "public"
   },
   {
@@ -182,21 +182,9 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "number | undefined"
    },
-   "description": "event's time duration in hours",
+   "description": "Sets the event duration (e.g. `2` = 2 hours)",
    "privacy": "public"
   },
-  {
-   "kind": "field",
-   "name": "_vividAriaBehaviour",
-   "default": "'delegate'",
-   "type": {
-    "text": "'delegate'"
-   },
-   "inheritedFrom": {
-    "name": "DelegatesAria",
-    "module": "src/shared/aria/delegates-aria.ts"
-   }
-  },
   {
    "kind": "field",
    "name": "VIVID_VERSION",
@@ -231,7 +219,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string | undefined"
    },
-   "description": "the heading of the event",
+   "description": "Sets the event heading",
    "fieldName": "heading"
   },
   {
@@ -239,7 +227,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string | undefined"
    },
-   "description": "the description of the event",
+   "description": "Sets the event description",
    "fieldName": "description"
   },
   {
@@ -247,7 +235,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "CalendarEventConnotation | undefined"
    },
-   "description": "The connotation the calendar event should have.",
+   "description": "Sets the first day of the week to display",
    "fieldName": "connotation"
   },
   {
@@ -255,7 +243,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "CalendarEventAppearance | undefined"
    },
-   "description": "The appearance the calendar event should have.",
+   "description": "Sets the event's appearance",
    "fieldName": "appearance"
   },
   {
@@ -263,7 +251,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "number | undefined"
    },
-   "description": "sets card display precendence and indentation",
+   "description": "Sets the stacking context of the event when it overlaps with another",
    "fieldName": "overlapCount"
   },
   {
@@ -271,7 +259,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "number | undefined"
    },
-   "description": "time of day event starts",
+   "description": "Sets the event start time (e.g. `14` = 2pm)",
    "fieldName": "start"
   },
   {
@@ -279,7 +267,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "number | undefined"
    },
-   "description": "event's time duration in hours",
+   "description": "Sets the event duration (e.g. `2` = 2 hours)",
    "fieldName": "duration"
   }
  ],
@@ -299,7 +287,7 @@ Code in this file were generated using following JSON:
  }
 }
 */
-import wrapper from '@vonage/vivid-react-wrapper'
+import wrapper from '@repo/react-component-wrapper'
 import { registerCalendarEvent } from '@vonage/vivid'
 
 registerCalendarEvent('vvd3')
@@ -307,7 +295,7 @@ registerCalendarEvent('vvd3')
 const VwcCalendarEvent = wrapper(`vvd3-calendar-event`,  {
     events: [],
     attributes: [],
-    properties: ['heading', 'description', 'connotation', 'appearance', 'overlapCount', 'start', 'duration', '_vividAriaBehaviour', 'VIVID_VERSION', 'componentName']
+    properties: ['heading', 'description', 'connotation', 'appearance', 'overlapCount', 'start', 'duration', 'VIVID_VERSION', 'componentName']
 })
 
 VwcCalendarEvent.displayName = 'VwcCalendarEvent'

package/v3/VwcCalendarEvent/package.json

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

package/v3/VwcCard/index.d.ts

@@ -1,18 +1,13 @@
 import React, { ReactNode } from 'react';
 /** VwcCard
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/card
-* @param {CardAppearance | undefined} appearance - The appearance the card should have. **attribute** `appearance`
-* @param {string | undefined} headline - the text of the card heading
-accepts string **attribute** `headline`
-* @param {string | undefined} subtitle - the text of the card sub-heading
-accepts string **attribute** `subtitle`
-* @param {string | undefined} text - the text of the card sub-heading
-accepts string **attribute** `text`
-* @param {string | undefined} icon - card header icon **attribute** `icon`
-* @param {0 | 2 | 4 | 8 | 12 | 16 | 24 | undefined} elevation - card elevation dp **attribute** `elevation`
+* @param {CardAppearance | undefined} appearance - Sets the element's appearance. **attribute** `appearance`
+* @param {string | undefined} headline - Sets the element's headline. **attribute** `headline`
+* @param {string | undefined} subtitle - Sets the element's subtitle. **attribute** `subtitle`
+* @param {string | undefined} text - Sets the element's text. **attribute** `text`
+* @param {string | undefined} icon - Sets the element's icon. **attribute** `icon`
+* @param {0 | 2 | 4 | 8 | 12 | 16 | 24 | undefined} elevation - Sets the element's elevation. **attribute** `elevation`
 * @param {boolean} clickableCard - Indicates whether card should be a clickable <button> element. **attribute** `clickable-card`
-* @param {HTMLElement[] | undefined} graphicSlottedContent
-* @param {HTMLElement[] | undefined} hasMetaSlottedContent
 * @param {string | undefined} download - Prompts the user to save the linked URL. See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a | <a> element  for more information. **attribute** `download`
 * @param {string | undefined} href - The URL the hyperlink references. See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a | <a> element  for more information. **attribute** `href`
 * @param {string | undefined} hreflang - Hints at the language of the referenced resource. See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a | <a> element  for more information. **attribute** `hreflang`
@@ -22,7 +17,6 @@ accepts string **attribute** `text`
 * @param {'_self' | '_blank' | '_parent' | '_top' | undefined} target - See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a | <a> element  for more information. **attribute** `target`
 * @param {string | undefined} type - See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a | <a> element  for more information. **attribute** `type`
 * @param {HTMLAnchorElement} control - References the root element
-* @param {'delegate'} _vividAriaBehaviour
 * @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
@@ -30,31 +24,28 @@ It can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.
 declare const VwcCard: {
     (props: {
         children?: ReactNode;
-        slot?: string | undefined;
-        id?: string | undefined;
-        style?: React.CSSProperties | undefined;
-        ref?: React.RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-        appearance?: any;
-        headline?: string | undefined;
-        subtitle?: string | undefined;
-        text?: string | undefined;
-        icon?: string | undefined;
-        elevation?: any;
-        clickableCard?: boolean | undefined;
-        graphicSlottedContent?: any;
-        hasMetaSlottedContent?: any;
-        download?: string | undefined;
-        href?: string | undefined;
-        hreflang?: string | undefined;
-        ping?: string | undefined;
-        referrerpolicy?: string | undefined;
-        rel?: string | undefined;
-        target?: any;
-        type?: string | undefined;
-        control?: any;
-        _vividAriaBehaviour?: any;
-        VIVID_VERSION?: string | undefined;
-        componentName?: string | undefined;
+        slot?: string;
+        id?: string;
+        style?: React.CSSProperties;
+        ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+        "appearance"?: any;
+        "headline"?: string | undefined;
+        "subtitle"?: string | undefined;
+        "text"?: string | undefined;
+        "icon"?: string | undefined;
+        "elevation"?: any;
+        "clickableCard"?: boolean;
+        "download"?: string | undefined;
+        "href"?: string | undefined;
+        "hreflang"?: string | undefined;
+        "ping"?: string | undefined;
+        "referrerpolicy"?: string | undefined;
+        "rel"?: string | undefined;
+        "target"?: "_self" | "_blank" | "_parent" | "_top" | undefined;
+        "type"?: string | undefined;
+        "control"?: any;
+        "VIVID_VERSION"?: string;
+        "componentName"?: string;
     }): JSX.Element;
     displayName: string;
 };