@vertexvis/ui 0.1.0-testing.3 → 0.1.0-testing.5

package/dist/cjs/badge-d39ac1fc.js

@@ -0,0 +1,23 @@
+'use strict';
+
+const index = require('./index-6a92256c.js');
+const index$1 = require('./index-e1b40fa6.js');
+
+const badgeCss = ".string-overlay{width:100%;line-height:1.0rem;margin-left:5px;margin-right:5px;border-radius:10px;font-size:var(--vertex-ui-text-xxs)}.string-overlay.primary{color:var(--vertex-ui-white);background-color:var(--vertex-ui-blue-600)}.string-overlay.secondary{color:var(--vertex-ui-black);background-color:var(--vertex-ui-neutral-300)}";
+
+const Badge = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.badgeText = undefined;
+    this.badgeColor = 'primary';
+  }
+  render() {
+    return (index.h(index.Host, null, index.h("div", { class: index$1.classnames('string-overlay', {
+        primary: this.badgeColor === 'primary',
+        secondary: this.badgeColor === 'secondary',
+      }) }, this.badgeText)));
+  }
+};
+Badge.style = badgeCss;
+
+exports.Badge = Badge;

package/dist/cjs/components.cjs.js

@@ -88,7 +88,7 @@ const patchDynamicImport = (base, orgScriptElm) => {
 };
 
 patchBrowser().then(options => {
-  return index.bootstrapLazy([["vertex-click-to-edit-textfield.cjs",[[6,"vertex-click-to-edit-textfield",{"placeholder":[1],"fontSize":[1,"font-size"],"disabled":[516],"multiline":[4],"minRows":[2,"min-rows"],"maxRows":[2,"max-rows"],"value":[1032],"autoFocus":[4,"auto-focus"],"editing":[1540],"hasError":[4,"has-error"]}]]],["vertex-collapsible.cjs",[[1,"vertex-collapsible",{"label":[1],"open":[1540]}]]],["vertex-context-menu.cjs",[[1,"vertex-context-menu",{"targetSelector":[1,"target-selector"],"animated":[4],"position":[32],"open":[32]}]]],["vertex-dialog.cjs",[[1,"vertex-dialog",{"open":[1540],"fullscreen":[4],"resizable":[4],"width":[32],"height":[32],"minWidth":[32],"minHeight":[32],"maxWidth":[32],"maxHeight":[32],"isResizing":[32]},[[4,"keydown","keyDownListener"]]]]],["vertex-draggable-popover.cjs",[[1,"vertex-draggable-popover",{"position":[1],"boundarySelector":[1,"boundary-selector"],"boundaryPadding":[2,"boundary-padding"],"anchorPosition":[32],"lastPosition":[32],"dragging":[32]}]]],["vertex-dropdown-menu.cjs",[[1,"vertex-dropdown-menu",{"animated":[4],"placement":[1],"open":[32]}]]],["vertex-help-tooltip.cjs",[[1,"vertex-help-tooltip",{"animated":[4],"placement":[1],"open":[32]}]]],["vertex-search-bar.cjs",[[6,"vertex-search-bar",{"variant":[1],"resultItems":[16],"triggerCharacters":[16],"triggerCharacter":[1,"trigger-character"],"breakCharacters":[16],"debounce":[2],"placeholder":[1],"placement":[1],"cursorPosition":[32],"open":[32],"triggerKey":[32],"triggerRange":[32],"replaceTriggeredValue":[64],"getEditableContent":[64]}]]],["vertex-select.cjs",[[1,"vertex-select",{"value":[513],"placeholder":[513],"disabled":[516],"animated":[4],"resizeObserverFactory":[16],"open":[32],"position":[32],"displayValue":[32]}]]],["vertex-slider.cjs",[[1,"vertex-slider",{"min":[2],"max":[2],"valueLabelDisplay":[1,"value-label-display"],"step":[8],"size":[1],"value":[1026],"disabled":[4]}]]],["vertex-toast.cjs",[[1,"vertex-toast",{"content":[1],"placement":[1],"duration":[2],"animated":[4],"open":[4],"type":[1],"isOpen":[32]}]]],["vertex-color-circle-picker.cjs",[[1,"vertex-color-circle-picker",{"colors":[1],"supplementalColors":[1,"supplemental-colors"],"theme":[513],"lightenPercentage":[2,"lighten-percentage"],"darkenPercentage":[2,"darken-percentage"],"selected":[1537],"direction":[1]}]]],["vertex-color-picker.cjs",[[1,"vertex-color-picker",{"value":[1537],"disabled":[4]}]]],["vertex-toggle.cjs",[[1,"vertex-toggle",{"variant":[1],"disabled":[4],"checked":[1540]}]]],["vertex-avatar.cjs",[[1,"vertex-avatar",{"firstName":[1,"first-name"],"lastName":[1,"last-name"],"value":[1],"active":[4],"variant":[1]}]]],["vertex-avatar-group.cjs",[[1,"vertex-avatar-group"]]],["vertex-button.cjs",[[1,"vertex-button",{"type":[1],"color":[1],"variant":[1],"size":[1],"expand":[1],"href":[1],"target":[1],"disabled":[516]}]]],["vertex-card.cjs",[[1,"vertex-card",{"mode":[1]}]]],["vertex-card-group.cjs",[[1,"vertex-card-group",{"selected":[516],"hovered":[516],"expanded":[516]}]]],["vertex-chip.cjs",[[1,"vertex-chip",{"variant":[1],"color":[1]}]]],["vertex-logo-loading.cjs",[[1,"vertex-logo-loading"]]],["vertex-menu-divider.cjs",[[1,"vertex-menu-divider"]]],["vertex-menu-item.cjs",[[1,"vertex-menu-item",{"disabled":[516]}]]],["vertex-radio.cjs",[[2,"vertex-radio",{"disabled":[516],"value":[513],"label":[513],"name":[513],"checked":[516]}]]],["vertex-radio-group.cjs",[[1,"vertex-radio-group",{"name":[513],"value":[1537]}]]],["vertex-resizable.cjs",[[1,"vertex-resizable",{"horizontalDirection":[1,"horizontal-direction"],"verticalDirection":[1,"vertical-direction"],"initialHorizontalScale":[2,"initial-horizontal-scale"],"initialVerticalScale":[2,"initial-vertical-scale"],"initializeWithOffset":[4,"initialize-with-offset"],"parentSelector":[1,"parent-selector"],"verticalSiblingSelector":[1,"vertical-sibling-selector"],"horizontalSiblingSelector":[1,"horizontal-sibling-selector"],"contentSelector":[1,"content-selector"],"position":[1],"dimensionsComputed":[1540,"dimensions-computed"],"width":[32],"minWidth":[32],"maxWidth":[32],"height":[32],"minHeight":[32],"maxHeight":[32],"left":[32],"top":[32],"hoveredLocation":[32],"dragStartLocation":[32],"updateDimensions":[64]}]]],["vertex-spinner.cjs",[[1,"vertex-spinner",{"color":[1],"size":[1]}]]],["vertex-expandable.cjs",[[1,"vertex-expandable",{"expanded":[1540],"expanding":[1540],"collapsing":[1540],"controlled":[516],"expandType":[513,"expand-type"],"animated":[4],"contentScrollHeight":[32]}]]],["vertex-result-list.cjs",[[1,"vertex-result-list",{"items":[16],"itemsJson":[1,"items"],"viewportStartIndex":[1026,"viewport-start-index"],"viewportEndIndex":[1026,"viewport-end-index"],"resultHeight":[1026,"result-height"],"overScanCount":[2,"over-scan-count"],"placement":[1],"position":[1],"open":[4],"listHeight":[32],"parsedResults":[32],"scrollTop":[32],"lastStartIndex":[32],"lastFocusedIndex":[32],"stateMap":[32]}]]],["vertex-textfield.cjs",[[6,"vertex-textfield",{"type":[1],"name":[1],"variant":[1],"fontSize":[1,"font-size"],"multiline":[4],"minRows":[2,"min-rows"],"maxRows":[2,"max-rows"],"placeholder":[1],"autoFocus":[4,"auto-focus"],"autoComplete":[1,"auto-complete"],"autoCorrect":[1,"auto-correct"],"value":[1032],"disabled":[516],"hasError":[4,"has-error"],"updateInput":[64],"blurInput":[64],"getInputValue":[64],"selectAll":[64]}]]],["vertex-tooltip.cjs",[[1,"vertex-tooltip",{"content":[1],"disabled":[4],"placement":[1],"delay":[2],"animated":[4],"open":[32]}]]],["vertex-color-circle.cjs",[[1,"vertex-color-circle",{"color":[513],"supplementalColor":[513,"supplemental-color"],"theme":[513],"lightenPercentage":[2,"lighten-percentage"],"darkenPercentage":[2,"darken-percentage"],"lightened":[1537],"darkened":[1537]}]]],["vertex-auto-resize-textarea.cjs",[[1,"vertex-auto-resize-textarea",{"textareaSelector":[1,"textarea-selector"],"initialValue":[1,"initial-value"],"minRows":[514,"min-rows"],"maxRows":[514,"max-rows"],"textValue":[32]}]]],["vertex-menu.cjs",[[1,"vertex-menu",{"animated":[4],"open":[1540],"placement":[1],"fallbackPlacements":[16],"backdrop":[4],"position":[1040],"popoverProps":[16]}]]],["vertex-icon-button.cjs",[[1,"vertex-icon-button",{"iconName":[1,"icon-name"],"disabled":[516],"variant":[1],"iconColor":[1,"icon-color"],"iconSize":[1,"icon-size"]}]]],["vertex-icon.cjs",[[1,"vertex-icon",{"name":[1],"size":[1]}]]],["vertex-popover.cjs",[[1,"vertex-popover",{"open":[1540],"placement":[1],"position":[1025],"anchorBounds":[16],"backdrop":[4],"animated":[4],"anchorSelector":[1,"anchor-selector"],"boundarySelector":[1,"boundary-selector"],"resizeBehavior":[1,"resize-behavior"],"overflowBehavior":[16],"flipBehavior":[16],"offsetBehavior":[2,"offset-behavior"],"updateOnResize":[4,"update-on-resize"],"opened":[32],"computedPlacement":[32]}]]]], options);
+  return index.bootstrapLazy([["vertex-click-to-edit-textfield.cjs",[[6,"vertex-click-to-edit-textfield",{"placeholder":[1],"fontSize":[1,"font-size"],"disabled":[516],"multiline":[4],"minRows":[2,"min-rows"],"maxRows":[2,"max-rows"],"value":[1032],"autoFocus":[4,"auto-focus"],"editing":[1540],"hasError":[4,"has-error"]}]]],["vertex-collapsible.cjs",[[1,"vertex-collapsible",{"label":[1],"open":[1540]}]]],["vertex-context-menu.cjs",[[1,"vertex-context-menu",{"targetSelector":[1,"target-selector"],"animated":[4],"position":[32],"open":[32]}]]],["vertex-dialog.cjs",[[1,"vertex-dialog",{"open":[1540],"fullscreen":[4],"resizable":[4],"width":[32],"height":[32],"minWidth":[32],"minHeight":[32],"maxWidth":[32],"maxHeight":[32],"isResizing":[32]},[[4,"keydown","keyDownListener"]]]]],["vertex-draggable-popover.cjs",[[1,"vertex-draggable-popover",{"position":[1],"boundarySelector":[1,"boundary-selector"],"boundaryPadding":[2,"boundary-padding"],"anchorPosition":[32],"lastPosition":[32],"dragging":[32]}]]],["vertex-dropdown-menu.cjs",[[1,"vertex-dropdown-menu",{"animated":[4],"placement":[1],"open":[32]}]]],["vertex-help-tooltip.cjs",[[1,"vertex-help-tooltip",{"animated":[4],"placement":[1],"open":[32]}]]],["vertex-search-bar.cjs",[[6,"vertex-search-bar",{"variant":[1],"disabled":[4],"triggerCharacter":[1,"trigger-character"],"breakCharacters":[16],"resultItems":[16],"placement":[1],"value":[1],"placeholder":[1],"replacements":[1040],"cursorPosition":[32],"displayedElements":[32],"hasTriggered":[32]}]]],["vertex-select.cjs",[[1,"vertex-select",{"value":[513],"placeholder":[513],"disabled":[516],"animated":[4],"hideSelected":[4,"hide-selected"],"resizeObserverFactory":[16],"open":[32],"position":[32],"displayValue":[32]}]]],["vertex-slider.cjs",[[1,"vertex-slider",{"min":[2],"max":[2],"valueLabelDisplay":[1,"value-label-display"],"step":[8],"size":[1],"value":[1026],"disabled":[4]}]]],["vertex-toast.cjs",[[1,"vertex-toast",{"content":[1],"placement":[1],"duration":[2],"animated":[4],"open":[4],"type":[1],"isOpen":[32]}]]],["vertex-color-circle-picker.cjs",[[1,"vertex-color-circle-picker",{"colors":[1],"supplementalColors":[1,"supplemental-colors"],"theme":[513],"lightenPercentage":[2,"lighten-percentage"],"darkenPercentage":[2,"darken-percentage"],"selected":[1537],"direction":[1]}]]],["vertex-color-picker.cjs",[[1,"vertex-color-picker",{"value":[1537],"disabled":[4]}]]],["vertex-toggle.cjs",[[1,"vertex-toggle",{"variant":[1],"disabled":[4],"checked":[1540]}]]],["vertex-avatar.cjs",[[1,"vertex-avatar",{"firstName":[1,"first-name"],"lastName":[1,"last-name"],"value":[1],"active":[4],"variant":[1]}]]],["vertex-avatar-group.cjs",[[1,"vertex-avatar-group"]]],["vertex-badge.cjs",[[1,"vertex-badge",{"badgeText":[1,"badge-text"],"badgeColor":[1,"badge-color"]}]]],["vertex-button.cjs",[[1,"vertex-button",{"type":[1],"color":[1],"variant":[1],"size":[1],"expand":[1],"href":[1],"target":[1],"disabled":[516]}]]],["vertex-card.cjs",[[1,"vertex-card",{"mode":[1]}]]],["vertex-card-group.cjs",[[1,"vertex-card-group",{"selected":[516],"hovered":[516],"expanded":[516]}]]],["vertex-chip.cjs",[[1,"vertex-chip",{"variant":[1],"color":[1]}]]],["vertex-logo-loading.cjs",[[1,"vertex-logo-loading"]]],["vertex-menu-divider.cjs",[[1,"vertex-menu-divider"]]],["vertex-menu-item.cjs",[[1,"vertex-menu-item",{"disabled":[516]}]]],["vertex-radio.cjs",[[2,"vertex-radio",{"disabled":[516],"value":[513],"label":[513],"name":[513],"checked":[516]}]]],["vertex-radio-group.cjs",[[1,"vertex-radio-group",{"name":[513],"value":[1537]}]]],["vertex-resizable.cjs",[[1,"vertex-resizable",{"horizontalDirection":[1,"horizontal-direction"],"verticalDirection":[1,"vertical-direction"],"initialHorizontalScale":[2,"initial-horizontal-scale"],"initialVerticalScale":[2,"initial-vertical-scale"],"initializeWithOffset":[4,"initialize-with-offset"],"parentSelector":[1,"parent-selector"],"verticalSiblingSelector":[1,"vertical-sibling-selector"],"horizontalSiblingSelector":[1,"horizontal-sibling-selector"],"contentSelector":[1,"content-selector"],"position":[1],"dimensionsComputed":[1540,"dimensions-computed"],"width":[32],"minWidth":[32],"maxWidth":[32],"height":[32],"minHeight":[32],"maxHeight":[32],"left":[32],"top":[32],"hoveredLocation":[32],"dragStartLocation":[32],"updateDimensions":[64]}]]],["vertex-spinner.cjs",[[1,"vertex-spinner",{"color":[1],"size":[1]}]]],["vertex-expandable.cjs",[[1,"vertex-expandable",{"expanded":[1540],"expanding":[1540],"collapsing":[1540],"controlled":[516],"expandType":[513,"expand-type"],"animated":[4],"contentScrollHeight":[32]}]]],["vertex-result-list.cjs",[[1,"vertex-result-list",{"items":[16],"itemsJson":[1,"items"],"viewportStartIndex":[1026,"viewport-start-index"],"viewportEndIndex":[1026,"viewport-end-index"],"resultHeight":[1026,"result-height"],"overScanCount":[2,"over-scan-count"],"placement":[1],"position":[1],"open":[4],"listHeight":[32],"parsedResults":[32],"scrollTop":[32],"lastStartIndex":[32],"lastFocusedIndex":[32],"stateMap":[32]}]]],["vertex-textfield.cjs",[[6,"vertex-textfield",{"type":[1],"name":[1],"variant":[1],"fontSize":[1,"font-size"],"multiline":[4],"minRows":[2,"min-rows"],"maxRows":[2,"max-rows"],"placeholder":[1],"autoFocus":[4,"auto-focus"],"autoComplete":[1,"auto-complete"],"autoCorrect":[1,"auto-correct"],"value":[1032],"disabled":[516],"hasError":[4,"has-error"],"updateInput":[64],"blurInput":[64],"getInputValue":[64],"selectAll":[64]}]]],["vertex-tooltip.cjs",[[1,"vertex-tooltip",{"content":[1],"disabled":[4],"placement":[1],"delay":[2],"animated":[4],"open":[32]}]]],["vertex-color-circle.cjs",[[1,"vertex-color-circle",{"color":[513],"supplementalColor":[513,"supplemental-color"],"theme":[513],"lightenPercentage":[2,"lighten-percentage"],"darkenPercentage":[2,"darken-percentage"],"lightened":[1537],"darkened":[1537]}]]],["vertex-auto-resize-textarea.cjs",[[1,"vertex-auto-resize-textarea",{"textareaSelector":[1,"textarea-selector"],"initialValue":[1,"initial-value"],"minRows":[514,"min-rows"],"maxRows":[514,"max-rows"],"textValue":[32]}]]],["vertex-menu.cjs",[[1,"vertex-menu",{"animated":[4],"open":[1540],"placement":[1],"fallbackPlacements":[16],"backdrop":[4],"position":[1040],"popoverProps":[16]}]]],["vertex-icon-button.cjs",[[1,"vertex-icon-button",{"iconName":[1,"icon-name"],"disabled":[516],"variant":[1],"iconColor":[1,"icon-color"],"iconSize":[1,"icon-size"]}]]],["vertex-icon.cjs",[[1,"vertex-icon",{"name":[1],"size":[1]}]]],["vertex-popover.cjs",[[1,"vertex-popover",{"open":[1540],"placement":[1],"position":[1025],"anchorBounds":[16],"backdrop":[4],"animated":[4],"anchorSelector":[1,"anchor-selector"],"boundarySelector":[1,"boundary-selector"],"resizeBehavior":[1,"resize-behavior"],"overflowBehavior":[16],"flipBehavior":[16],"offsetBehavior":[2,"offset-behavior"],"updateOnResize":[4,"update-on-resize"],"resizeObserverFactory":[16],"opened":[32],"computedPlacement":[32]}]]]], options);
 });
 
 exports.setNonce = index.setNonce;

