@vertexvis/ui-react 0.1.5-canary.6 → 1.0.0-testing.0

package/dist/bundle.esm.js

@@ -1,266 +1,423 @@
-import { __assign, __extends, __rest } from 'tslib';
-import React, { createElement } from 'react';
-import 'react-dom';
-import { defineCustomElements } from '@vertexvis/ui/loader';
+'use client';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+import { VertexAutoResizeTextarea as VertexAutoResizeTextarea$1, defineCustomElement } from '@vertexvis/ui/dist/components/vertex-auto-resize-textarea.js';
+import { VertexAvatarGroup as VertexAvatarGroup$1, defineCustomElement as defineCustomElement$2 } from '@vertexvis/ui/dist/components/vertex-avatar-group.js';
+import { VertexAvatar as VertexAvatar$1, defineCustomElement as defineCustomElement$1 } from '@vertexvis/ui/dist/components/vertex-avatar.js';
+import { VertexBadge as VertexBadge$1, defineCustomElement as defineCustomElement$3 } from '@vertexvis/ui/dist/components/vertex-badge.js';
+import { VertexBanner as VertexBanner$1, defineCustomElement as defineCustomElement$4 } from '@vertexvis/ui/dist/components/vertex-banner.js';
+import { VertexButton as VertexButton$1, defineCustomElement as defineCustomElement$5 } from '@vertexvis/ui/dist/components/vertex-button.js';
+import { VertexCardGroup as VertexCardGroup$1, defineCustomElement as defineCustomElement$7 } from '@vertexvis/ui/dist/components/vertex-card-group.js';
+import { VertexCard as VertexCard$1, defineCustomElement as defineCustomElement$6 } from '@vertexvis/ui/dist/components/vertex-card.js';
+import { VertexChip as VertexChip$1, defineCustomElement as defineCustomElement$8 } from '@vertexvis/ui/dist/components/vertex-chip.js';
+import { VertexClickToEditTextfield as VertexClickToEditTextfield$1, defineCustomElement as defineCustomElement$9 } from '@vertexvis/ui/dist/components/vertex-click-to-edit-textfield.js';
+import { VertexCollapsible as VertexCollapsible$1, defineCustomElement as defineCustomElement$a } from '@vertexvis/ui/dist/components/vertex-collapsible.js';
+import { VertexColorCirclePicker as VertexColorCirclePicker$1, defineCustomElement as defineCustomElement$b } from '@vertexvis/ui/dist/components/vertex-color-circle-picker.js';
+import { VertexColorPicker as VertexColorPicker$1, defineCustomElement as defineCustomElement$c } from '@vertexvis/ui/dist/components/vertex-color-picker.js';
+import { VertexColorSwatch as VertexColorSwatch$1, defineCustomElement as defineCustomElement$d } from '@vertexvis/ui/dist/components/vertex-color-swatch.js';
+import { VertexContextMenu as VertexContextMenu$1, defineCustomElement as defineCustomElement$e } from '@vertexvis/ui/dist/components/vertex-context-menu.js';
+import { VertexDialog as VertexDialog$1, defineCustomElement as defineCustomElement$f } from '@vertexvis/ui/dist/components/vertex-dialog.js';
+import { VertexDraggablePopover as VertexDraggablePopover$1, defineCustomElement as defineCustomElement$g } from '@vertexvis/ui/dist/components/vertex-draggable-popover.js';
+import { VertexDropdownMenu as VertexDropdownMenu$1, defineCustomElement as defineCustomElement$h } from '@vertexvis/ui/dist/components/vertex-dropdown-menu.js';
+import { VertexExpandable as VertexExpandable$1, defineCustomElement as defineCustomElement$i } from '@vertexvis/ui/dist/components/vertex-expandable.js';
+import { VertexHelpTooltip as VertexHelpTooltip$1, defineCustomElement as defineCustomElement$j } from '@vertexvis/ui/dist/components/vertex-help-tooltip.js';
+import { VertexIconButton as VertexIconButton$1, defineCustomElement as defineCustomElement$l } from '@vertexvis/ui/dist/components/vertex-icon-button.js';
+import { VertexIcon as VertexIcon$1, defineCustomElement as defineCustomElement$k } from '@vertexvis/ui/dist/components/vertex-icon.js';
+import { VertexLogoLoading as VertexLogoLoading$1, defineCustomElement as defineCustomElement$m } from '@vertexvis/ui/dist/components/vertex-logo-loading.js';
+import { VertexMenuDivider as VertexMenuDivider$1, defineCustomElement as defineCustomElement$o } from '@vertexvis/ui/dist/components/vertex-menu-divider.js';
+import { VertexMenuItem as VertexMenuItem$1, defineCustomElement as defineCustomElement$p } from '@vertexvis/ui/dist/components/vertex-menu-item.js';
+import { VertexMenu as VertexMenu$1, defineCustomElement as defineCustomElement$n } from '@vertexvis/ui/dist/components/vertex-menu.js';
+import { VertexPopover as VertexPopover$1, defineCustomElement as defineCustomElement$q } from '@vertexvis/ui/dist/components/vertex-popover.js';
+import { VertexRadioGroup as VertexRadioGroup$1, defineCustomElement as defineCustomElement$s } from '@vertexvis/ui/dist/components/vertex-radio-group.js';
+import { VertexRadio as VertexRadio$1, defineCustomElement as defineCustomElement$r } from '@vertexvis/ui/dist/components/vertex-radio.js';
+import { VertexResizable as VertexResizable$1, defineCustomElement as defineCustomElement$t } from '@vertexvis/ui/dist/components/vertex-resizable.js';
+import { VertexResultList as VertexResultList$1, defineCustomElement as defineCustomElement$u } from '@vertexvis/ui/dist/components/vertex-result-list.js';
+import { VertexSearchBar as VertexSearchBar$1, defineCustomElement as defineCustomElement$v } from '@vertexvis/ui/dist/components/vertex-search-bar.js';
+import { VertexSelect as VertexSelect$1, defineCustomElement as defineCustomElement$w } from '@vertexvis/ui/dist/components/vertex-select.js';
+import { VertexSlider as VertexSlider$1, defineCustomElement as defineCustomElement$x } from '@vertexvis/ui/dist/components/vertex-slider.js';
+import { VertexSpinner as VertexSpinner$1, defineCustomElement as defineCustomElement$y } from '@vertexvis/ui/dist/components/vertex-spinner.js';
+import { VertexTab as VertexTab$1, defineCustomElement as defineCustomElement$z } from '@vertexvis/ui/dist/components/vertex-tab.js';
+import { VertexTabs as VertexTabs$1, defineCustomElement as defineCustomElement$A } from '@vertexvis/ui/dist/components/vertex-tabs.js';
+import { VertexTextfield as VertexTextfield$1, defineCustomElement as defineCustomElement$B } from '@vertexvis/ui/dist/components/vertex-textfield.js';
+import { VertexToast as VertexToast$1, defineCustomElement as defineCustomElement$C } from '@vertexvis/ui/dist/components/vertex-toast.js';
+import { VertexToggle as VertexToggle$1, defineCustomElement as defineCustomElement$D } from '@vertexvis/ui/dist/components/vertex-toggle.js';
+import { VertexTooltip as VertexTooltip$1, defineCustomElement as defineCustomElement$E } from '@vertexvis/ui/dist/components/vertex-tooltip.js';
 export * from '@vertexvis/ui/loader';
 
