@vonage/vivid 3.26.0 → 3.27.0

package/README.md

@@ -161,6 +161,8 @@ This project is licensed under the Apache 2.0 License - see the [LICENSE.md](htt
 - [Fast](https://www.fast.design) - to extend element classes and compile code to native web components
 - [Typescript](https://www.typescriptlang.org) - for ergonomic and type-safe code
 - [Sass](https://sass-lang.com) - for styles authoring extensibility and consistency
+- [Floating UI](https://floating-ui.com) - for positioning floating elements
+- [Dropzone](https://dropzone.dev) - for handling dropped files
 
 ---
 ## Have questions?

package/custom-elements.json

@@ -4366,6 +4366,299 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "libs/components/src/lib/file-picker/definition.ts",
+      "declarations": [
+        {
+          "kind": "variable",
+          "name": "filePickerDefinition"
+        },
+        {
+          "kind": "variable",
+          "name": "registerFilePicker",
+          "description": "Registers the file-picker element with the design system.",
+          "parameters": [
+            {
+              "description": "the prefix to use for the component name",
+              "name": "prefix"
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "filePickerDefinition",
+          "declaration": {
+            "name": "filePickerDefinition",
+            "module": "libs/components/src/lib/file-picker/definition.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "registerFilePicker",
+          "declaration": {
+            "name": "registerFilePicker",
+            "module": "libs/components/src/lib/file-picker/definition.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "libs/components/src/lib/file-picker/file-picker.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "File-picker component",
+          "name": "FilePicker",
+          "members": [
+            {
+              "kind": "field",
+              "name": "#dropzone",
+              "privacy": "private",
+              "type": {
+                "text": "Dropzone | undefined"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "files",
+              "type": {
+                "text": "File[]"
+              },
+              "description": "Files that have been added to the file picker and passed validation.",
+              "privacy": "public",
+              "readonly": true
+            },
+            {
+              "kind": "field",
+              "name": "label",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Indicates the file picker's label.",
+              "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "maxFiles",
+              "type": {
+                "text": "number | undefined"
+              },
+              "description": "The max files that can be selected.",
+              "privacy": "public"
+            },
+            {
+              "kind": "method",
+              "name": "maxFilesChanged",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "_oldValue",
+                  "type": {
+                    "text": "number"
+                  }
+                },
+                {
+                  "name": "newValue",
+                  "type": {
+                    "text": "number"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "field",
+              "name": "maxFileSize",
+              "type": {
+                "text": "number"
+              },
+              "default": "256",
+              "description": "The max file size that can be selected.",
+              "privacy": "public"
+            },
+            {
+              "kind": "method",
+              "name": "maxFileSizeChanged",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "_oldValue",
+                  "type": {
+                    "text": "number"
+                  }
+                },
+                {
+                  "name": "newValue",
+                  "type": {
+                    "text": "number"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "field",
+              "name": "accept",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "List of accepted files types",
+              "privacy": "public"
+            },
+            {
+              "kind": "method",
+              "name": "acceptChanged",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "_oldValue",
+                  "type": {
+                    "text": "string"
+                  }
+                },
+                {
+                  "name": "newValue",
+                  "type": {
+                    "text": "string"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "field",
+              "name": "size",
+              "type": {
+                "text": "FileUploaderSize | undefined"
+              },
+              "description": "The size the file-uploader should have.",
+              "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "buttonTag",
+              "type": {
+                "text": "string"
+              },
+              "privacy": "private",
+              "default": "'vwc-button'",
+              "description": "Used internally to hold the tag that button is registered at."
+            },
+            {
+              "kind": "method",
+              "name": "#chooseFile",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "#updateHiddenFileInput",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "#handleFilesChanged",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
+            },
+            {
+              "kind": "field",
+              "name": "autoDiscover",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false"
+            }
+          ],
+          "events": [
+            {
+              "description": "Emitted when a file is added or removed.",
+              "name": "change"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "label",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Indicates the file picker's label.",
+              "fieldName": "label"
+            },
+            {
+              "name": "max-files",
+              "type": {
+                "text": "number | undefined"
+              },
+              "description": "The max files that can be selected.",
+              "fieldName": "maxFiles"
+            },
+            {
+              "name": "max-file-size",
+              "type": {
+                "text": "number"
+              },
+              "default": "256",
+              "description": "The max file size that can be selected.",
+              "fieldName": "maxFileSize"
+            },
+            {
+              "name": "accept",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "List of accepted files types",
+              "fieldName": "accept"
+            },
+            {
+              "name": "size",
+              "type": {
+                "text": "FileUploaderSize | undefined"
+              },
+              "description": "The size the file-uploader should have.",
+              "fieldName": "size"
+            }
+          ],
+          "superclass": {
+            "name": "FoundationElement",
+            "package": "@microsoft/fast-foundation"
+          }
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "FilePicker",
+          "declaration": {
+            "name": "FilePicker",
+            "module": "libs/components/src/lib/file-picker/file-picker.ts"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "libs/components/src/lib/focus/definition.ts",
@@ -5214,6 +5507,13 @@
             {
               "kind": "method",
               "name": "autoDismissChanged"
+            },
+            {
+              "kind": "field",
+              "name": "actionItemsSlottedContent",
+              "type": {
+                "text": "HTMLElement[] | undefined"
+              }
             }
           ],
           "attributes": [

package/file-picker/index.js

@@ -0,0 +1,26 @@
+import { r as registerFilePicker } from '../shared/definition27.js';
+import '../shared/index.js';
+import '../shared/definition3.js';
+import '../shared/icon.js';
+import '../shared/to-string.js';
+import '../shared/string-trim.js';
+import '../shared/_has.js';
+import '../shared/class-names.js';
+import '../shared/when.js';
+import '../shared/definition4.js';
+import '../shared/focus.js';
+import '../shared/definition7.js';
+import '../shared/definition9.js';
+import '../shared/base-progress.js';
+import '../shared/affix.js';
+import '../shared/button.js';
+import '../shared/apply-mixins.js';
+import '../shared/form-associated.js';
+import '../shared/key-codes.js';
+import '../shared/aria-global.js';
+import '../shared/start-end.js';
+import '../shared/ref.js';
+import '../shared/focus2.js';
+import '../shared/form-elements.js';
+
+registerFilePicker();

package/header/index.js

@@ -1,4 +1,4 @@
-import { r as registerHeader } from '../shared/definition27.js';
+import { r as registerHeader } from '../shared/definition28.js';
 import '../shared/index.js';
 import '../shared/definition8.js';
 import '../shared/class-names.js';

package/index.js

@@ -18,38 +18,38 @@ export { d as dialogDefinition, a as dialogRegistries, r as registerDialog } fro
 export { a as dividerDefinition, d as dividerRegistries, r as registerDivider } from './shared/definition24.js';
 export { d as dataGrid, b as dataGridCell, c as dataGridElements, a as dataGridRow, r as registerDataGrid } from './shared/definition22.js';
 export { f as fabDefinition, a as fabRegistries, r as registerFab } from './shared/definition26.js';
-export { h as headerDefinition, a as headerRegistries, r as registerHeader } from './shared/definition27.js';
+export { h as headerDefinition, a as headerRegistries, r as registerHeader } from './shared/definition28.js';
 export { a as iconDefinition, i as iconRegistries, r as registerIcon } from './shared/definition3.js';
-export { l as layoutDefinition, a as layoutRegistries, r as registerLayout } from './shared/definition28.js';
+export { l as layoutDefinition, a as layoutRegistries, r as registerLayout } from './shared/definition29.js';
 export { a as listboxOptionDefinition, l as listboxOptionRegistries, r as registerOption } from './shared/definition21.js';
-export { m as menuDefinition, a as menuRegistries, r as registerMenu } from './shared/definition29.js';
-export { c as menuItemDefinition, m as menuItemRegistries, b as registerMenuItem } from './shared/definition30.js';
-export { n as navDefinition, a as navRegistries, r as registerNav } from './shared/definition31.js';
-export { n as navDisclosureDefinition, a as navDisclosureRegistries, r as registerNavDisclosure } from './shared/definition32.js';
-export { n as navItemDefinition, a as navItemRegistries, r as registerNavItem } from './shared/definition33.js';
-export { n as noteDefinition, a as noteRegistries, r as registerNote } from './shared/definition34.js';
-export { n as numberFieldDefinition, a as numberFieldRegistries, r as registerNumberField } from './shared/definition35.js';
-export { p as paginationDefinition, a as paginationRegistries, r as registerPagination } from './shared/definition36.js';
-export { a as popupDefinition, p as popupRegistries, r as registerPopup } from './shared/definition20.js';
-export { p as progressDefinition, a as progressRegistries, r as registerProgress } from './shared/definition37.js';
+export { m as menuDefinition, a as menuRegistries, r as registerMenu } from './shared/definition30.js';
+export { c as menuItemDefinition, m as menuItemRegistries, b as registerMenuItem } from './shared/definition31.js';
+export { n as navDefinition, a as navRegistries, r as registerNav } from './shared/definition32.js';
+export { n as navDisclosureDefinition, a as navDisclosureRegistries, r as registerNavDisclosure } from './shared/definition33.js';
+export { n as navItemDefinition, a as navItemRegistries, r as registerNavItem } from './shared/definition34.js';
+export { n as noteDefinition, a as noteRegistries, r as registerNote } from './shared/definition35.js';
+export { n as numberFieldDefinition, a as numberFieldRegistries, r as registerNumberField } from './shared/definition36.js';
+export { p as paginationDefinition, a as paginationRegistries, r as registerPagination } from './shared/definition37.js';
+export { p as progressDefinition, a as progressRegistries, r as registerProgress } from './shared/definition38.js';
 export { a as progressRingDefinition, p as progressRingRegistries, r as registerProgressRing } from './shared/definition9.js';
-export { a as radioDefinition, b as radioRegistries, r as registerRadio } from './shared/definition38.js';
-export { a as radioGroupDefinition, b as radioGroupRegistries, r as registerRadioGroup } from './shared/definition39.js';
-export { r as registerSelect, s as selectDefinition, a as selectRegistries } from './shared/definition40.js';
-export { r as registerSideDrawer, s as sideDrawerDefinition, a as sideDrawerRegistries } from './shared/definition41.js';
-export { r as registerSlider, s as sliderDefinition, a as sliderRegistries } from './shared/definition42.js';
-export { r as registerSwitch, s as switchDefinition, a as switchRegistries } from './shared/definition43.js';
-export { r as registerTextField, t as textFieldDefinition, a as textFieldRegistries } from './shared/definition50.js';
-export { r as registerTextArea, t as textAreaDefinition, a as textAreaRegistries } from './shared/definition49.js';
-export { r as registerToggletip, t as toggletipDefinition, a as toggletipRegistries } from './shared/definition51.js';
-export { r as registerTooltip, t as tooltipDefinition, a as tooltipRegistries } from './shared/definition52.js';
-export { r as registerTabs, t as tabsDefinition, a as tabsRegistries } from './shared/definition46.js';
-export { r as registerTab, a as tabDefinition, t as tabRegistries } from './shared/definition44.js';
-export { r as registerTabPanel, a as tabPanelDefinition, t as tabPanelRegistries } from './shared/definition45.js';
-export { r as registerTreeView, t as treeViewDefinition, a as treeViewRegistries } from './shared/definition54.js';
-export { r as registerTreeItem, t as treeItemDefinition, a as treeItemRegistries } from './shared/definition53.js';
-export { r as registerTag, t as tagDefinition } from './shared/definition47.js';
-export { r as registerTagGroup, t as tagGroupDefinition, a as tagGroupRegistries } from './shared/definition48.js';
+export { a as radioDefinition, b as radioRegistries, r as registerRadio } from './shared/definition39.js';
+export { a as radioGroupDefinition, b as radioGroupRegistries, r as registerRadioGroup } from './shared/definition40.js';
+export { r as registerSelect, s as selectDefinition, a as selectRegistries } from './shared/definition41.js';
+export { r as registerSideDrawer, s as sideDrawerDefinition, a as sideDrawerRegistries } from './shared/definition42.js';
+export { r as registerSlider, s as sliderDefinition, a as sliderRegistries } from './shared/definition43.js';
+export { r as registerSwitch, s as switchDefinition, a as switchRegistries } from './shared/definition44.js';
+export { r as registerTextField, t as textFieldDefinition, a as textFieldRegistries } from './shared/definition51.js';
+export { r as registerTextArea, t as textAreaDefinition, a as textAreaRegistries } from './shared/definition50.js';
+export { r as registerToggletip, t as toggletipDefinition, a as toggletipRegistries } from './shared/definition52.js';
+export { r as registerTooltip, t as tooltipDefinition, a as tooltipRegistries } from './shared/definition53.js';
+export { r as registerTabs, t as tabsDefinition, a as tabsRegistries } from './shared/definition47.js';
+export { r as registerTab, a as tabDefinition, t as tabRegistries } from './shared/definition45.js';
+export { r as registerTabPanel, a as tabPanelDefinition, t as tabPanelRegistries } from './shared/definition46.js';
+export { r as registerTreeView, t as treeViewDefinition, a as treeViewRegistries } from './shared/definition55.js';
+export { r as registerTreeItem, t as treeItemDefinition, a as treeItemRegistries } from './shared/definition54.js';
+export { r as registerTag, t as tagDefinition } from './shared/definition48.js';
+export { r as registerTagGroup, t as tagGroupDefinition, a as tagGroupRegistries } from './shared/definition49.js';
+export { f as filePickerDefinition, a as filePickerRegistries, r as registerFilePicker } from './shared/definition27.js';
 export { ae as designSystem, r as registerFactory } from './shared/index.js';
 import './shared/key-codes.js';
 import './shared/numbers.js';
@@ -79,6 +79,7 @@ import './shared/text-anchor.template.js';
 import './shared/calendar-event.js';
 import './shared/es.object.assign.js';
 import './shared/repeat.js';
+import './shared/definition20.js';
 import './shared/text-field.js';
 import './shared/listbox.js';
 import './shared/strings.js';

package/layout/index.js

@@ -1,4 +1,4 @@
-import { r as registerLayout } from '../shared/definition28.js';
+import { r as registerLayout } from '../shared/definition29.js';
 import '../shared/index.js';
 import '../shared/class-names.js';
 

package/lib/components.d.ts

@@ -30,7 +30,6 @@ export * from './nav-item/definition';
 export * from './note/definition';
 export * from './number-field/definition';
 export * from './pagination/definition';
-export * from './popup/definition';
 export * from './progress/definition';
 export * from './progress-ring/definition';
 export * from './radio/definition';
@@ -50,3 +49,4 @@ export * from './tree-view/definition';
 export * from './tree-item/definition';
 export * from './tag/definition';
 export * from './tag-group/definition';
+export * from './file-picker/definition';

package/lib/file-picker/definition.d.ts

@@ -0,0 +1,3 @@
+import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
+export declare const filePickerDefinition: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<FoundationElementDefinition> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;
+export declare const registerFilePicker: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;

package/lib/file-picker/file-picker.d.ts

@@ -0,0 +1,22 @@
+import { FoundationElement } from '@microsoft/fast-foundation';
+import type { Size } from '../enums';
+import { FormElementHelperText } from '../../shared/patterns';
+export declare type FileUploaderSize = Extract<Size, Size.Normal | Size.Expanded>;
+export declare class FilePicker extends FoundationElement {
+    #private;
+    get files(): File[];
+    label?: string;
+    maxFiles?: number;
+    maxFilesChanged(_oldValue: number, newValue: number): void;
+    maxFileSize: number;
+    maxFileSizeChanged(_oldValue: number, newValue: number): void;
+    accept?: string;
+    acceptChanged(_oldValue: string, newValue: string): void;
+    size?: FileUploaderSize;
+    private buttonTag;
+    constructor();
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+}
+export interface FilePicker extends FormElementHelperText {
+}

package/lib/file-picker/file-picker.template.d.ts

@@ -0,0 +1,4 @@
+import type { ViewTemplate } from '@microsoft/fast-element';
+import type { ElementDefinitionContext, FoundationElementDefinition } from '@microsoft/fast-foundation';
+import type { FilePicker } from './file-picker';
+export declare const FilePickerTemplate: (context: ElementDefinitionContext, definition: FoundationElementDefinition) => ViewTemplate<FilePicker>;

package/lib/file-picker/index.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/menu/menu.d.ts

@@ -11,4 +11,5 @@ export declare class Menu extends FastMenu {
     anchorChanged(prevAnchor: string, newAnchor: string): void;
     autoDismissChanged(): void;
     disconnectedCallback(): void;
+    actionItemsSlottedContent?: HTMLElement[];
 }

package/listbox/index.js

@@ -61,7 +61,7 @@ const ListboxTemplate = context => {
   }));
 };
 
-var css_248z = "/**\n * Do not edit directly\n * Generated on Tue, 25 Jul 2023 07:38:24 GMT\n */\n:host {\n  display: block;\n  inline-size: fit-content;\n}\n\n:host(:focus-within) {\n  outline: none;\n}\n\n.base {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  padding: 4px;\n  background-color: var(--_appearance-color-fill);\n  border-radius: 6px;\n  box-shadow: inset 0 0 0 1px var(--_appearance-color-outline);\n  contain: paint;\n  gap: 4px;\n}\n.base {\n  /* @cssprop [--vvd-listbox-accent-backdrop=var(--vvd-color-canvas)] */\n  --_connotation-color-backdrop: var(--vvd-listbox-accent-backdrop, var(--vvd-color-canvas));\n  /* @cssprop [--vvd-listbox-accent-intermediate=var(--vvd-color-neutral-500)] */\n  --_connotation-color-intermediate: var(--vvd-listbox-accent-intermediate, var(--vvd-color-neutral-500));\n  /* @cssprop [--vvd-listbox-accent-primary=var(--vvd-color-canvas-text)] */\n  --_connotation-color-primary: var(--vvd-listbox-accent-primary, var(--vvd-color-canvas-text));\n  /* @cssprop [--vvd-listbox-accent-soft=var(--vvd-color-neutral-100)] */\n  --_connotation-color-soft: var(--vvd-listbox-accent-soft, var(--vvd-color-neutral-100));\n}\n.base {\n  --_appearance-color-text: var(--vvd-color-canvas-text);\n  --_appearance-color-fill: var(--_connotation-color-backdrop);\n  --_appearance-color-outline: var(--_connotation-color-intermediate);\n}\n.base.appearance-ghost {\n  --_appearance-color-text: var(--_connotation-color-primary);\n  --_appearance-color-fill: transparent;\n  --_appearance-color-outline: transparent;\n}\n.base:where(:disabled, .disabled) {\n  --_appearance-color-text: var(--vvd-color-neutral-300);\n  --_appearance-color-fill: var(--vvd-color-neutral-100);\n  --_appearance-color-outline: var(--vvd-color-neutral-300);\n}\n.base:where(:disabled, .disabled).appearance-ghost {\n  --_appearance-color-text: var(--vvd-color-neutral-300);\n  --_appearance-color-fill: transparent;\n  --_appearance-color-outline: transparent;\n}\n\n.focus-indicator {\n  pointer-events: none;\n}\n:host(:not(:focus-within)) .focus-indicator {\n  display: none;\n}\n\n.base.disabled ::slotted([role=option]) {\n  --_option-appearance-color-text: var(--_appearance-color-outline);\n  cursor: not-allowed;\n  pointer-events: none;\n}";
+var css_248z = "/**\n * Do not edit directly\n * Generated on Thu, 03 Aug 2023 09:40:18 GMT\n */\n:host {\n  display: block;\n  inline-size: fit-content;\n}\n\n:host(:focus-within) {\n  outline: none;\n}\n\n.base {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  padding: 4px;\n  background-color: var(--_appearance-color-fill);\n  border-radius: 6px;\n  box-shadow: inset 0 0 0 1px var(--_appearance-color-outline);\n  contain: paint;\n  gap: 4px;\n}\n.base {\n  /* @cssprop [--vvd-listbox-accent-backdrop=var(--vvd-color-canvas)] */\n  --_connotation-color-backdrop: var(--vvd-listbox-accent-backdrop, var(--vvd-color-canvas));\n  /* @cssprop [--vvd-listbox-accent-intermediate=var(--vvd-color-neutral-500)] */\n  --_connotation-color-intermediate: var(--vvd-listbox-accent-intermediate, var(--vvd-color-neutral-500));\n  /* @cssprop [--vvd-listbox-accent-primary=var(--vvd-color-canvas-text)] */\n  --_connotation-color-primary: var(--vvd-listbox-accent-primary, var(--vvd-color-canvas-text));\n  /* @cssprop [--vvd-listbox-accent-soft=var(--vvd-color-neutral-100)] */\n  --_connotation-color-soft: var(--vvd-listbox-accent-soft, var(--vvd-color-neutral-100));\n}\n.base {\n  --_appearance-color-text: var(--vvd-color-canvas-text);\n  --_appearance-color-fill: var(--_connotation-color-backdrop);\n  --_appearance-color-outline: var(--_connotation-color-intermediate);\n}\n.base.appearance-ghost {\n  --_appearance-color-text: var(--_connotation-color-primary);\n  --_appearance-color-fill: transparent;\n  --_appearance-color-outline: transparent;\n}\n.base:where(:disabled, .disabled) {\n  --_appearance-color-text: var(--vvd-color-neutral-300);\n  --_appearance-color-fill: var(--vvd-color-neutral-100);\n  --_appearance-color-outline: var(--vvd-color-neutral-300);\n}\n.base:where(:disabled, .disabled).appearance-ghost {\n  --_appearance-color-text: var(--vvd-color-neutral-300);\n  --_appearance-color-fill: transparent;\n  --_appearance-color-outline: transparent;\n}\n\n.focus-indicator {\n  pointer-events: none;\n}\n:host(:not(:focus-within)) .focus-indicator {\n  display: none;\n}\n\n.base.disabled ::slotted([role=option]) {\n  --_option-appearance-color-text: var(--_appearance-color-outline);\n  cursor: not-allowed;\n  pointer-events: none;\n}";
 
 const listboxDefinition = Listbox.compose({
   baseName: 'listbox',

package/menu/index.js

@@ -1,4 +1,4 @@
-import { r as registerMenu } from '../shared/definition29.js';
+import { r as registerMenu } from '../shared/definition30.js';
 import '../shared/index.js';
 import '../shared/definition20.js';
 import '../shared/definition7.js';
@@ -24,7 +24,7 @@ import '../shared/ref.js';
 import '../shared/focus2.js';
 import '../shared/definition8.js';
 import '../shared/es.object.assign.js';
-import '../shared/definition30.js';
+import '../shared/definition31.js';
 import '../shared/direction.js';
 import '../shared/slotted.js';
 import '../shared/node-observation.js';

package/menu-item/index.js

@@ -1,4 +1,4 @@
-import { b as registerMenuItem } from '../shared/definition30.js';
+import { b as registerMenuItem } from '../shared/definition31.js';
 import '../shared/index.js';
 import '../shared/definition3.js';
 import '../shared/icon.js';

package/nav/index.js

@@ -1,4 +1,4 @@
-import { r as registerNav } from '../shared/definition31.js';
+import { r as registerNav } from '../shared/definition32.js';
 import '../shared/index.js';
 
 registerNav();

package/nav-disclosure/index.js

@@ -1,4 +1,4 @@
-import { r as registerNavDisclosure } from '../shared/definition32.js';
+import { r as registerNavDisclosure } from '../shared/definition33.js';
 import '../shared/index.js';
 import '../shared/definition3.js';
 import '../shared/icon.js';

package/nav-item/index.js

@@ -1,4 +1,4 @@
-import { r as registerNavItem } from '../shared/definition33.js';
+import { r as registerNavItem } from '../shared/definition34.js';
 import '../shared/index.js';
 import '../shared/definition3.js';
 import '../shared/icon.js';

package/note/index.js

@@ -1,4 +1,4 @@
-import { r as registerNote } from '../shared/definition34.js';
+import { r as registerNote } from '../shared/definition35.js';
 import '../shared/index.js';
 import '../shared/definition3.js';
 import '../shared/icon.js';

package/number-field/index.js

@@ -1,4 +1,4 @@
-import { r as registerNumberField } from '../shared/definition35.js';
+import { r as registerNumberField } from '../shared/definition36.js';
 import '../shared/index.js';
 import '../shared/definition7.js';
 import '../shared/definition3.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vonage/vivid",
-  "version": "3.26.0",
+  "version": "3.27.0",
   "type": "module",
   "module": "./index.js",
   "main": "./index.js",
@@ -23,6 +23,7 @@
     "@microsoft/fast-web-utilities": "5.4.1",
     "ramda": "0.28.0",
     "dialog-polyfill": "0.5.6",
+    "dropzone": "6.0.0-beta.2",
     "@floating-ui/dom": "1.2.0"
   },
   "peerDependencies": {}

package/pagination/index.js

@@ -1,4 +1,4 @@
-import { r as registerPagination } from '../shared/definition36.js';
+import { r as registerPagination } from '../shared/definition37.js';
 import '../shared/definition7.js';
 import '../shared/index.js';
 import '../shared/definition3.js';

package/progress/index.js

@@ -1,4 +1,4 @@
-import { r as registerProgress } from '../shared/definition37.js';
+import { r as registerProgress } from '../shared/definition38.js';
 import '../shared/index.js';
 import '../shared/base-progress.js';
 import '../shared/when.js';

package/radio/index.js

@@ -1,4 +1,4 @@
-import { r as registerRadio } from '../shared/definition38.js';
+import { r as registerRadio } from '../shared/definition39.js';
 import '../shared/index.js';
 import '../shared/definition4.js';
 import '../shared/focus.js';

package/radio-group/index.js

@@ -1,4 +1,4 @@
-import { r as registerRadioGroup } from '../shared/definition39.js';
+import { r as registerRadioGroup } from '../shared/definition40.js';
 import '../shared/index.js';
 import '../shared/direction.js';
 import '../shared/key-codes.js';

package/select/index.js

@@ -1,4 +1,4 @@
-import { r as registerSelect } from '../shared/definition40.js';
+import { r as registerSelect } from '../shared/definition41.js';
 import '../shared/index.js';
 import '../shared/definition4.js';
 import '../shared/focus.js';

package/shared/definition.js

@@ -187,7 +187,7 @@ __decorate([
     observable
 ], Accordion$1.prototype, "accordionItems", void 0);
 
-var css_248z = "/**\n * Do not edit directly\n * Generated on Tue, 25 Jul 2023 07:38:24 GMT\n */\n.base {\n  display: flex;\n  box-sizing: border-box;\n  flex-direction: column;\n}\n\n::slotted(:not(:only-of-type)) {\n  border-bottom: 1px solid var(--vvd-color-neutral-200);\n}";
+var css_248z = "/**\n * Do not edit directly\n * Generated on Thu, 03 Aug 2023 09:40:18 GMT\n */\n.base {\n  display: flex;\n  box-sizing: border-box;\n  flex-direction: column;\n}\n\n::slotted(:not(:only-of-type)) {\n  border-bottom: 1px solid var(--vvd-color-neutral-200);\n}";
 
 class Accordion extends Accordion$1 {
   constructor() {