package/dist/cjs/{icon-53d62a46.js → icon-460fd0f5.js}

@@ -2,7 +2,7 @@
 
 const index = require('./index-6a92256c.js');
 const index$1 = require('./index-e1b40fa6.js');
-const iconHelper = require('./icon-helper-caf2699e.js');
+const iconHelper = require('./icon-helper-ba408f49.js');
 
 const iconCss = ".container{display:flex;justify-content:center;align-items:center;width:100%;height:100%}.icon{display:flex;justify-content:center;align-items:center;fill:currentColor}.xs{height:var(--icon-size, 0.75rem);width:var(--icon-size, 0.75rem)}.sm{height:var(--icon-size, 1rem);width:var(--icon-size, 1rem)}.md{height:var(--icon-size, 1.5rem);width:var(--icon-size, 1.5rem)}.lg{height:var(--icon-size, 2rem);width:var(--icon-size, 2rem)}svg{position:relative;width:100%}";
 

package/dist/cjs/icon-button-786427d6.js

@@ -0,0 +1,43 @@
+'use strict';
+
+const index = require('./index-6a92256c.js');
+const index$1 = require('./index-e1b40fa6.js');
+const iconHelper = require('./icon-helper-ba408f49.js');
+
+const iconButtonCss = "button{border:none;background-color:transparent;font-family:var(--vertex-ui-font-family);font-size:0.875rem;padding:0}:host{--enabled-cursor:pointer;--disabled-cursor:not-allowed;--hover-background-color:var(--vertex-ui-neutral-300);--active-background-color:var(--vertex-ui-neutral-400);--focus-background-color:var(--vertex-ui-neutral-400);--hover-box-shadow:0 2px 2px rgb(0 0 0 / 20%);--active-box-shadow:none;--focus-box-shadow:0 0 0 1px var(--vertex-ui-neutral-900);--icon-margin:0px}.container{display:flex;justify-content:center;align-items:center;outline:none;fill:currentColor;color:currentColor;cursor:var(--enabled-cursor)}.container:not(.plain){border-radius:4px;padding:0.25rem}.icon-button{display:flex;position:relative;justify-content:center;align-items:center;fill:currentColor;height:var(--icon-size, 1.5rem);width:var(--icon-size, 1.5rem)}.icon-button svg{width:100%;height:100%;margin:var(--icon-margin, 0px)}.badge{position:absolute;top:0px;right:4px;justify-content:flex-end;align-items:flex-end}.floating{background-color:var(--vertex-ui-neutral-100);box-shadow:var(--vertex-ui-overlay-shadow);color:var(--vertex-ui-neutral-700);fill:var(--vertex-ui-neutral-700);opacity:0.95}.floating.disabled{color:var(--vertex-ui-neutral-400);cursor:var(--disabled-cursor)}.container:not(.disabled):not(.plain):hover{background-color:var(--hover-background-color);box-shadow:var(--hover-box-shadow)}.container:not(.disabled):not(.plain):active{background-color:var(--active-background-color);box-shadow:var(--active-box-shadow)}.container:not(.disabled):not(.plain):focus-visible{background-color:var(--focus-background-color);box-shadow:var(--focus-box-shadow);color:var(--vertex-ui-neutral-900)}.container.disabled:not(.floating){cursor:var(--disabled-cursor);color:var(--vertex-ui-neutral-400)}.container.primary:not(.disabled){color:var(--vertex-ui-blue-700)}.container.secondary:not(.disabled){color:var(--vertex-ui-neutral-800)}.xs{height:var(--icon-size, 0.75rem);width:var(--icon-size, 0.75rem)}.sm{height:var(--icon-size, 1rem);width:var(--icon-size, 1rem)}.md{height:var(--icon-size, 1.5rem);width:var(--icon-size, 1.5rem)}.lg{height:var(--icon-size, 2rem);width:var(--icon-size, 2rem)}";
+
+const IconButton = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.iconName = undefined;
+    this.disabled = undefined;
+    this.variant = 'default';
+    this.iconColor = 'default';
+    this.iconSize = 'md';
+  }
+  render() {
+    return (index.h(index.Host, { onClick: (e) => this.handleClick(e) }, index.h("button", { ref: (el) => (this.buttonEl = el), disabled: this.disabled, class: index$1.classnames('container', {
+        disabled: this.disabled,
+        floating: this.variant === 'floating',
+        plain: this.variant === 'plain',
+        primary: this.iconColor === 'primary',
+        secondary: this.iconColor === 'secondary',
+      }) }, index.h("slot", { name: "left" }), index.h("div", { class: index$1.classnames('icon-button', {
+        xs: this.iconSize === 'xs',
+        sm: this.iconSize === 'sm',
+        md: this.iconSize === 'md',
+        lg: this.iconSize === 'lg',
+      }) }, iconHelper.getSvg(this.iconName), index.h("div", { class: "badge" }, index.h("slot", { name: "badge" }))), index.h("slot", null))));
+  }
+  handleClick(event) {
+    var _a;
+    if (this.disabled) {
+      event.preventDefault();
+      event.stopPropagation();
+    }
+    (_a = this.buttonEl) === null || _a === void 0 ? void 0 : _a.blur();
+  }
+};
+IconButton.style = iconButtonCss;
+
+exports.IconButton = IconButton;