-var dashToPascalCase = function (str) {
-    return str
-        .toLowerCase()
-        .split('-')
-        .map(function (segment) { return segment.charAt(0).toUpperCase() + segment.slice(1); })
-        .join('');
-};
-var camelToDashCase = function (str) { return str.replace(/([A-Z])/g, function (m) { return "-".concat(m[0].toLowerCase()); }); };
-
-var attachProps = function (node, newProps, oldProps) {
-    if (oldProps === void 0) { oldProps = {}; }
-    // some test frameworks don't render DOM elements, so we test here to make sure we are dealing with DOM first
-    if (node instanceof Element) {
-        // add any classes in className to the class list
-        var className = getClassName(node.classList, newProps, oldProps);
-        if (className !== '') {
-            node.className = className;
-        }
-        Object.keys(newProps).forEach(function (name) {
-            if (name === 'children' ||
-                name === 'style' ||
-                name === 'ref' ||
-                name === 'class' ||
-                name === 'className' ||
-                name === 'forwardedRef') {
-                return;
-            }
-            if (name.indexOf('on') === 0 && name[2] === name[2].toUpperCase()) {
-                var eventName = name.substring(2);
-                var eventNameLc = eventName[0].toLowerCase() + eventName.substring(1);
-                if (!isCoveredByReact(eventNameLc)) {
-                    syncEvent(node, eventNameLc, newProps[name]);
-                }
-            }
-            else {
-                node[name] = newProps[name];
-                var propType = typeof newProps[name];
-                if (propType === 'string') {
-                    node.setAttribute(camelToDashCase(name), newProps[name]);
-                }
-            }
-        });
-    }
-};
-var getClassName = function (classList, newProps, oldProps) {
-    var newClassProp = newProps.className || newProps.class;
-    var oldClassProp = oldProps.className || oldProps.class;
-    // map the classes to Maps for performance
-    var currentClasses = arrayToMap(classList);
-    var incomingPropClasses = arrayToMap(newClassProp ? newClassProp.split(' ') : []);
-    var oldPropClasses = arrayToMap(oldClassProp ? oldClassProp.split(' ') : []);
-    var finalClassNames = [];
-    // loop through each of the current classes on the component
-    // to see if it should be a part of the classNames added
-    currentClasses.forEach(function (currentClass) {
-        if (incomingPropClasses.has(currentClass)) {
-            // add it as its already included in classnames coming in from newProps
-            finalClassNames.push(currentClass);
-            incomingPropClasses.delete(currentClass);
-        }
-        else if (!oldPropClasses.has(currentClass)) {
-            // add it as it has NOT been removed by user
-            finalClassNames.push(currentClass);
-        }
-    });
-    incomingPropClasses.forEach(function (s) { return finalClassNames.push(s); });
-    return finalClassNames.join(' ');
-};
-/**
- * Transforms a React event name to a browser event name.
- */
-var transformReactEventName = function (eventNameSuffix) {
-    switch (eventNameSuffix) {
-        case 'doubleclick':
-            return 'dblclick';
-    }
-    return eventNameSuffix;
-};
-/**
- * Checks if an event is supported in the current execution environment.
- * @license Modernizr 3.0.0pre (Custom Build) | MIT
- */
-var isCoveredByReact = function (eventNameSuffix) {
-    if (typeof document === 'undefined') {
-        return true;
-    }
-    else {
-        var eventName = 'on' + transformReactEventName(eventNameSuffix);
-        var isSupported = eventName in document;
-        if (!isSupported) {
-            var element = document.createElement('div');
-            element.setAttribute(eventName, 'return;');
-            isSupported = typeof element[eventName] === 'function';
-        }
-        return isSupported;
-    }
-};
-var syncEvent = function (node, eventName, newEventHandler) {
-    var eventStore = node.__events || (node.__events = {});
-    var oldEventHandler = eventStore[eventName];
-    // Remove old listener so they don't double up.
-    if (oldEventHandler) {
-        node.removeEventListener(eventName, oldEventHandler);
-    }
-    // Bind new listener.
-    node.addEventListener(eventName, (eventStore[eventName] = function handler(e) {
-        if (newEventHandler) {
-            newEventHandler.call(this, e);
-        }
-    }));
-};
-var arrayToMap = function (arr) {
-    var map = new Map();
-    arr.forEach(function (s) { return map.set(s, s); });
-    return map;
-};
-
-var setRef = function (ref, value) {
-    if (typeof ref === 'function') {
-        ref(value);
-    }
-    else if (ref != null) {
-        // Cast as a MutableRef so we can assign current
-        ref.current = value;
-    }
-};
-var mergeRefs = function () {
-    var refs = [];
-    for (var _i = 0; _i < arguments.length; _i++) {
-        refs[_i] = arguments[_i];
-    }
-    return function (value) {
-        refs.forEach(function (ref) {
-            setRef(ref, value);
-        });
-    };
-};
-var createForwardRef = function (ReactComponent, displayName) {
-    var forwardRef = function (props, ref) {
-        return React.createElement(ReactComponent, __assign({}, props, { forwardedRef: ref }));
-    };
-    forwardRef.displayName = displayName;
-    return React.forwardRef(forwardRef);
-};
-
-var createReactComponent = function (tagName, ReactComponentContext, manipulatePropsFunction, defineCustomElement) {
-    if (defineCustomElement !== undefined) {
-        defineCustomElement();
-    }
-    var displayName = dashToPascalCase(tagName);
-    var ReactComponent = /** @class */ (function (_super) {
-        __extends(class_1, _super);
-        function class_1(props) {
-            var _this = _super.call(this, props) || this;
-            _this.setComponentElRef = function (element) {
-                _this.componentEl = element;
-            };
-            return _this;
-        }
-        class_1.prototype.componentDidMount = function () {
-            this.componentDidUpdate(this.props);
-        };
-        class_1.prototype.componentDidUpdate = function (prevProps) {
-            attachProps(this.componentEl, this.props, prevProps);
-        };
-        class_1.prototype.render = function () {
-            var _a = this.props, children = _a.children, forwardedRef = _a.forwardedRef, style = _a.style; _a.className; _a.ref; var cProps = __rest(_a, ["children", "forwardedRef", "style", "className", "ref"]);
-            var propsToPass = Object.keys(cProps).reduce(function (acc, name) {
-                var value = cProps[name];
-                if (name.indexOf('on') === 0 && name[2] === name[2].toUpperCase()) {
-                    var eventName = name.substring(2).toLowerCase();
-                    if (typeof document !== 'undefined' && isCoveredByReact(eventName)) {
-                        acc[name] = value;
-                    }
-                }
-                else {
-                    // we should only render strings, booleans, and numbers as attrs in html.
-                    // objects, functions, arrays etc get synced via properties on mount.
-                    var type = typeof value;
-                    if (type === 'string' || type === 'boolean' || type === 'number') {
-                        acc[camelToDashCase(name)] = value;
-                    }
-                }
-                return acc;
-            }, {});
-            if (manipulatePropsFunction) {
-                propsToPass = manipulatePropsFunction(this.props, propsToPass);
-            }
-            var newProps = __assign(__assign({}, propsToPass), { ref: mergeRefs(forwardedRef, this.setComponentElRef), style: style });
-            /**
-             * We use createElement here instead of
-             * React.createElement to work around a
-             * bug in Vite (https://github.com/vitejs/vite/issues/6104).
-             * React.createElement causes all elements to be rendered
-             * as <tagname> instead of the actual Web Component.
-             */
-            return createElement(tagName, newProps, children);
-        };
-        Object.defineProperty(class_1, "displayName", {
-            get: function () {
-                return displayName;
-            },
-            enumerable: false,
-            configurable: true
-        });
-        return class_1;
-    }(React.Component));
-    // If context was passed to createReactComponent then conditionally add it to the Component Class
-    if (ReactComponentContext) {
-        ReactComponent.contextType = ReactComponentContext;
-    }
-    return createForwardRef(ReactComponent, displayName);
-};
-
-/* eslint-disable */
-defineCustomElements();
-var VertexAutoResizeTextarea = /*@__PURE__*/ createReactComponent('vertex-auto-resize-textarea');
-var VertexAvatar = /*@__PURE__*/ createReactComponent('vertex-avatar');
-var VertexAvatarGroup = /*@__PURE__*/ createReactComponent('vertex-avatar-group');
-var VertexBadge = /*@__PURE__*/ createReactComponent('vertex-badge');
-var VertexBanner = /*@__PURE__*/ createReactComponent('vertex-banner');
-var VertexButton = /*@__PURE__*/ createReactComponent('vertex-button');
-var VertexCard = /*@__PURE__*/ createReactComponent('vertex-card');
-var VertexCardGroup = /*@__PURE__*/ createReactComponent('vertex-card-group');
-var VertexChip = /*@__PURE__*/ createReactComponent('vertex-chip');
-var VertexClickToEditTextfield = /*@__PURE__*/ createReactComponent('vertex-click-to-edit-textfield');
-var VertexCollapsible = /*@__PURE__*/ createReactComponent('vertex-collapsible');
-var VertexColorCirclePicker = /*@__PURE__*/ createReactComponent('vertex-color-circle-picker');
-var VertexColorPicker = /*@__PURE__*/ createReactComponent('vertex-color-picker');
-var VertexColorSwatch = /*@__PURE__*/ createReactComponent('vertex-color-swatch');
-var VertexContextMenu = /*@__PURE__*/ createReactComponent('vertex-context-menu');
-var VertexDialog = /*@__PURE__*/ createReactComponent('vertex-dialog');
-var VertexDraggablePopover = /*@__PURE__*/ createReactComponent('vertex-draggable-popover');
-var VertexDropdownMenu = /*@__PURE__*/ createReactComponent('vertex-dropdown-menu');
-var VertexExpandable = /*@__PURE__*/ createReactComponent('vertex-expandable');
-var VertexHelpTooltip = /*@__PURE__*/ createReactComponent('vertex-help-tooltip');
-var VertexIcon = /*@__PURE__*/ createReactComponent('vertex-icon');
-var VertexIconButton = /*@__PURE__*/ createReactComponent('vertex-icon-button');
-var VertexLogoLoading = /*@__PURE__*/ createReactComponent('vertex-logo-loading');
-var VertexMenu = /*@__PURE__*/ createReactComponent('vertex-menu');
-var VertexMenuDivider = /*@__PURE__*/ createReactComponent('vertex-menu-divider');
-var VertexMenuItem = /*@__PURE__*/ createReactComponent('vertex-menu-item');
-var VertexPopover = /*@__PURE__*/ createReactComponent('vertex-popover');
-var VertexRadio = /*@__PURE__*/ createReactComponent('vertex-radio');
-var VertexRadioGroup = /*@__PURE__*/ createReactComponent('vertex-radio-group');
-var VertexResizable = /*@__PURE__*/ createReactComponent('vertex-resizable');
-var VertexResultList = /*@__PURE__*/ createReactComponent('vertex-result-list');
-var VertexSearchBar = /*@__PURE__*/ createReactComponent('vertex-search-bar');
-var VertexSelect = /*@__PURE__*/ createReactComponent('vertex-select');
-var VertexSlider = /*@__PURE__*/ createReactComponent('vertex-slider');
-var VertexSpinner = /*@__PURE__*/ createReactComponent('vertex-spinner');
-var VertexTab = /*@__PURE__*/ createReactComponent('vertex-tab');
-var VertexTabs = /*@__PURE__*/ createReactComponent('vertex-tabs');
-var VertexTextfield = /*@__PURE__*/ createReactComponent('vertex-textfield');
-var VertexToast = /*@__PURE__*/ createReactComponent('vertex-toast');
-var VertexToggle = /*@__PURE__*/ createReactComponent('vertex-toggle');
-var VertexTooltip = /*@__PURE__*/ createReactComponent('vertex-tooltip');
+const VertexAutoResizeTextarea = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-auto-resize-textarea',
+    elementClass: VertexAutoResizeTextarea$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {},
+    defineCustomElement: defineCustomElement
+});
+const VertexAvatar = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-avatar',
+    elementClass: VertexAvatar$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {},
+    defineCustomElement: defineCustomElement$1
+});
+const VertexAvatarGroup = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-avatar-group',
+    elementClass: VertexAvatarGroup$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {},
+    defineCustomElement: defineCustomElement$2
+});
+const VertexBadge = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-badge',
+    elementClass: VertexBadge$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {},
+    defineCustomElement: defineCustomElement$3
+});
+const VertexBanner = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-banner',
+    elementClass: VertexBanner$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onClosed: 'closed' },
+    defineCustomElement: defineCustomElement$4
+});
+const VertexButton = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-button',
+    elementClass: VertexButton$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {},
+    defineCustomElement: defineCustomElement$5
+});
+const VertexCard = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-card',
+    elementClass: VertexCard$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onContentClick: 'contentClick' },
+    defineCustomElement: defineCustomElement$6
+});
+const VertexCardGroup = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-card-group',
+    elementClass: VertexCardGroup$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {},
+    defineCustomElement: defineCustomElement$7
+});
+const VertexChip = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-chip',
+    elementClass: VertexChip$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {},
+    defineCustomElement: defineCustomElement$8
+});
+const VertexClickToEditTextfield = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-click-to-edit-textfield',
+    elementClass: VertexClickToEditTextfield$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {
+        onInputFocus: 'inputFocus',
+        onInputBlur: 'inputBlur',
+        onInputInput: 'inputInput',
+        onInputChange: 'inputChange',
+        onInputSubmit: 'inputSubmit'
+    },
+    defineCustomElement: defineCustomElement$9
+});
+const VertexCollapsible = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-collapsible',
+    elementClass: VertexCollapsible$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {},
+    defineCustomElement: defineCustomElement$a
+});
+const VertexColorCirclePicker = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-color-circle-picker',
+    elementClass: VertexColorCirclePicker$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onSelectionChanged: 'selectionChanged' },
+    defineCustomElement: defineCustomElement$b
+});
+const VertexColorPicker = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-color-picker',
+    elementClass: VertexColorPicker$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {
+        onValueInput: 'valueInput',
+        onValueChanged: 'valueChanged'
+    },
+    defineCustomElement: defineCustomElement$c
+});
+const VertexColorSwatch = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-color-swatch',
+    elementClass: VertexColorSwatch$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {},
+    defineCustomElement: defineCustomElement$d
+});
+const VertexContextMenu = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-context-menu',
+    elementClass: VertexContextMenu$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {
+        onMenuOpened: 'menuOpened',
+        onMenuClosed: 'menuClosed'
+    },
+    defineCustomElement: defineCustomElement$e
+});
+const VertexDialog = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-dialog',
+    elementClass: VertexDialog$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {
+        onBackdropClick: 'backdropClick',
+        onClosed: 'closed'
+    },
+    defineCustomElement: defineCustomElement$f
+});
+const VertexDraggablePopover = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-draggable-popover',
+    elementClass: VertexDraggablePopover$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onPositionChanged: 'positionChanged' },
+    defineCustomElement: defineCustomElement$g
+});
+const VertexDropdownMenu = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-dropdown-menu',
+    elementClass: VertexDropdownMenu$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {
+        onMenuOpened: 'menuOpened',
+        onMenuClosed: 'menuClosed'
+    },
+    defineCustomElement: defineCustomElement$h
+});
+const VertexExpandable = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-expandable',
+    elementClass: VertexExpandable$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {
+        onExpand: 'expand',
+        onCollapse: 'collapse'
+    },
+    defineCustomElement: defineCustomElement$i
+});
+const VertexHelpTooltip = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-help-tooltip',
+    elementClass: VertexHelpTooltip$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {
+        onMenuOpened: 'menuOpened',
+        onMenuClosed: 'menuClosed'
+    },
+    defineCustomElement: defineCustomElement$j
+});
+const VertexIcon = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-icon',
+    elementClass: VertexIcon$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {},
+    defineCustomElement: defineCustomElement$k
+});
+const VertexIconButton = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-icon-button',
+    elementClass: VertexIconButton$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {},
+    defineCustomElement: defineCustomElement$l
+});
+const VertexLogoLoading = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-logo-loading',
+    elementClass: VertexLogoLoading$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {},
+    defineCustomElement: defineCustomElement$m
+});
+const VertexMenu = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-menu',
+    elementClass: VertexMenu$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onMenuClosed: 'menuClosed' },
+    defineCustomElement: defineCustomElement$n
+});
+const VertexMenuDivider = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-menu-divider',
+    elementClass: VertexMenuDivider$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {},
+    defineCustomElement: defineCustomElement$o
+});
+const VertexMenuItem = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-menu-item',
+    elementClass: VertexMenuItem$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {},
+    defineCustomElement: defineCustomElement$p
+});
+const VertexPopover = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-popover',
+    elementClass: VertexPopover$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onDismissed: 'dismissed' },
+    defineCustomElement: defineCustomElement$q
+});
+const VertexRadio = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-radio',
+    elementClass: VertexRadio$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onValueChanged: 'valueChanged' },
+    defineCustomElement: defineCustomElement$r
+});
+const VertexRadioGroup = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-radio-group',
+    elementClass: VertexRadioGroup$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onValueChanged: 'valueChanged' },
+    defineCustomElement: defineCustomElement$s
+});
+const VertexResizable = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-resizable',
+    elementClass: VertexResizable$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {
+        onResizeStart: 'resizeStart',
+        onResizeEnd: 'resizeEnd'
+    },
+    defineCustomElement: defineCustomElement$t
+});
+const VertexResultList = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-result-list',
+    elementClass: VertexResultList$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {
+        onEnterPressed: 'enterPressed',
+        onResultClick: 'resultClick'
+    },
+    defineCustomElement: defineCustomElement$u
+});
+const VertexSearchBar = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-search-bar',
+    elementClass: VertexSearchBar$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {
+        onSearchChanged: 'searchChanged',
+        onInputChanged: 'inputChanged',
+        onResultReplaced: 'resultReplaced',
+        onInputFocus: 'inputFocus',
+        onInputBlur: 'inputBlur'
+    },
+    defineCustomElement: defineCustomElement$v
+});
+const VertexSelect = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-select',
+    elementClass: VertexSelect$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onOptionChanged: 'optionChanged' },
+    defineCustomElement: defineCustomElement$w
+});
+const VertexSlider = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-slider',
+    elementClass: VertexSlider$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {
+        onValueChange: 'valueChange',
+        onValueInput: 'valueInput'
+    },
+    defineCustomElement: defineCustomElement$x
+});
+const VertexSpinner = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-spinner',
+    elementClass: VertexSpinner$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {},
+    defineCustomElement: defineCustomElement$y
+});
+const VertexTab = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-tab',
+    elementClass: VertexTab$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onTabClick: 'tabClick' },
+    defineCustomElement: defineCustomElement$z
+});
+const VertexTabs = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-tabs',
+    elementClass: VertexTabs$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onSelectedTabChanged: 'selectedTabChanged' },
+    defineCustomElement: defineCustomElement$A
+});
+const VertexTextfield = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-textfield',
+    elementClass: VertexTextfield$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {
+        onInputFocus: 'inputFocus',
+        onInputBlur: 'inputBlur',
+        onInputInput: 'inputInput',
+        onInputChange: 'inputChange',
+        onTextFieldKeyDown: 'textFieldKeyDown',
+        onInputAutofill: 'inputAutofill'
+    },
+    defineCustomElement: defineCustomElement$B
+});
+const VertexToast = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-toast',
+    elementClass: VertexToast$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onClosed: 'closed' },
+    defineCustomElement: defineCustomElement$C
+});
+const VertexToggle = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-toggle',
+    elementClass: VertexToggle$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onValueChanged: 'valueChanged' },
+    defineCustomElement: defineCustomElement$D
+});
+const VertexTooltip = /*@__PURE__*/ createComponent({
+    tagName: 'vertex-tooltip',
+    elementClass: VertexTooltip$1,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {},
+    defineCustomElement: defineCustomElement$E
+});
 
 export { VertexAutoResizeTextarea, VertexAvatar, VertexAvatarGroup, VertexBadge, VertexBanner, VertexButton, VertexCard, VertexCardGroup, VertexChip, VertexClickToEditTextfield, VertexCollapsible, VertexColorCirclePicker, VertexColorPicker, VertexColorSwatch, VertexContextMenu, VertexDialog, VertexDraggablePopover, VertexDropdownMenu, VertexExpandable, VertexHelpTooltip, VertexIcon, VertexIconButton, VertexLogoLoading, VertexMenu, VertexMenuDivider, VertexMenuItem, VertexPopover, VertexRadio, VertexRadioGroup, VertexResizable, VertexResultList, VertexSearchBar, VertexSelect, VertexSlider, VertexSpinner, VertexTab, VertexTabs, VertexTextfield, VertexToast, VertexToggle, VertexTooltip };
 //# sourceMappingURL=bundle.esm.js.map