@vonage/vivid-react 4.0.0 → 5.20.0

package/v3/VwcDateTimePicker/index.d.ts

@@ -1,18 +1,19 @@
 import React, { ReactNode, SyntheticEvent } from 'react';
 /** Single date picker component.
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/date-time-picker
-* @param {string} min - The earliest accepted date-time. **attribute** `min`
-* @param {string} minTime - The earliest accepted time part of the date-time. **attribute** `min-time`
-* @param {string} minDate - The earliest accepted date part of the date-time. **attribute** `min-date`
-* @param {string} max - The latest accepted date-time. **attribute** `max`
-* @param {string} maxTime - The latest accepted time part of the date-time. **attribute** `max-time`
-* @param {string} maxDate - The latest accepted time date of the date-time. **attribute** `max-date`
+* @param {string} min - Sets the minimum date and time that can be selected **attribute** `min`
+* @param {string} minTime - Sets the minimum time that can be selected **attribute** `min-time`
+* @param {string} minDate - Sets the minimum date that can be selected **attribute** `min-date`
+* @param {string} max - Sets the maximum date and time that can be selected **attribute** `max`
+* @param {string} maxTime - Sets the maximum time that can be selected **attribute** `max-time`
+* @param {string} maxDate - Sets the maximum date that can be selected **attribute** `max-date`
 * @param {string} type
 * @param {string} step
 * @param {number | null} minutesStep - Distance between presented minute options. **attribute** `minutes-step`
 * @param {number | null} secondsStep - Distance between presented seconds options. If null, seconds are not presented. **attribute** `seconds-step`
 * @param {'12h' | '24h' | undefined} clock - Forces a 12h or 24h clock to be used. **attribute** `clock`
 * @param {string} value - The current value of the element. **attribute** `current-value`
+* @param {TextFieldSize | undefined} scale - Sets the display size of the picker field input element. **attribute** `scale`
 * @param {boolean} readOnly - Whether the date-picker is readonly. **attribute** `readonly`
 * @param {string | undefined} helperText - Provides additional information to help the user enter the correct information.
 To add HTML to the helper text, use the helper-text slot instead. **attribute** `helper-text`
@@ -32,36 +33,37 @@ It can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.
 declare const VwcDateTimePicker: {
     (props: {
         children?: ReactNode;
-        slot?: string | undefined;
-        id?: string | undefined;
-        style?: React.CSSProperties | undefined;
-        ref?: React.RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-        onInput?: ((event: SyntheticEvent) => void) | undefined;
-        onChange?: ((event: SyntheticEvent) => void) | undefined;
-        min?: string | undefined;
-        minTime?: string | undefined;
-        minDate?: string | undefined;
-        max?: string | undefined;
-        maxTime?: string | undefined;
-        maxDate?: string | undefined;
-        type?: string | undefined;
-        step?: string | undefined;
-        minutesStep?: number | undefined;
-        secondsStep?: number | undefined;
-        clock?: any;
-        value?: string | undefined;
-        readOnly?: boolean | undefined;
-        helperText?: string | undefined;
-        errorText?: string | undefined;
-        validate?: any;
-        label?: string | undefined;
-        currentValue?: any;
-        initialValue?: string | undefined;
-        disabled?: boolean | undefined;
-        name?: string | undefined;
-        required?: boolean | undefined;
-        VIVID_VERSION?: string | undefined;
-        componentName?: string | undefined;
+        slot?: string;
+        id?: string;
+        style?: React.CSSProperties;
+        ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+        onInput?: (event: SyntheticEvent) => void;
+        onChange?: (event: SyntheticEvent) => void;
+        "min"?: string;
+        "minTime"?: string;
+        "minDate"?: string;
+        "max"?: string;
+        "maxTime"?: string;
+        "maxDate"?: string;
+        "type"?: string;
+        "step"?: string;
+        "minutesStep"?: number | null;
+        "secondsStep"?: number | null;
+        "clock"?: "12h" | "24h" | undefined;
+        "value"?: string;
+        "scale"?: any;
+        "readOnly"?: boolean;
+        "helperText"?: string | undefined;
+        "errorText"?: string | undefined;
+        "validate"?: any;
+        "label"?: string | undefined;
+        "currentValue"?: any;
+        "initialValue"?: string;
+        "disabled"?: boolean;
+        "name"?: string;
+        "required"?: boolean;
+        "VIVID_VERSION"?: string;
+        "componentName"?: string;
     }): JSX.Element;
     displayName: string;
 };

package/v3/VwcDateTimePicker/index.js

@@ -20,7 +20,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string"
    },
-   "description": "The earliest accepted date-time.",
+   "description": "Sets the minimum date and time that can be selected",
    "privacy": "public",
    "default": "''"
   },
@@ -30,7 +30,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string"
    },
-   "description": "The earliest accepted time part of the date-time.",
+   "description": "Sets the minimum time that can be selected",
    "privacy": "public",
    "default": "''"
   },
@@ -40,7 +40,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string"
    },
-   "description": "The earliest accepted date part of the date-time.",
+   "description": "Sets the minimum date that can be selected",
    "privacy": "public",
    "default": "''"
   },
@@ -50,7 +50,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string"
    },
-   "description": "The latest accepted date-time.",
+   "description": "Sets the maximum date and time that can be selected",
    "privacy": "public",
    "default": "''"
   },
@@ -60,7 +60,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string"
    },
-   "description": "The latest accepted time part of the date-time.",
+   "description": "Sets the maximum time that can be selected",
    "privacy": "public",
    "default": "''"
   },
@@ -70,30 +70,10 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string"
    },
-   "description": "The latest accepted time date of the date-time.",
+   "description": "Sets the maximum date that can be selected",
    "privacy": "public",
    "default": "''"
   },
-  {
-   "kind": "field",
-   "name": "_resolvedMinDate",
-   "readonly": true
-  },
-  {
-   "kind": "field",
-   "name": "_resolvedMaxDate",
-   "readonly": true
-  },
-  {
-   "kind": "field",
-   "name": "_resolvedMinTime",
-   "readonly": true
-  },
-  {
-   "kind": "field",
-   "name": "_resolvedMaxTime",
-   "readonly": true
-  },
   {
    "kind": "field",
    "name": "type",
@@ -237,6 +217,19 @@ Code in this file were generated using following JSON:
     "module": "src/shared/foundation/form-associated/form-associated.ts"
    }
   },
+  {
+   "kind": "field",
+   "name": "scale",
+   "type": {
+    "text": "TextFieldSize | undefined"
+   },
+   "description": "Sets the display size of the picker field input element.",
+   "privacy": "public",
+   "inheritedFrom": {
+    "name": "PickerField",
+    "module": "src/shared/picker-field/picker-field.ts"
+   }
+  },
   {
    "kind": "field",
    "name": "readOnly",
@@ -632,7 +625,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string"
    },
-   "description": "The earliest accepted date-time.",
+   "description": "Sets the minimum date and time that can be selected",
    "default": "''",
    "fieldName": "min"
   },
@@ -641,7 +634,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string"
    },
-   "description": "The earliest accepted time part of the date-time.",
+   "description": "Sets the minimum time that can be selected",
    "default": "''",
    "fieldName": "minTime"
   },
@@ -650,7 +643,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string"
    },
-   "description": "The earliest accepted date part of the date-time.",
+   "description": "Sets the minimum date that can be selected",
    "default": "''",
    "fieldName": "minDate"
   },
@@ -659,7 +652,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string"
    },
-   "description": "The latest accepted date-time.",
+   "description": "Sets the maximum date and time that can be selected",
    "default": "''",
    "fieldName": "max"
   },
@@ -668,7 +661,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string"
    },
-   "description": "The latest accepted time part of the date-time.",
+   "description": "Sets the maximum time that can be selected",
    "default": "''",
    "fieldName": "maxTime"
   },
@@ -677,7 +670,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "string"
    },
-   "description": "The latest accepted time date of the date-time.",
+   "description": "Sets the maximum date that can be selected",
    "default": "''",
    "fieldName": "maxDate"
   },
@@ -719,6 +712,18 @@ Code in this file were generated using following JSON:
     "module": "src/shared/picker-field/mixins/time-selection-picker.ts"
    }
   },
+  {
+   "name": "scale",
+   "type": {
+    "text": "TextFieldSize | undefined"
+   },
+   "description": "Sets the display size of the picker field input element.",
+   "fieldName": "scale",
+   "inheritedFrom": {
+    "name": "PickerField",
+    "module": "src/shared/picker-field/picker-field.ts"
+   }
+  },
   {
    "name": "readonly",
    "type": {
@@ -861,7 +866,8 @@ Code in this file were generated using following JSON:
     "name": "modelValue",
     "propName": "value",
     "eventNames": [
-     "input"
+     "input",
+     "@lazy:change"
     ],
     "valueMapping": "event.currentTarget.value"
    }
@@ -882,7 +888,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 { registerDateTimePicker } from '@vonage/vivid'
 
 registerDateTimePicker('vvd3')
@@ -890,7 +896,7 @@ registerDateTimePicker('vvd3')
 const VwcDateTimePicker = wrapper(`vvd3-date-time-picker`,  {
     events: [{"name":"change","propName":"onChange"},{"name":"input","propName":"onInput"}],
     attributes: [],
-    properties: ['min', 'minTime', 'minDate', 'max', 'maxTime', 'maxDate', 'type', 'step', 'minutesStep', 'secondsStep', 'clock', 'value', 'readOnly', 'helperText', 'errorText', 'validate', 'label', 'currentValue', 'initialValue', 'disabled', 'name', 'required', 'VIVID_VERSION', 'componentName']
+    properties: ['min', 'minTime', 'minDate', 'max', 'maxTime', 'maxDate', 'type', 'step', 'minutesStep', 'secondsStep', 'clock', 'value', 'scale', 'readOnly', 'helperText', 'errorText', 'validate', 'label', 'currentValue', 'initialValue', 'disabled', 'name', 'required', 'VIVID_VERSION', 'componentName']
 })
 
 VwcDateTimePicker.displayName = 'VwcDateTimePicker'

package/v3/VwcDateTimePicker/package.json

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

@@ -1,20 +1,23 @@
 import React, { ReactNode, SyntheticEvent } from 'react';
 /** Base class for dial-pad
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/dial-pad
-* @param {string | null} helperText - Indicates the helper-text's text. **attribute** `helper-text`
+* @param {string | null} helperText - Controls the helper text displayed below the phone input element **attribute** `helper-text`
 * @param {string | null} placeholder - Indicates the placeholder's text. **attribute** `placeholder`
-* @param {string} value - Indicates the value's text. **attribute** `value`
-* @param {string} pattern - Indicates the dial pad's pattern. **attribute** `pattern`
-* @param {boolean} disabled - Indicates the disabled state of the dial-pad. **attribute** `disabled`
-* @param {boolean} pending - Indicates the pending state of the dial-pad. **attribute** `pending`
-* @param {boolean} callActive - Indicates the active state of the dial-pad. **attribute** `call-active`
-* @param {boolean} noCall - Indicates the no-call state of the dial-pad. **attribute** `no-call`
-* @param {boolean} noInput - Indicates the no-input state of the dial-pad. **attribute** `no-input`
+* @param {string} value - Value of the phone input element **attribute** `value`
+* @param {string} pattern - Regular expression to validate the value of the input element **attribute** `pattern`
+* @param {boolean} disabled - Controls the disabled state of the dial pad **attribute** `disabled`
+* @param {boolean} pending - Controls the pending state **attribute** `pending`
+* @param {boolean} callActive - Controls the active state of the call **attribute** `call-active`
+* @param {boolean} noCall - Removes the call button and functionality **attribute** `no-call`
+* @param {boolean} noInput - Removes the phone input element **attribute** `no-input`
+* @param {DialPadSize | undefined} size - Controls the vertical size of the dial pad **attribute** `size`
 * @param {| string
-        | null} endCallButtonLabel  **attribute** `end-call-button-label`
-* @param {string | null} callButtonLabel  **attribute** `call-button-label`
+        | null} endCallButtonLabel - Controls the end call button label **attribute** `end-call-button-label`
+* @param {string | null} callButtonLabel - Controls the call button label **attribute** `call-button-label`
 * @param {string | null} deleteAriaLabel - The aria-label for the delete button **attribute** `delete-aria-label`
-* @param {boolean} autofocus - Indicates that this element should get focus after the page finishes loading. **attribute** `autofocus`
+* @param {boolean} autofocus - Indicates that an element should be focused on page load, or when the Dialog that it is part of
+is displayed. When `no-input` attribute is specified, it will be the first digit button.
+Otherwise, the text field will be focused.` **attribute** `autofocus`
 * @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
@@ -22,52 +25,56 @@ It can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.
 declare const VwcDialPad: {
     (props: {
         children?: ReactNode;
-        slot?: string | undefined;
-        id?: string | undefined;
-        style?: React.CSSProperties | undefined;
-        ref?: React.RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-        onChange?: ((event: SyntheticEvent) => void) | undefined;
-        onInput?: ((event: SyntheticEvent) => void) | undefined;
-        onBlur?: ((event: SyntheticEvent) => void) | undefined;
-        onFocus?: ((event: SyntheticEvent) => void) | undefined;
-        onKeypadClick?: ((event: SyntheticEvent) => void) | undefined;
-        onDial?: ((event: SyntheticEvent) => void) | undefined;
-        onEndCall?: ((event: SyntheticEvent) => void) | undefined;
-        helperText?: string | null | undefined;
-        placeholder?: string | null | undefined;
-        value?: string | undefined;
-        pattern?: string | undefined;
-        disabled?: boolean | undefined;
-        pending?: boolean | undefined;
-        callActive?: boolean | undefined;
-        noCall?: boolean | undefined;
-        noInput?: boolean | undefined;
-        endCallButtonLabel?: any;
-        callButtonLabel?: string | null | undefined;
-        deleteAriaLabel?: string | null | undefined;
-        autofocus?: boolean | undefined;
-        VIVID_VERSION?: string | undefined;
-        componentName?: string | undefined;
+        slot?: string;
+        id?: string;
+        style?: React.CSSProperties;
+        ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+        onChange?: (event: SyntheticEvent) => void;
+        onInput?: (event: SyntheticEvent) => void;
+        onBlur?: (event: SyntheticEvent) => void;
+        onFocus?: (event: SyntheticEvent) => void;
+        onKeypadClick?: (event: SyntheticEvent) => void;
+        onDial?: (event: SyntheticEvent) => void;
+        onEndCall?: (event: SyntheticEvent) => void;
+        "helperText"?: string | null;
+        "placeholder"?: string | null;
+        "value"?: string;
+        "pattern"?: string;
+        "disabled"?: boolean;
+        "pending"?: boolean;
+        "callActive"?: boolean;
+        "noCall"?: boolean;
+        "noInput"?: boolean;
+        "size"?: any;
+        "endCallButtonLabel"?: string | null;
+        "callButtonLabel"?: string | null;
+        "deleteAriaLabel"?: string | null;
+        "autofocus"?: boolean;
+        "VIVID_VERSION"?: string;
+        "componentName"?: string;
     }): JSX.Element;
     displayName: string;
 };
 export default VwcDialPad;
 /** Base class for dial-pad
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/dial-pad
-* @param {string | null} helperText - Indicates the helper-text's text. **attribute** `helper-text`
+* @param {string | null} helperText - Controls the helper text displayed below the phone input element **attribute** `helper-text`
 * @param {string | null} placeholder - Indicates the placeholder's text. **attribute** `placeholder`
-* @param {string} value - Indicates the value's text. **attribute** `value`
-* @param {string} pattern - Indicates the dial pad's pattern. **attribute** `pattern`
-* @param {boolean} disabled - Indicates the disabled state of the dial-pad. **attribute** `disabled`
-* @param {boolean} pending - Indicates the pending state of the dial-pad. **attribute** `pending`
-* @param {boolean} callActive - Indicates the active state of the dial-pad. **attribute** `call-active`
-* @param {boolean} noCall - Indicates the no-call state of the dial-pad. **attribute** `no-call`
-* @param {boolean} noInput - Indicates the no-input state of the dial-pad. **attribute** `no-input`
+* @param {string} value - Value of the phone input element **attribute** `value`
+* @param {string} pattern - Regular expression to validate the value of the input element **attribute** `pattern`
+* @param {boolean} disabled - Controls the disabled state of the dial pad **attribute** `disabled`
+* @param {boolean} pending - Controls the pending state **attribute** `pending`
+* @param {boolean} callActive - Controls the active state of the call **attribute** `call-active`
+* @param {boolean} noCall - Removes the call button and functionality **attribute** `no-call`
+* @param {boolean} noInput - Removes the phone input element **attribute** `no-input`
+* @param {DialPadSize | undefined} size - Controls the vertical size of the dial pad **attribute** `size`
 * @param {| string
-        | null} endCallButtonLabel  **attribute** `end-call-button-label`
-* @param {string | null} callButtonLabel  **attribute** `call-button-label`
+        | null} endCallButtonLabel - Controls the end call button label **attribute** `end-call-button-label`
+* @param {string | null} callButtonLabel - Controls the call button label **attribute** `call-button-label`
 * @param {string | null} deleteAriaLabel - The aria-label for the delete button **attribute** `delete-aria-label`
-* @param {boolean} autofocus - Indicates that this element should get focus after the page finishes loading. **attribute** `autofocus`
+* @param {boolean} autofocus - Indicates that an element should be focused on page load, or when the Dialog that it is part of
+is displayed. When `no-input` attribute is specified, it will be the first digit button.
+Otherwise, the text field will be focused.` **attribute** `autofocus`
 * @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
@@ -75,52 +82,56 @@ It can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.
 declare const VwcDialPad: {
     (props: {
         children?: ReactNode;
-        slot?: string | undefined;
-        id?: string | undefined;
-        style?: React.CSSProperties | undefined;
-        ref?: React.RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-        onChange?: ((event: SyntheticEvent) => void) | undefined;
-        onInput?: ((event: SyntheticEvent) => void) | undefined;
-        onBlur?: ((event: SyntheticEvent) => void) | undefined;
-        onFocus?: ((event: SyntheticEvent) => void) | undefined;
-        onKeypadClick?: ((event: SyntheticEvent) => void) | undefined;
-        onDial?: ((event: SyntheticEvent) => void) | undefined;
-        onEndCall?: ((event: SyntheticEvent) => void) | undefined;
-        helperText?: string | null | undefined;
-        placeholder?: string | null | undefined;
-        value?: string | undefined;
-        pattern?: string | undefined;
-        disabled?: boolean | undefined;
-        pending?: boolean | undefined;
-        callActive?: boolean | undefined;
-        noCall?: boolean | undefined;
-        noInput?: boolean | undefined;
-        endCallButtonLabel?: any;
-        callButtonLabel?: string | null | undefined;
-        deleteAriaLabel?: string | null | undefined;
-        autofocus?: boolean | undefined;
-        VIVID_VERSION?: string | undefined;
-        componentName?: string | undefined;
+        slot?: string;
+        id?: string;
+        style?: React.CSSProperties;
+        ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+        onChange?: (event: SyntheticEvent) => void;
+        onInput?: (event: SyntheticEvent) => void;
+        onBlur?: (event: SyntheticEvent) => void;
+        onFocus?: (event: SyntheticEvent) => void;
+        onKeypadClick?: (event: SyntheticEvent) => void;
+        onDial?: (event: SyntheticEvent) => void;
+        onEndCall?: (event: SyntheticEvent) => void;
+        "helperText"?: string | null;
+        "placeholder"?: string | null;
+        "value"?: string;
+        "pattern"?: string;
+        "disabled"?: boolean;
+        "pending"?: boolean;
+        "callActive"?: boolean;
+        "noCall"?: boolean;
+        "noInput"?: boolean;
+        "size"?: any;
+        "endCallButtonLabel"?: string | null;
+        "callButtonLabel"?: string | null;
+        "deleteAriaLabel"?: string | null;
+        "autofocus"?: boolean;
+        "VIVID_VERSION"?: string;
+        "componentName"?: string;
     }): JSX.Element;
     displayName: string;
 };
 export default VwcDialPad;
 /** Base class for dial-pad
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/dial-pad
-* @param {string | null} helperText - Indicates the helper-text's text. **attribute** `helper-text`
+* @param {string | null} helperText - Controls the helper text displayed below the phone input element **attribute** `helper-text`
 * @param {string | null} placeholder - Indicates the placeholder's text. **attribute** `placeholder`
-* @param {string} value - Indicates the value's text. **attribute** `value`
-* @param {string} pattern - Indicates the dial pad's pattern. **attribute** `pattern`
-* @param {boolean} disabled - Indicates the disabled state of the dial-pad. **attribute** `disabled`
-* @param {boolean} pending - Indicates the pending state of the dial-pad. **attribute** `pending`
-* @param {boolean} callActive - Indicates the active state of the dial-pad. **attribute** `call-active`
-* @param {boolean} noCall - Indicates the no-call state of the dial-pad. **attribute** `no-call`
-* @param {boolean} noInput - Indicates the no-input state of the dial-pad. **attribute** `no-input`
+* @param {string} value - Value of the phone input element **attribute** `value`
+* @param {string} pattern - Regular expression to validate the value of the input element **attribute** `pattern`
+* @param {boolean} disabled - Controls the disabled state of the dial pad **attribute** `disabled`
+* @param {boolean} pending - Controls the pending state **attribute** `pending`
+* @param {boolean} callActive - Controls the active state of the call **attribute** `call-active`
+* @param {boolean} noCall - Removes the call button and functionality **attribute** `no-call`
+* @param {boolean} noInput - Removes the phone input element **attribute** `no-input`
+* @param {DialPadSize | undefined} size - Controls the vertical size of the dial pad **attribute** `size`
 * @param {| string
-        | null} endCallButtonLabel  **attribute** `end-call-button-label`
-* @param {string | null} callButtonLabel  **attribute** `call-button-label`
+        | null} endCallButtonLabel - Controls the end call button label **attribute** `end-call-button-label`
+* @param {string | null} callButtonLabel - Controls the call button label **attribute** `call-button-label`
 * @param {string | null} deleteAriaLabel - The aria-label for the delete button **attribute** `delete-aria-label`
-* @param {boolean} autofocus - Indicates that this element should get focus after the page finishes loading. **attribute** `autofocus`
+* @param {boolean} autofocus - Indicates that an element should be focused on page load, or when the Dialog that it is part of
+is displayed. When `no-input` attribute is specified, it will be the first digit button.
+Otherwise, the text field will be focused.` **attribute** `autofocus`
 * @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
@@ -128,32 +139,33 @@ It can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.
 declare const VwcDialPad: {
     (props: {
         children?: ReactNode;
-        slot?: string | undefined;
-        id?: string | undefined;
-        style?: React.CSSProperties | undefined;
-        ref?: React.RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-        onChange?: ((event: SyntheticEvent) => void) | undefined;
-        onInput?: ((event: SyntheticEvent) => void) | undefined;
-        onBlur?: ((event: SyntheticEvent) => void) | undefined;
-        onFocus?: ((event: SyntheticEvent) => void) | undefined;
-        onKeypadClick?: ((event: SyntheticEvent) => void) | undefined;
-        onDial?: ((event: SyntheticEvent) => void) | undefined;
-        onEndCall?: ((event: SyntheticEvent) => void) | undefined;
-        helperText?: string | null | undefined;
-        placeholder?: string | null | undefined;
-        value?: string | undefined;
-        pattern?: string | undefined;
-        disabled?: boolean | undefined;
-        pending?: boolean | undefined;
-        callActive?: boolean | undefined;
-        noCall?: boolean | undefined;
-        noInput?: boolean | undefined;
-        endCallButtonLabel?: any;
-        callButtonLabel?: string | null | undefined;
-        deleteAriaLabel?: string | null | undefined;
-        autofocus?: boolean | undefined;
-        VIVID_VERSION?: string | undefined;
-        componentName?: string | undefined;
+        slot?: string;
+        id?: string;
+        style?: React.CSSProperties;
+        ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+        onChange?: (event: SyntheticEvent) => void;
+        onInput?: (event: SyntheticEvent) => void;
+        onBlur?: (event: SyntheticEvent) => void;
+        onFocus?: (event: SyntheticEvent) => void;
+        onKeypadClick?: (event: SyntheticEvent) => void;
+        onDial?: (event: SyntheticEvent) => void;
+        onEndCall?: (event: SyntheticEvent) => void;
+        "helperText"?: string | null;
+        "placeholder"?: string | null;
+        "value"?: string;
+        "pattern"?: string;
+        "disabled"?: boolean;
+        "pending"?: boolean;
+        "callActive"?: boolean;
+        "noCall"?: boolean;
+        "noInput"?: boolean;
+        "size"?: any;
+        "endCallButtonLabel"?: string | null;
+        "callButtonLabel"?: string | null;
+        "deleteAriaLabel"?: string | null;
+        "autofocus"?: boolean;
+        "VIVID_VERSION"?: string;
+        "componentName"?: string;
     }): JSX.Element;
     displayName: string;
 };