package/dist/cjs/{icon-helper-caf2699e.js → icon-helper-ba408f49.js}

@@ -130,6 +130,11 @@ const Columns = () => (index.h("svg", { xmlns: "http://www.w3.org/2000/svg", vie
 const CommentAdd = () => (index.h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 16 16", "data-testid": "comment-add" },
   index.h("path", { d: "M10.5,6.7h-5c-.3,0-.5.2-.5.5s.2.5.5.5h5c.3,0,.5-.2.5-.5s-.2-.5-.5-.5ZM7.5,5v4.4c0,.3.2.5.5.5s.5-.2.5-.5v-4.4c0-.3-.2-.5-.5-.5s-.5.2-.5.5ZM13.5,2H2.5c-.8,0-1.5.7-1.5,1.5v7c0,.8.7,1.5,1.5,1.5h5.8l2.9,2.9c.1.1.4.2.5.1.2,0,.3-.3.3-.5v-2.5h1.5c.8,0,1.5-.7,1.5-1.5V3.5c0-.8-.7-1.5-1.5-1.5ZM14,10.5c0,.3-.2.5-.5.5h-2c-.3,0-.5.2-.5.5v1.8l-2.1-2.1s-.2-.2-.4-.1H2.5c-.3,0-.5-.2-.5-.5V3.5c0-.3.2-.5.5-.5h11c.3,0,.5.2.5.5v7Z" })));
 
+const CommentFilled = () => (index.h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 16 16", "data-testid": "comment-filled" },
+  index.h("path", { d: "M2.5 2A1.5 1.5 0 0 0 1 3.5v7A1.5 1.5 0 0 0 2.5 12h5.79l2.86 2.85a.47.47 0 0 0 .54.11.5.5 0 0 0 .31-.46V12h1.5a1.5 1.5 0 0 0 1.5-1.5v-7A1.5 1.5 0 0 0 13.5 2Zm0 1h11a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-.5.5h-2a.51.51 0 0 0-.5.5v1.79l-2.15-2.14A.47.47 0 0 0 8.5 11h-6a.5.5 0 0 1-.5-.5v-7a.5.5 0 0 1 .5-.5Z" }),
+  index.h("path", { d: "M11.306 14.941c-.085-.042-.422-.367-1.55-1.497L8.314 12H5.431c-1.806 0-2.955-.009-3.075-.022a1.49 1.49 0 0 1-1.257-.98l-.07-.18-.005-3.756c-.006-4.202-.018-3.888.152-4.233a1.18 1.18 0 0 1 .276-.369c.204-.204.374-.307.651-.393l.163-.05h11.468l.163.05c.271.085.448.19.64.383s.288.34.375.578l.058.159v7.631l-.069.18c-.168.436-.495.76-.911.905-.225.078-.465.097-1.269.097h-.73l-.007 1.319-.006 1.319-.065.106c-.135.217-.394.301-.607.197zm-.223-3.68a.527.527 0 0 1 .31-.235c.056-.015.46-.023 1.155-.023 1.178 0 1.157.002 1.303-.137a.616.616 0 0 0 .113-.156c.039-.083.04-.227.04-3.708l.001-3.622-.057-.115a.476.476 0 0 0-.335-.26c-.152-.033-11.074-.033-11.226 0a.476.476 0 0 0-.335.26l-.057.115v3.617c0 3.994-.011 3.697.136 3.85.15.158-.147.144 3.343.156 3.026.01 3.147.012 3.22.051.042.023.578.54 1.192 1.15l1.117 1.108.01-.976.011-.976z", stroke: "currentColor", "stroke-width": ".0216802" }),
+  index.h("path", { d: "M9.888 12.26c-.799-.783-1.159-1.121-1.23-1.156l-.103-.05-3.264-.01-3.265-.011-.106-.062a.477.477 0 0 1-.17-.166l-.062-.104V3.238l.068-.096a.722.722 0 0 1 .179-.162l.11-.067h11.729l.093.049a.58.58 0 0 1 .25.266c.024.058.03.714.03 3.75v3.68l-.058.114a.527.527 0 0 1-.247.24c-.025.011-.58.025-1.231.031-1.167.011-1.188.012-1.279.06a.697.697 0 0 0-.265.27c-.018.04-.03.35-.038 1.026l-.011.968z", stroke: "currentColor", "stroke-width": "2.36182", "stroke-miterlimit": "4", "stroke-dasharray": "none" })));
+
 const CommentReopen = () => (index.h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 16 16", "data-testid": "comment-reopen" },
   index.h("path", { d: "M13.5,2H11.81l.57,1H13.5a.5.5,0,0,1,.5.5v7a.5.5,0,0,1-.5.5h-2a.51.51,0,0,0-.5.5v1.79L8.85,11.15A.47.47,0,0,0,8.5,11h-6a.5.5,0,0,1-.5-.5v-7A.5.5,0,0,1,2.5,3H8.62l.57-1H2.5A1.5,1.5,0,0,0,1,3.5v7A1.5,1.5,0,0,0,2.5,12H8.29l2.86,2.85a.47.47,0,0,0,.54.11A.5.5,0,0,0,12,14.5V12h1.5A1.5,1.5,0,0,0,15,10.5v-7A1.5,1.5,0,0,0,13.5,2ZM7.11,5.21a.5.5,0,0,0,.22-.67.49.49,0,0,0-.67-.22A3,3,0,1,0,11,7V5.08h1.49l-2-3.45-2,3.45H10V7A2,2,0,1,1,7.11,5.21Z" })));
 
