@vonage/vivid-react 4.0.0 → 5.20.0

package/v3/VwcKbdShortcut/index.js

@@ -0,0 +1,78 @@
+/*
+* DO NOT EDIT THIS FILE. IT IS GENERATED
+*/
+/*
+Code in this file were generated using following JSON:
+{
+ "kind": "class",
+ "description": "",
+ "name": "KbdShortcut",
+ "slots": [
+  {
+   "description": "Default slot for Kbd elements.",
+   "name": ""
+  }
+ ],
+ "members": [
+  {
+   "kind": "method",
+   "name": "getKeyshortcutsValue",
+   "return": {
+    "type": {
+     "text": "string | null"
+    }
+   },
+   "description": "Returns a valid aria-keyshortcuts value based on the slotted kbd-key elements.\nModifiers are sorted to be first as required by the spec.\nReturns null if no keys are available."
+  },
+  {
+   "kind": "field",
+   "name": "VIVID_VERSION",
+   "static": true,
+   "default": "__PACKAGE_VERSION__",
+   "description": "The current version of the Vivid library, which is useful for debugging.\nIt can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.",
+   "type": {
+    "text": "string"
+   },
+   "inheritedFrom": {
+    "name": "VividElement",
+    "module": "src/shared/foundation/vivid-element/vivid-element.ts"
+   }
+  },
+  {
+   "kind": "field",
+   "name": "componentName",
+   "type": {
+    "text": "string"
+   },
+   "static": true,
+   "description": "Core component name, without prefix",
+   "inheritedFrom": {
+    "name": "VividElement",
+    "module": "src/shared/foundation/vivid-element/vivid-element.ts"
+   }
+  }
+ ],
+ "superclass": {
+  "name": "VividElement",
+  "module": "/src/shared/foundation/vivid-element/vivid-element"
+ },
+ "vividComponent": {
+  "public": true,
+  "name": "kbd-shortcut"
+ }
+}
+*/
+import wrapper from '@repo/react-component-wrapper'
+import { registerKbdShortcut } from '@vonage/vivid'
+
+registerKbdShortcut('vvd3')
+
+const VwcKbdShortcut = wrapper(`vvd3-kbd-shortcut`,  {
+    events: [],
+    attributes: [],
+    properties: ['VIVID_VERSION', 'componentName']
+})
+
+VwcKbdShortcut.displayName = 'VwcKbdShortcut'
+
+export default VwcKbdShortcut

package/v3/VwcKbdShortcut/package.json

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

package/v3/VwcLayout/index.d.ts