@@ -457,6 +462,8 @@ function getSvg(name) {
       return index.h(Columns, null);
     case 'comment-add':
       return index.h(CommentAdd, null);
+    case 'comment-filled':
+      return index.h(CommentFilled, null);
     case 'comment-reopen':
       return index.h(CommentReopen, null);
     case 'comment-resolve':

package/dist/cjs/index.cjs.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const autoResizeTextarea = require('./auto-resize-textarea-deb05359.js');
 const avatar = require('./avatar-e69bb687.js');
 const avatarGroup = require('./avatar-group-d2af53e4.js');
+const badge = require('./badge-d39ac1fc.js');
 const button = require('./button-edd366d8.js');
 const card = require('./card-ae9e8a8f.js');
 const cardGroup = require('./card-group-da93e610.js');
@@ -20,29 +21,29 @@ const draggablePopover = require('./draggable-popover-edf23d3a.js');
 const dropdownMenu = require('./dropdown-menu-5ae03a72.js');
 const expandable = require('./expandable-b1cd4f0b.js');
 const helpTooltip = require('./help-tooltip-f72eccc7.js');
-const icon = require('./icon-53d62a46.js');
-const iconButton = require('./icon-button-f868bf06.js');
+const icon = require('./icon-460fd0f5.js');
+const iconButton = require('./icon-button-786427d6.js');
 const logoLoading = require('./logo-loading-4d49fedf.js');
 const menu = require('./menu-d1ecf43b.js');
 const menuDivider = require('./menu-divider-5bdebe5d.js');
 const menuItem = require('./menu-item-d213fd4d.js');
-const popover = require('./popover-d9ec8e10.js');
+const popover = require('./popover-942209b8.js');
 const radio = require('./radio-bff991d2.js');
 const radioGroup = require('./radio-group-d628f631.js');
 const resizable = require('./resizable-e4248256.js');
-const resultList = require('./result-list-1e592c3c.js');
-const searchBar = require('./search-bar-bb40cfa7.js');
-const select = require('./select-0eb7203f.js');
+const resultList = require('./result-list-241ffe8d.js');
+const searchBar = require('./search-bar-a321b3e1.js');
+const select = require('./select-5f8aecfe.js');
 const slider = require('./slider-13594e49.js');
 const spinner = require('./spinner-bb990a42.js');
-const textField = require('./text-field-0397fb34.js');
+const textField = require('./text-field-bccbde1f.js');
 const toast = require('./toast-bee7f47b.js');
 const toggle = require('./toggle-a5dde469.js');
-const tooltip = require('./tooltip-31b596f5.js');
+const tooltip = require('./tooltip-e9f63631.js');
 require('./index-6a92256c.js');
 require('./slots-fb5ac359.js');
 require('./index-e1b40fa6.js');
-require('./icon-helper-caf2699e.js');
+require('./icon-helper-ba408f49.js');
 require('./templates-e7b3ffbb.js');
 require('./tslib.es6-838fd860.js');
 
@@ -51,6 +52,7 @@ require('./tslib.es6-838fd860.js');
 exports.AutoResizeTextArea = autoResizeTextarea.AutoResizeTextArea;
 exports.Avatar = avatar.Avatar;
 exports.AvatarGroup = avatarGroup.AvatarGroup;
+exports.Badge = badge.Badge;
 exports.Button = button.Button;
 exports.Card = card.Card;
 exports.CardGroup = cardGroup.CardGroup;

package/dist/cjs/loader.cjs.js

@@ -14,7 +14,7 @@ const patchEsm = () => {
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
   return patchEsm().then(() => {
-  return index.bootstrapLazy([["vertex-click-to-edit-textfield.cjs",[[6,"vertex-click-to-edit-textfield",{"placeholder":[1],"fontSize":[1,"font-size"],"disabled":[516],"multiline":[4],"minRows":[2,"min-rows"],"maxRows":[2,"max-rows"],"value":[1032],"autoFocus":[4,"auto-focus"],"editing":[1540],"hasError":[4,"has-error"]}]]],["vertex-collapsible.cjs",[[1,"vertex-collapsible",{"label":[1],"open":[1540]}]]],["vertex-context-menu.cjs",[[1,"vertex-context-menu",{"targetSelector":[1,"target-selector"],"animated":[4],"position":[32],"open":[32]}]]],["vertex-dialog.cjs",[[1,"vertex-dialog",{"open":[1540],"fullscreen":[4],"resizable":[4],"width":[32],"height":[32],"minWidth":[32],"minHeight":[32],"maxWidth":[32],"maxHeight":[32],"isResizing":[32]},[[4,"keydown","keyDownListener"]]]]],["vertex-draggable-popover.cjs",[[1,"vertex-draggable-popover",{"position":[1],"boundarySelector":[1,"boundary-selector"],"boundaryPadding":[2,"boundary-padding"],"anchorPosition":[32],"lastPosition":[32],"dragging":[32]}]]],["vertex-dropdown-menu.cjs",[[1,"vertex-dropdown-menu",{"animated":[4],"placement":[1],"open":[32]}]]],["vertex-help-tooltip.cjs",[[1,"vertex-help-tooltip",{"animated":[4],"placement":[1],"open":[32]}]]],["vertex-search-bar.cjs",[[6,"vertex-search-bar",{"variant":[1],"resultItems":[16],"triggerCharacters":[16],"triggerCharacter":[1,"trigger-character"],"breakCharacters":[16],"debounce":[2],"placeholder":[1],"placement":[1],"cursorPosition":[32],"open":[32],"triggerKey":[32],"triggerRange":[32],"replaceTriggeredValue":[64],"getEditableContent":[64]}]]],["vertex-select.cjs",[[1,"vertex-select",{"value":[513],"placeholder":[513],"disabled":[516],"animated":[4],"resizeObserverFactory":[16],"open":[32],"position":[32],"displayValue":[32]}]]],["vertex-slider.cjs",[[1,"vertex-slider",{"min":[2],"max":[2],"valueLabelDisplay":[1,"value-label-display"],"step":[8],"size":[1],"value":[1026],"disabled":[4]}]]],["vertex-toast.cjs",[[1,"vertex-toast",{"content":[1],"placement":[1],"duration":[2],"animated":[4],"open":[4],"type":[1],"isOpen":[32]}]]],["vertex-color-circle-picker.cjs",[[1,"vertex-color-circle-picker",{"colors":[1],"supplementalColors":[1,"supplemental-colors"],"theme":[513],"lightenPercentage":[2,"lighten-percentage"],"darkenPercentage":[2,"darken-percentage"],"selected":[1537],"direction":[1]}]]],["vertex-color-picker.cjs",[[1,"vertex-color-picker",{"value":[1537],"disabled":[4]}]]],["vertex-toggle.cjs",[[1,"vertex-toggle",{"variant":[1],"disabled":[4],"checked":[1540]}]]],["vertex-avatar.cjs",[[1,"vertex-avatar",{"firstName":[1,"first-name"],"lastName":[1,"last-name"],"value":[1],"active":[4],"variant":[1]}]]],["vertex-avatar-group.cjs",[[1,"vertex-avatar-group"]]],["vertex-button.cjs",[[1,"vertex-button",{"type":[1],"color":[1],"variant":[1],"size":[1],"expand":[1],"href":[1],"target":[1],"disabled":[516]}]]],["vertex-card.cjs",[[1,"vertex-card",{"mode":[1]}]]],["vertex-card-group.cjs",[[1,"vertex-card-group",{"selected":[516],"hovered":[516],"expanded":[516]}]]],["vertex-chip.cjs",[[1,"vertex-chip",{"variant":[1],"color":[1]}]]],["vertex-logo-loading.cjs",[[1,"vertex-logo-loading"]]],["vertex-menu-divider.cjs",[[1,"vertex-menu-divider"]]],["vertex-menu-item.cjs",[[1,"vertex-menu-item",{"disabled":[516]}]]],["vertex-radio.cjs",[[2,"vertex-radio",{"disabled":[516],"value":[513],"label":[513],"name":[513],"checked":[516]}]]],["vertex-radio-group.cjs",[[1,"vertex-radio-group",{"name":[513],"value":[1537]}]]],["vertex-resizable.cjs",[[1,"vertex-resizable",{"horizontalDirection":[1,"horizontal-direction"],"verticalDirection":[1,"vertical-direction"],"initialHorizontalScale":[2,"initial-horizontal-scale"],"initialVerticalScale":[2,"initial-vertical-scale"],"initializeWithOffset":[4,"initialize-with-offset"],"parentSelector":[1,"parent-selector"],"verticalSiblingSelector":[1,"vertical-sibling-selector"],"horizontalSiblingSelector":[1,"horizontal-sibling-selector"],"contentSelector":[1,"content-selector"],"position":[1],"dimensionsComputed":[1540,"dimensions-computed"],"width":[32],"minWidth":[32],"maxWidth":[32],"height":[32],"minHeight":[32],"maxHeight":[32],"left":[32],"top":[32],"hoveredLocation":[32],"dragStartLocation":[32],"updateDimensions":[64]}]]],["vertex-spinner.cjs",[[1,"vertex-spinner",{"color":[1],"size":[1]}]]],["vertex-expandable.cjs",[[1,"vertex-expandable",{"expanded":[1540],"expanding":[1540],"collapsing":[1540],"controlled":[516],"expandType":[513,"expand-type"],"animated":[4],"contentScrollHeight":[32]}]]],["vertex-result-list.cjs",[[1,"vertex-result-list",{"items":[16],"itemsJson":[1,"items"],"viewportStartIndex":[1026,"viewport-start-index"],"viewportEndIndex":[1026,"viewport-end-index"],"resultHeight":[1026,"result-height"],"overScanCount":[2,"over-scan-count"],"placement":[1],"position":[1],"open":[4],"listHeight":[32],"parsedResults":[32],"scrollTop":[32],"lastStartIndex":[32],"lastFocusedIndex":[32],"stateMap":[32]}]]],["vertex-textfield.cjs",[[6,"vertex-textfield",{"type":[1],"name":[1],"variant":[1],"fontSize":[1,"font-size"],"multiline":[4],"minRows":[2,"min-rows"],"maxRows":[2,"max-rows"],"placeholder":[1],"autoFocus":[4,"auto-focus"],"autoComplete":[1,"auto-complete"],"autoCorrect":[1,"auto-correct"],"value":[1032],"disabled":[516],"hasError":[4,"has-error"],"updateInput":[64],"blurInput":[64],"getInputValue":[64],"selectAll":[64]}]]],["vertex-tooltip.cjs",[[1,"vertex-tooltip",{"content":[1],"disabled":[4],"placement":[1],"delay":[2],"animated":[4],"open":[32]}]]],["vertex-color-circle.cjs",[[1,"vertex-color-circle",{"color":[513],"supplementalColor":[513,"supplemental-color"],"theme":[513],"lightenPercentage":[2,"lighten-percentage"],"darkenPercentage":[2,"darken-percentage"],"lightened":[1537],"darkened":[1537]}]]],["vertex-auto-resize-textarea.cjs",[[1,"vertex-auto-resize-textarea",{"textareaSelector":[1,"textarea-selector"],"initialValue":[1,"initial-value"],"minRows":[514,"min-rows"],"maxRows":[514,"max-rows"],"textValue":[32]}]]],["vertex-menu.cjs",[[1,"vertex-menu",{"animated":[4],"open":[1540],"placement":[1],"fallbackPlacements":[16],"backdrop":[4],"position":[1040],"popoverProps":[16]}]]],["vertex-icon-button.cjs",[[1,"vertex-icon-button",{"iconName":[1,"icon-name"],"disabled":[516],"variant":[1],"iconColor":[1,"icon-color"],"iconSize":[1,"icon-size"]}]]],["vertex-icon.cjs",[[1,"vertex-icon",{"name":[1],"size":[1]}]]],["vertex-popover.cjs",[[1,"vertex-popover",{"open":[1540],"placement":[1],"position":[1025],"anchorBounds":[16],"backdrop":[4],"animated":[4],"anchorSelector":[1,"anchor-selector"],"boundarySelector":[1,"boundary-selector"],"resizeBehavior":[1,"resize-behavior"],"overflowBehavior":[16],"flipBehavior":[16],"offsetBehavior":[2,"offset-behavior"],"updateOnResize":[4,"update-on-resize"],"opened":[32],"computedPlacement":[32]}]]]], options);
+  return index.bootstrapLazy([["vertex-click-to-edit-textfield.cjs",[[6,"vertex-click-to-edit-textfield",{"placeholder":[1],"fontSize":[1,"font-size"],"disabled":[516],"multiline":[4],"minRows":[2,"min-rows"],"maxRows":[2,"max-rows"],"value":[1032],"autoFocus":[4,"auto-focus"],"editing":[1540],"hasError":[4,"has-error"]}]]],["vertex-collapsible.cjs",[[1,"vertex-collapsible",{"label":[1],"open":[1540]}]]],["vertex-context-menu.cjs",[[1,"vertex-context-menu",{"targetSelector":[1,"target-selector"],"animated":[4],"position":[32],"open":[32]}]]],["vertex-dialog.cjs",[[1,"vertex-dialog",{"open":[1540],"fullscreen":[4],"resizable":[4],"width":[32],"height":[32],"minWidth":[32],"minHeight":[32],"maxWidth":[32],"maxHeight":[32],"isResizing":[32]},[[4,"keydown","keyDownListener"]]]]],["vertex-draggable-popover.cjs",[[1,"vertex-draggable-popover",{"position":[1],"boundarySelector":[1,"boundary-selector"],"boundaryPadding":[2,"boundary-padding"],"anchorPosition":[32],"lastPosition":[32],"dragging":[32]}]]],["vertex-dropdown-menu.cjs",[[1,"vertex-dropdown-menu",{"animated":[4],"placement":[1],"open":[32]}]]],["vertex-help-tooltip.cjs",[[1,"vertex-help-tooltip",{"animated":[4],"placement":[1],"open":[32]}]]],["vertex-search-bar.cjs",[[6,"vertex-search-bar",{"variant":[1],"disabled":[4],"triggerCharacter":[1,"trigger-character"],"breakCharacters":[16],"resultItems":[16],"placement":[1],"value":[1],"placeholder":[1],"replacements":[1040],"cursorPosition":[32],"displayedElements":[32],"hasTriggered":[32]}]]],["vertex-select.cjs",[[1,"vertex-select",{"value":[513],"placeholder":[513],"disabled":[516],"animated":[4],"hideSelected":[4,"hide-selected"],"resizeObserverFactory":[16],"open":[32],"position":[32],"displayValue":[32]}]]],["vertex-slider.cjs",[[1,"vertex-slider",{"min":[2],"max":[2],"valueLabelDisplay":[1,"value-label-display"],"step":[8],"size":[1],"value":[1026],"disabled":[4]}]]],["vertex-toast.cjs",[[1,"vertex-toast",{"content":[1],"placement":[1],"duration":[2],"animated":[4],"open":[4],"type":[1],"isOpen":[32]}]]],["vertex-color-circle-picker.cjs",[[1,"vertex-color-circle-picker",{"colors":[1],"supplementalColors":[1,"supplemental-colors"],"theme":[513],"lightenPercentage":[2,"lighten-percentage"],"darkenPercentage":[2,"darken-percentage"],"selected":[1537],"direction":[1]}]]],["vertex-color-picker.cjs",[[1,"vertex-color-picker",{"value":[1537],"disabled":[4]}]]],["vertex-toggle.cjs",[[1,"vertex-toggle",{"variant":[1],"disabled":[4],"checked":[1540]}]]],["vertex-avatar.cjs",[[1,"vertex-avatar",{"firstName":[1,"first-name"],"lastName":[1,"last-name"],"value":[1],"active":[4],"variant":[1]}]]],["vertex-avatar-group.cjs",[[1,"vertex-avatar-group"]]],["vertex-badge.cjs",[[1,"vertex-badge",{"badgeText":[1,"badge-text"],"badgeColor":[1,"badge-color"]}]]],["vertex-button.cjs",[[1,"vertex-button",{"type":[1],"color":[1],"variant":[1],"size":[1],"expand":[1],"href":[1],"target":[1],"disabled":[516]}]]],["vertex-card.cjs",[[1,"vertex-card",{"mode":[1]}]]],["vertex-card-group.cjs",[[1,"vertex-card-group",{"selected":[516],"hovered":[516],"expanded":[516]}]]],["vertex-chip.cjs",[[1,"vertex-chip",{"variant":[1],"color":[1]}]]],["vertex-logo-loading.cjs",[[1,"vertex-logo-loading"]]],["vertex-menu-divider.cjs",[[1,"vertex-menu-divider"]]],["vertex-menu-item.cjs",[[1,"vertex-menu-item",{"disabled":[516]}]]],["vertex-radio.cjs",[[2,"vertex-radio",{"disabled":[516],"value":[513],"label":[513],"name":[513],"checked":[516]}]]],["vertex-radio-group.cjs",[[1,"vertex-radio-group",{"name":[513],"value":[1537]}]]],["vertex-resizable.cjs",[[1,"vertex-resizable",{"horizontalDirection":[1,"horizontal-direction"],"verticalDirection":[1,"vertical-direction"],"initialHorizontalScale":[2,"initial-horizontal-scale"],"initialVerticalScale":[2,"initial-vertical-scale"],"initializeWithOffset":[4,"initialize-with-offset"],"parentSelector":[1,"parent-selector"],"verticalSiblingSelector":[1,"vertical-sibling-selector"],"horizontalSiblingSelector":[1,"horizontal-sibling-selector"],"contentSelector":[1,"content-selector"],"position":[1],"dimensionsComputed":[1540,"dimensions-computed"],"width":[32],"minWidth":[32],"maxWidth":[32],"height":[32],"minHeight":[32],"maxHeight":[32],"left":[32],"top":[32],"hoveredLocation":[32],"dragStartLocation":[32],"updateDimensions":[64]}]]],["vertex-spinner.cjs",[[1,"vertex-spinner",{"color":[1],"size":[1]}]]],["vertex-expandable.cjs",[[1,"vertex-expandable",{"expanded":[1540],"expanding":[1540],"collapsing":[1540],"controlled":[516],"expandType":[513,"expand-type"],"animated":[4],"contentScrollHeight":[32]}]]],["vertex-result-list.cjs",[[1,"vertex-result-list",{"items":[16],"itemsJson":[1,"items"],"viewportStartIndex":[1026,"viewport-start-index"],"viewportEndIndex":[1026,"viewport-end-index"],"resultHeight":[1026,"result-height"],"overScanCount":[2,"over-scan-count"],"placement":[1],"position":[1],"open":[4],"listHeight":[32],"parsedResults":[32],"scrollTop":[32],"lastStartIndex":[32],"lastFocusedIndex":[32],"stateMap":[32]}]]],["vertex-textfield.cjs",[[6,"vertex-textfield",{"type":[1],"name":[1],"variant":[1],"fontSize":[1,"font-size"],"multiline":[4],"minRows":[2,"min-rows"],"maxRows":[2,"max-rows"],"placeholder":[1],"autoFocus":[4,"auto-focus"],"autoComplete":[1,"auto-complete"],"autoCorrect":[1,"auto-correct"],"value":[1032],"disabled":[516],"hasError":[4,"has-error"],"updateInput":[64],"blurInput":[64],"getInputValue":[64],"selectAll":[64]}]]],["vertex-tooltip.cjs",[[1,"vertex-tooltip",{"content":[1],"disabled":[4],"placement":[1],"delay":[2],"animated":[4],"open":[32]}]]],["vertex-color-circle.cjs",[[1,"vertex-color-circle",{"color":[513],"supplementalColor":[513,"supplemental-color"],"theme":[513],"lightenPercentage":[2,"lighten-percentage"],"darkenPercentage":[2,"darken-percentage"],"lightened":[1537],"darkened":[1537]}]]],["vertex-auto-resize-textarea.cjs",[[1,"vertex-auto-resize-textarea",{"textareaSelector":[1,"textarea-selector"],"initialValue":[1,"initial-value"],"minRows":[514,"min-rows"],"maxRows":[514,"max-rows"],"textValue":[32]}]]],["vertex-menu.cjs",[[1,"vertex-menu",{"animated":[4],"open":[1540],"placement":[1],"fallbackPlacements":[16],"backdrop":[4],"position":[1040],"popoverProps":[16]}]]],["vertex-icon-button.cjs",[[1,"vertex-icon-button",{"iconName":[1,"icon-name"],"disabled":[516],"variant":[1],"iconColor":[1,"icon-color"],"iconSize":[1,"icon-size"]}]]],["vertex-icon.cjs",[[1,"vertex-icon",{"name":[1],"size":[1]}]]],["vertex-popover.cjs",[[1,"vertex-popover",{"open":[1540],"placement":[1],"position":[1025],"anchorBounds":[16],"backdrop":[4],"animated":[4],"anchorSelector":[1,"anchor-selector"],"boundarySelector":[1,"boundary-selector"],"resizeBehavior":[1,"resize-behavior"],"overflowBehavior":[16],"flipBehavior":[16],"offsetBehavior":[2,"offset-behavior"],"updateOnResize":[4,"update-on-resize"],"resizeObserverFactory":[16],"opened":[32],"computedPlacement":[32]}]]]], options);
   });
 };
 

package/dist/cjs/{popover-d9ec8e10.js → popover-942209b8.js}

@@ -1475,13 +1475,17 @@ const Popover = class {
     this.updateOnResize = false;
     this.opened = false;
     this.computedPlacement = this.placement;
+    this.resizeObserverFactory = (cb) => new ResizeObserver(cb);
     this.updateListener = this.updateListener.bind(this);
     this.handlePositionUpdate = this.handlePositionUpdate.bind(this);
     this.handleResize = this.handleResize.bind(this);
+    this.handleMiddlewareChange = this.handleMiddlewareChange.bind(this);
     this.setWindow = this.setWindow.bind(this);
+    this.updateResizeObserver = this.updateResizeObserver.bind(this);
   }
   connectedCallback() {
     this.updatePosition(this.position);
+    this.updateResizeObserver();
   }
   componentDidUpdate() {
     if (this.shouldUpdatePosition) {
@@ -1503,12 +1507,14 @@ const Popover = class {
     }
   }
   disconnectedCallback() {
+    var _a;
     this.viewportWidth = undefined;
     this.viewportHeight = undefined;
     this.opened = false;
     if (this.resizeBehavior === 'dynamic') {
       window.removeEventListener('resize', this.handleResize);
     }
+    (_a = this.boundaryResizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
   }
   updatePosition(position) {
     if (position != null) {
@@ -1532,6 +1538,16 @@ const Popover = class {
   updateMiddleware() {
     this.handleMiddlewareChange();
   }
+  updateResizeObserver() {
+    const observer = this.getOrCreateResizeObserver();
+    observer.disconnect();
+    if (this.boundarySelector != null) {
+      const element = document.querySelector(this.boundarySelector);
+      if (element != null) {
+        observer.observe(element);
+      }
+    }
+  }
   /**
    * @private Used for internals or testing.
    */
@@ -1637,6 +1653,12 @@ const Popover = class {
     this.viewportWidth = this.partialWindow.innerWidth;
     this.viewportHeight = this.partialWindow.innerHeight;
   }
+  getOrCreateResizeObserver() {
+    if (this.boundaryResizeObserver == null) {
+      this.boundaryResizeObserver = this.resizeObserverFactory(this.handleMiddlewareChange);
+    }
+    return this.boundaryResizeObserver;
+  }
   getTransformClass() {
     if (this.animated) {
       switch (this.computedPlacement) {
@@ -1673,7 +1695,7 @@ const Popover = class {
     "placement": ["updatePlacement"],
     "open": ["updateOpened"],
     "animated": ["updateAnimated"],
-    "boundarySelector": ["updateMiddleware"],
+    "boundarySelector": ["updateMiddleware", "updateResizeObserver"],
     "overflowBehavior": ["updateMiddleware"],
     "flipBehavior": ["updateMiddleware"],
     "offsetBehavior": ["updateMiddleware"]

package/dist/cjs/{result-list-1e592c3c.js → result-list-241ffe8d.js}

@@ -5,10 +5,12 @@ const index$1 = require('./index-e1b40fa6.js');
 const templates = require('./templates-e7b3ffbb.js');
 
 class ElementPool {
-  constructor(container, elementFactory) {
+  constructor(container, elementFactory, eventHandlerFactory) {
     this.container = container;
     this.elementFactory = elementFactory;
+    this.eventHandlerFactory = eventHandlerFactory;
     this.instanceMap = new Map();
+    this.handlerMap = new Map();
     this.elements = [];
   }
   swapHeadToTail(count) {
@@ -60,15 +62,31 @@ class ElementPool {
     this.elements.push(instance.element);
     this.instanceMap.set(instance.element, instance);
     this.container.append(instance.element);
+    this.addEventListeners(instance.element);
     return instance;
   }
+  addEventListeners(element) {
+    var _a;
+    const handlers = (_a = this.eventHandlerFactory) === null || _a === void 0 ? void 0 : _a.call(this, element);
+    handlers === null || handlers === void 0 ? void 0 : handlers.forEach((d) => {
+      element.addEventListener(d.type, d.handler);
+    });
+    this.handlerMap.set(element, handlers !== null && handlers !== void 0 ? handlers : []);
+  }
   deleteElement() {
     const element = this.elements.pop();
     if (element != null) {
       this.instanceMap.delete(element);
       element.remove();
+      this.removeEventListeners(element);
     }
   }
+  removeEventListeners(element) {
+    var _a;
+    (_a = this.handlerMap.get(element)) === null || _a === void 0 ? void 0 : _a.forEach((d) => {
+      element.removeEventListener(d.type, d.handler);
+    });
+  }
 }
 
 const getResultListHeight = (el) => {
@@ -88,6 +106,7 @@ const ResultList = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.enterPressed = index.createEvent(this, "enterPressed", 7);
+    this.resultClick = index.createEvent(this, "resultClick", 7);
     this.computeResultHeight = () => {
       if (this.computedResultHeight == null) {
         const result = this.hostEl.querySelector('*[slot="result"]');
@@ -112,7 +131,7 @@ const ResultList = class {
       }
     };
     this.createResultPool = () => {
-      this.stateMap.resultPool = new ElementPool(this.hostEl, () => this.createResultInstance());
+      this.stateMap.resultPool = new ElementPool(this.hostEl, () => this.createResultInstance(), () => this.createResultHandlers());
     };
     this.createResultInstance = () => {
       if (this.stateMap.resultTemplate != null) {
@@ -124,6 +143,18 @@ const ResultList = class {
         throw new Error('Result template not defined.');
       }
     };
+    this.createResultHandlers = () => {
+      return [
+        {
+          type: 'pointerdown',
+          handler: this.handlePointerDown,
+        },
+        {
+          type: 'click',
+          handler: this.handleResultClick,
+        },
+      ];
+    };
     this.layoutResults = () => {
       var _a, _b, _c, _d;
       const visibleRowCount = this.viewportEndIndex - this.viewportStartIndex + 1;
@@ -144,6 +175,7 @@ const ResultList = class {
           el.style.top = `${(this.viewportStartIndex + index) * this.resultHeight}px`;
           el.style.width = '100%';
           el.setAttribute('is-focused', `${this.viewportStartIndex + index === this.lastFocusedIndex}`);
+          el.setAttribute('data-result-id', result.id);
           binding.bind(result);
         }
       });
@@ -186,6 +218,8 @@ const ResultList = class {
     this.lastStartIndex = 0;
     this.lastFocusedIndex = 0;
     this.stateMap = {};
+    this.handleResultClick = this.handleResultClick.bind(this);
+    this.handlePointerDown = this.handlePointerDown.bind(this);
   }
   handleResultsChanged(results) {
     if (typeof results === 'string') {
@@ -231,6 +265,16 @@ const ResultList = class {
         height: `${this.parsedResults.length * this.resultHeight}px`,
       } }, index.h("slot", null), index.h("slot", { name: "result" })))))));
   }
+  handlePointerDown(event) {
+    event.preventDefault();
+  }
+  handleResultClick(event) {
+    const closestIdElement = event.target.closest('[data-result-id]');
+    const result = this.parsedResults.find((r) => r.id === (closestIdElement === null || closestIdElement === void 0 ? void 0 : closestIdElement.getAttribute('data-result-id')));
+    if (result != null) {
+      this.resultClick.emit(result);
+    }
+  }
   computeViewportResults() {
     const viewportHeight = this.getListHeight();
     if (viewportHeight != null && this.resultHeight > 0) {