@@ -2,11 +2,11 @@ import React, { ReactNode } from 'react';
 /** [--layout-grid-template-columns=repeat([the `auto-sizing` mapped value],
 minmax([the `column-basis` mapped value], 1fr))] - Controls the `grid-template-columns` of the layout.
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/layout
-* @param {Gutters | undefined} gutters - sets the initial preferred margin from predefined available options **attribute** `gutters`
-* @param {ColumnBasis | undefined} columnBasis - sets the initial preferred measure of a column from predefined available options **attribute** `column-basis`
-* @param {ColumnSpacing | undefined} columnSpacing - sets the initial preferred spacing of a column from predefined available options **attribute** `column-spacing`
+* @param {Gutters | undefined} gutters - Controls the amount of margin around the component **attribute** `gutters`
+* @param {ColumnBasis | undefined} columnBasis - Controls the `min-width` of columns **attribute** `column-basis`
+* @param {ColumnSpacing | undefined} columnSpacing - Controls the size of the spacing between columns **attribute** `column-spacing`
 * @param {RowSpacing | undefined} rowSpacing - sets the initial preferred spacing of a row from predefined available options **attribute** `row-spacing`
-* @param {'fit' | 'fill' | undefined} autoSizing - sets the initial preferred auto-sizing from predefined available options **attribute** `auto-sizing`
+* @param {'fit' | 'fill' | undefined} autoSizing - Controls how the grid's behaves with empty column tracks **attribute** `auto-sizing`
 * @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
@@ -14,17 +14,17 @@ It can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.
 declare const VwcLayout: {
     (props: {
         children?: ReactNode;
-        slot?: string | undefined;
-        id?: string | undefined;
-        style?: React.CSSProperties | undefined;
-        ref?: React.RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-        gutters?: any;
-        columnBasis?: any;
-        columnSpacing?: any;
-        rowSpacing?: any;
-        autoSizing?: 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;
+        "gutters"?: any;
+        "columnBasis"?: any;
+        "columnSpacing"?: any;
+        "rowSpacing"?: any;
+        "autoSizing"?: "fit" | "fill" | undefined;
+        "VIVID_VERSION"?: string;
+        "componentName"?: string;
     }): JSX.Element;
     displayName: string;
 };

package/v3/VwcLayout/index.js

@@ -20,7 +20,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "Gutters | undefined"
    },
-   "description": "sets the initial preferred margin from predefined available options",
+   "description": "Controls the amount of margin around the component",
    "privacy": "public"
   },
   {
@@ -29,7 +29,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "ColumnBasis | undefined"
    },
-   "description": "sets the initial preferred measure of a column from predefined available options",
+   "description": "Controls the `min-width` of columns",
    "privacy": "public"
   },
   {
@@ -38,7 +38,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "ColumnSpacing | undefined"
    },
-   "description": "sets the initial preferred spacing of a column from predefined available options",
+   "description": "Controls the size of the spacing between columns",
    "privacy": "public"
   },
   {
@@ -56,7 +56,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "'fit' | 'fill' | undefined"
    },
-   "description": "sets the initial preferred auto-sizing from predefined available options",
+   "description": "Controls how the grid's behaves with empty column tracks",
    "privacy": "public"
   },
   {
@@ -93,7 +93,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "Gutters | undefined"
    },
-   "description": "sets the initial preferred margin from predefined available options",
+   "description": "Controls the amount of margin around the component",
    "fieldName": "gutters"
   },
   {
@@ -101,7 +101,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "ColumnBasis | undefined"
    },
-   "description": "sets the initial preferred measure of a column from predefined available options",
+   "description": "Controls the `min-width` of columns",
    "fieldName": "columnBasis"
   },
   {
@@ -109,7 +109,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "ColumnSpacing | undefined"
    },
-   "description": "sets the initial preferred spacing of a column from predefined available options",
+   "description": "Controls the size of the spacing between columns",
    "fieldName": "columnSpacing"
   },
   {
@@ -125,7 +125,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "'fit' | 'fill' | undefined"
    },
-   "description": "sets the initial preferred auto-sizing from predefined available options",
+   "description": "Controls how the grid's behaves with empty column tracks",
    "fieldName": "autoSizing"
   }
  ],
@@ -139,7 +139,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 { registerLayout } from '@vonage/vivid'
 
 registerLayout('vvd3')

package/v3/VwcLayout/package.json

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

@@ -13,17 +13,17 @@ It can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.
 declare const VwcListbox: {
     (props: {
         children?: ReactNode;
-        slot?: string | undefined;
-        id?: string | undefined;
-        style?: React.CSSProperties | undefined;
-        ref?: React.RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-        options?: any[] | undefined;
-        disabled?: boolean | undefined;
-        selectedIndex?: number | undefined;
-        selectedOptions?: any[] | undefined;
-        slottedOptionFilter?: 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;
+        "options"?: any[];
+        "disabled"?: boolean;
+        "selectedIndex"?: number;
+        "selectedOptions"?: any[];
+        "slottedOptionFilter"?: any;
+        "VIVID_VERSION"?: string;
+        "componentName"?: string;
     }): JSX.Element;
     displayName: string;
 };

package/v3/VwcListbox/index.js

@@ -69,19 +69,6 @@ Code in this file were generated using following JSON:
    ],
    "privacy": "public"
   },
-  {
-   "kind": "method",
-   "name": "getNextSelectableIndex",
-   "privacy": "protected",
-   "parameters": [
-    {
-     "name": "fromIndex",
-     "type": {
-      "text": "number"
-     }
-    }
-   ]
-  },
   {
    "kind": "method",
    "name": "_validSelectedIndex",
@@ -204,7 +191,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 { registerListbox } from '@vonage/vivid'
 
 registerListbox('vvd3')

package/v3/VwcListbox/package.json

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

@@ -1,16 +1,14 @@
 import React, { ReactNode, SyntheticEvent } from 'react';
 /** VwcMenu
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/menu
+* @param {string | HTMLElement} anchor  **attribute** `anchor`
 * @param {number | null} offset - Adds offset to the popup **attribute** `offset`
-* @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 {Placement | undefined} placement - Sets the desired position of the Menu relative to it's anchor element **attribute** `placement`
+* @param {'auto' | 'legacy' | 'off' | undefined} trigger - Sets trigger method of Menu **attribute** `trigger`
+* @param {boolean} autoDismiss - Sets the Menu to close when focus is lost **attribute** `auto-dismiss`
+* @param {Strategy | undefined} positionStrategy - Sets the position strategy **attribute** `position-strategy`
+* @param {boolean} open - Sets the open state of the Menu **attribute** `open`
 * @param {AnchorType | undefined} anchor - ID or direct reference to the component's anchor element. **attribute** `anchor`
-* @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
@@ -18,24 +16,21 @@ It can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.
 declare const VwcMenu: {
     (props: {
         children?: ReactNode;
-        slot?: string | undefined;
-        id?: string | undefined;
-        style?: React.CSSProperties | undefined;
-        ref?: React.RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-        onOpen?: ((event: SyntheticEvent) => void) | undefined;
-        onClose?: ((event: SyntheticEvent) => void) | undefined;
-        offset?: number | undefined;
-        placement?: any;
-        trigger?: any;
-        autoDismiss?: boolean | undefined;
-        positionStrategy?: any;
-        open?: boolean | undefined;
-        _onFocusout?: any;
-        actionItemsSlottedContent?: any;
-        anchor?: 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;
+        onOpen?: (event: SyntheticEvent) => void;
+        onClose?: (event: SyntheticEvent) => void;
+        "anchor"?: string | HTMLElement;
+        "offset"?: number | null;
+        "placement"?: any;
+        "trigger"?: "auto" | "legacy" | "off" | undefined;
+        "autoDismiss"?: boolean;
+        "positionStrategy"?: any;
+        "open"?: boolean;
+        "VIVID_VERSION"?: string;
+        "componentName"?: string;
     }): JSX.Element;
     displayName: string;
 };

package/v3/VwcMenu/index.js

@@ -71,7 +71,7 @@ Code in this file were generated using following JSON:
      "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.",
+   "description": "Moves focus into the Menu. If there is a child with the `autofocus` attribute, it will be\nfocused. Otherwise, the first Menu Item will be focused.",
    "privacy": "public"
   },
   {
@@ -141,7 +141,7 @@ Code in this file were generated using following JSON:
     "text": "Placement | undefined"
    },
    "default": "'bottom'",
-   "description": "placement of the menu",
+   "description": "Sets the desired position of the Menu relative to it's anchor element",
    "privacy": "public"
   },
   {
@@ -150,7 +150,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "'auto' | 'legacy' | 'off' | undefined"
    },
-   "description": "Controls how the menu opens and closes itself.",
+   "description": "Sets trigger method of Menu",
    "privacy": "public"
   },
   {
@@ -169,7 +169,7 @@ Code in this file were generated using following JSON:
     "text": "boolean"
    },
    "default": "false",
-   "description": "indicates whether the menu will automatically close when focus moves away from it.",
+   "description": "Sets the Menu to close when focus is lost",
    "privacy": "public"
   },
   {
@@ -179,7 +179,7 @@ Code in this file were generated using following JSON:
     "text": "Strategy | undefined"
    },
    "default": "'fixed'",
-   "description": "The strategy-absolute attribute.",
+   "description": "Sets the position strategy",
    "privacy": "public"
   },
   {
@@ -189,7 +189,7 @@ Code in this file were generated using following JSON:
     "text": "boolean"
    },
    "default": "false",
-   "description": "indicates whether the menu is open",
+   "description": "Sets the open state of the Menu",
    "privacy": "public"
   },
   {
@@ -256,17 +256,6 @@ Code in this file were generated using following JSON:
    "name": "#onAnchorClick",
    "privacy": "private"
   },
-  {
-   "kind": "field",
-   "name": "_onFocusout"
-  },
-  {
-   "kind": "field",
-   "name": "actionItemsSlottedContent",
-   "type": {
-    "text": "HTMLElement[] | undefined"
-   }
-  },
   {
    "kind": "field",
    "name": "anchor",
@@ -319,18 +308,6 @@ Code in this file were generated using following JSON:
     "module": "src/shared/patterns/anchored.ts"
    }
   },
-  {
-   "kind": "field",
-   "name": "_vividAriaBehaviour",
-   "default": "'delegate'",
-   "type": {
-    "text": "'delegate'"
-   },
-   "inheritedFrom": {
-    "name": "DelegatesAria",
-    "module": "src/shared/aria/delegates-aria.ts"
-   }
-  },
   {
    "kind": "field",
    "name": "VIVID_VERSION",
@@ -391,7 +368,7 @@ Code in this file were generated using following JSON:
     "text": "Placement | undefined"
    },
    "default": "'bottom'",
-   "description": "placement of the menu",
+   "description": "Sets the desired position of the Menu relative to it's anchor element",
    "fieldName": "placement"
   },
   {
@@ -399,7 +376,7 @@ Code in this file were generated using following JSON:
    "type": {
     "text": "'auto' | 'legacy' | 'off' | undefined"
    },
-   "description": "Controls how the menu opens and closes itself.",
+   "description": "Sets trigger method of Menu",
    "fieldName": "trigger"
   },
   {
@@ -408,7 +385,7 @@ Code in this file were generated using following JSON:
     "text": "boolean"
    },
    "default": "false",
-   "description": "indicates whether the menu will automatically close when focus moves away from it.",
+   "description": "Sets the Menu to close when focus is lost",
    "fieldName": "autoDismiss"
   },
   {
@@ -417,7 +394,7 @@ Code in this file were generated using following JSON:
     "text": "Strategy | undefined"
    },
    "default": "'fixed'",
-   "description": "The strategy-absolute attribute.",
+   "description": "Sets the position strategy",
    "fieldName": "positionStrategy"
   },
   {
@@ -426,7 +403,7 @@ Code in this file were generated using following JSON:
     "text": "boolean"
    },
    "default": "false",
-   "description": "indicates whether the menu is open",
+   "description": "Sets the open state of the Menu",
    "fieldName": "open"
   },
   {
@@ -490,7 +467,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 { registerMenu } from '@vonage/vivid'
 
 registerMenu('vvd3')
@@ -498,7 +475,7 @@ registerMenu('vvd3')
 const VwcMenu = wrapper(`vvd3-menu`,  {
     events: [{"name":"close","propName":"onClose"},{"name":"open","propName":"onOpen"}],
     attributes: [],
-    properties: ['offset', 'placement', 'trigger', 'autoDismiss', 'positionStrategy', 'open', '_onFocusout', 'actionItemsSlottedContent', 'anchor', '_vividAriaBehaviour', 'VIVID_VERSION', 'componentName']
+    properties: ['anchor', 'offset', 'placement', 'trigger', 'autoDismiss', 'positionStrategy', 'open', 'anchor', 'VIVID_VERSION', 'componentName']
 })
 
 VwcMenu.displayName = 'VwcMenu'

package/v3/VwcMenu/package.json

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

@@ -2,20 +2,19 @@ import React, { ReactNode, SyntheticEvent } from 'react';
 /** VwcMenuItem
 * For more info on this Vivid element please visit https://vivid.deno.dev/components/menu-item
 * @param {string | undefined} icon  **attribute** `icon`
-* @param {boolean} disabled - The disabled state of the element. **attribute** `disabled`
-* @param {boolean} expanded - The expanded state of the element. **attribute** `expanded`
+* @param {boolean} disabled - Sets the disabled state **attribute** `disabled`
+* @param {boolean} expanded - Sets the expanded state **attribute** `expanded`
 * @param {MenuItemRole} role - The role of the element.
 * @param {ControlType | undefined} controlType - Whether the menu item should behave as a checkbox or radio button. **attribute** `control-type`
-* @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 {boolean} checked - Sets the checked state **attribute** `checked`
+* @param {string | undefined} text - Text content **attribute** `text`
+* @param {string | undefined} textSecondary - Give more context to the text **attribute** `text-secondary`
+* @param {MenuItemConnotation | undefined} connotation - Sets the connotation that appears when checked **attribute** `connotation`
+* @param {boolean} checkTrailing - Sets the check element to appear at the end of the Menu Item **attribute** `check-trailing`
 * @param {| 'normal'
         | 'tick-only' | undefined} checkedAppearance - Controls the appearance of the check indicator. **attribute** `check-appearance`
-* @param {HTMLElement[] | undefined} trailingMetaSlottedContent
-* @param {'host'} _vividAriaBehaviour
-* @param {string | undefined} icon - A decorative icon the custom element should have. **attribute** `icon`
+* @param {string | undefined} icon - A decorative icon the custom element should have. See the [Vivid Icon
+Gallery](/icons/icons-gallery/) for available icons and `icon-name`s **attribute** `icon`
 * @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
@@ -23,27 +22,26 @@ It can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.
 declare const VwcMenuItem: {
     (props: {
         children?: ReactNode;
-        slot?: string | undefined;
-        id?: string | undefined;
-        style?: React.CSSProperties | undefined;
-        ref?: React.RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-        onExpandedChange?: ((event: SyntheticEvent) => void) | undefined;
-        onChange?: ((event: SyntheticEvent) => void) | undefined;
-        icon?: string | undefined;
-        disabled?: boolean | undefined;
-        expanded?: boolean | undefined;
-        role?: any;
-        controlType?: any;
-        checked?: boolean | undefined;
-        text?: string | undefined;
-        textSecondary?: string | undefined;
-        connotation?: any;
-        checkTrailing?: boolean | undefined;
-        checkedAppearance?: any;
-        trailingMetaSlottedContent?: 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;
+        onExpandedChange?: (event: SyntheticEvent) => void;
+        onChange?: (event: SyntheticEvent) => void;
+        onChange?: (event: SyntheticEvent) => void;
+        "icon"?: string | undefined;
+        "disabled"?: boolean;
+        "expanded"?: boolean;
+        "role"?: any;
+        "controlType"?: any;
+        "checked"?: boolean;
+        "text"?: string | undefined;
+        "textSecondary"?: string | undefined;
+        "connotation"?: any;
+        "checkTrailing"?: boolean;
+        "checkedAppearance"?: "normal" | "tick-only" | undefined;
+        "VIVID_VERSION"?: string;
+        "componentName"?: string;
     }): JSX.Element;
     displayName: string;
 };