@vertexvis/ui 0.0.13-canary.8 → 0.0.13

package/README.md

@@ -20,7 +20,7 @@ dependency to your `package.json`:
 ```json
 {
   "dependencies": {
-    "@vertexvis/ui": "^0.0.12"
+    "@vertexvis/ui": "^0.0.13"
   }
 }
 ```

package/dist/cjs/{auto-resize-textarea-6f700406.js → auto-resize-textarea-923dfeaf.js}

@@ -45,7 +45,9 @@ const AutoResizeTextArea = class {
   }
   componentDidLoad() {
     this.slottedElement = this.getSlottedTextareaElement();
+    this.textValue = this.initialValue;
     this.prepareHiddenTextElement();
+    this.computeRowHeights();
     if (this.slottedElement != null) {
       this.resizeObserver.observe(this.slottedElement);
       this.addEventListener();

package/dist/cjs/{button-a652f98b.js → button-bae89340.js}

@@ -70,7 +70,7 @@ const Button = class {
     if (this.href != null && this.type != null) {
       console.warn('The type attribute is ignored when href is provided');
     }
-    return (index.h(index.Host, null, this.href != null && this.href !== '' ? (index.h("a", { href: this.href, target: this.target, class: classes, tabIndex: this.disabled ? -1 : 0 }, index.h("slot", null))) : (index.h("button", { class: classes, disabled: this.disabled, type: this.type, onClick: (event) => this.handleClick(event) }, index.h("slot", { name: "left" }), index.h("slot", null)))));
+    return (index.h(index.Host, { style: { pointerEvents: this.disabled ? 'none' : undefined } }, this.href != null && this.href !== '' ? (index.h("a", { href: this.href, target: this.target, class: classes, tabIndex: this.disabled ? -1 : 0 }, index.h("slot", null))) : (index.h("button", { class: classes, disabled: this.disabled, type: this.type, onClick: (event) => this.handleClick(event) }, index.h("slot", { name: "left" }), index.h("slot", null)))));
   }
   handleClick(event) {
     if (this.fakeButton != null) {

package/dist/cjs/{click-to-edit-text-field-7a863cd6.js → click-to-edit-text-field-1c9f2920.js}

@@ -3,8 +3,6 @@
 const index = require('./index-4281b6d5.js');
 const index$1 = require('./index-b9715722.js');
 
-const clickToEditTextFieldCss = ".root.sc-vertex-click-to-edit-textfield{display:flex;flex-direction:row;width:100%}.text.sc-vertex-click-to-edit-textfield{display:flex\n  width: 100%;flex-shrink:1;flex-grow:1}.visibility.sc-vertex-click-to-edit-textfield{display:none}.root.sc-vertex-click-to-edit-textfield:not(.disabled):hover .visibility.sc-vertex-click-to-edit-textfield{display:block}.icon-wrapper.sc-vertex-click-to-edit-textfield{display:flex;align-items:center;flex-shrink:0;height:100%\n  vertical-align: middle;margin-left:5px}.hover-icon slot.sc-vertex-click-to-edit-textfield-s>*{height:1rem;width:1rem;padding-left:0.5rem}.button.sc-vertex-click-to-edit-textfield{border-radius:4px;background-color:var(--neutral-200);color:var(--green-700)}.button.sc-vertex-click-to-edit-textfield:hover{background-color:var(--neutral-300);color:var(--green-800)}";
-
 const ClickToEditTextField = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
@@ -16,9 +14,15 @@ const ClickToEditTextField = class {
     var _a;
     /**
      * The size of the text.
-     * Can be "standard," "sm," "md," or "lg" and defaults to "standard".
+     * Can be "standard," "sm," "md," "lg," "xl," or "2xl" and defaults to "standard".
      */
     this.fontSize = 'standard';
+    /**
+     * Whether this input should be displayed as a multiline input.
+     * Rows will have no minimum or maximum by default unless `min-rows`
+     * or `max-rows` are set.
+     */
+    this.multiline = false;
     /**
      * Value for text input.
      */
@@ -29,7 +33,7 @@ const ClickToEditTextField = class {
     this.editing = false;
     this.handleKeyDown = (ev) => {
       var _a, _b;
-      if (ev.detail.key === 'Enter') {
+      if (ev.detail.key === 'Enter' && !this.multiline) {
         (_a = this.textFieldRef) === null || _a === void 0 ? void 0 : _a.blurInput();
       }
       if (ev.detail.key === 'Escape') {
@@ -61,16 +65,16 @@ const ClickToEditTextField = class {
     this.defaultValue = (_a = this.value) === null || _a === void 0 ? void 0 : _a.toString();
   }
   render() {
-    return (index.h("div", { class: "root" }, index.h("div", { class: "text" }, index.h("vertex-textfield", { ref: (element) => {
+    return (index.h("div", { class: "click-to-edit" }, index.h("div", { class: "click-to-edit-text" }, index.h("vertex-textfield", { ref: (element) => {
         this.textFieldRef = element;
-      }, onInputBlur: this.handleInputBlur, onInputFocus: this.handleInputFocus, onInputInput: this.handleInputInput, onInputChange: this.handleInputChange, disabled: this.disabled, fontSize: this.fontSize, autoFocus: this.autoFocus, placeholder: this.placeholder, type: "text", value: this.value, variant: "blank", onTextFieldKeyDown: this.handleKeyDown, "data-testid": "click-to-edit-text-field", hasError: this.hasError })), this.renderIcon()));
+      }, onInputBlur: this.handleInputBlur, onInputFocus: this.handleInputFocus, onInputInput: this.handleInputInput, onInputChange: this.handleInputChange, disabled: this.disabled, fontSize: this.fontSize, autoFocus: this.autoFocus, placeholder: this.placeholder, multiline: this.multiline, minRows: this.minRows, maxRows: this.maxRows, type: "text", value: this.value, variant: "blank", onTextFieldKeyDown: this.handleKeyDown, "data-testid": "click-to-edit-text-field", hasError: this.hasError })), this.renderIcon()));
   }
   renderIcon() {
     if (this.editing) {
-      return (index.h("div", { class: "icon-wrapper" }, index.h("slot", { name: "edit-icon" }, index.h("div", { class: "button" }, index.h("vertex-icon-button", { iconSize: "sm", iconName: "check" })))));
+      return (index.h("div", { class: "click-to-edit-icon-wrapper" }, index.h("slot", { name: "edit-icon" }, index.h("div", { class: "click-to-edit-button" }, index.h("vertex-icon-button", { iconSize: "sm", iconName: "check" })))));
     }
     else if (!this.disabled) {
-      return (index.h("div", { class: "icon-wrapper" }, index.h("slot", { name: "hover-icon" }, index.h("vertex-icon", { size: "sm", name: "pencil", class: index$1.classnames('visibility', 'hoverIcon') }))));
+      return (index.h("div", { class: "click-to-edit-icon-wrapper" }, index.h("slot", { name: "pencil-icon" }, index.h("vertex-icon", { size: "sm", name: "pencil", class: index$1.classnames('icon-visibility', 'hover-icon') }))));
     }
     else {
       return index.h("div", null);
@@ -106,6 +110,5 @@ const ClickToEditTextField = class {
     "value": ["handleValueChanged"]
   }; }
 };
-ClickToEditTextField.style = clickToEditTextFieldCss;
 
 exports.ClickToEditTextField = ClickToEditTextField;

package/dist/cjs/components.cjs.js

@@ -65,5 +65,5 @@ 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],"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-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-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-dialog.cjs",[[1,"vertex-dialog",{"open":[1540],"fullscreen":[4]},[[4,"keydown","keyDownListener"]]]]],["vertex-toggle.cjs",[[1,"vertex-toggle",{"variant":[1],"disabled":[4],"checked":[1540]}]]],["vertex-tooltip.cjs",[[1,"vertex-tooltip",{"content":[1],"disabled":[4],"placement":[1],"delay":[2],"animated":[4],"open":[32]}]]],["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],"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-slider.cjs",[[1,"vertex-slider",{"min":[2],"max":[2],"step":[8],"value":[1026],"disabled":[4]}]]],["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-auto-resize-textarea.cjs",[[1,"vertex-auto-resize-textarea",{"textareaSelector":[1,"textarea-selector"],"minRows":[514,"min-rows"],"maxRows":[514,"max-rows"],"textValue":[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-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-menu.cjs",[[1,"vertex-menu",{"animated":[4],"open":[1540],"placement":[1],"fallbackPlacements":[16],"position":[1040]}]]],["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],"backdrop":[4],"animated":[4],"anchorSelector":[1,"anchor-selector"],"boundarySelector":[1,"boundary-selector"],"resizeBehavior":[1,"resize-behavior"],"overflowBehavior":[16],"flipBehavior":[16],"updateOnResize":[4,"update-on-resize"],"contentResizeObserverFactory":[16],"popperRendered":[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],"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],"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],"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]}]]],["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],"backdrop":[4],"animated":[4],"anchorSelector":[1,"anchor-selector"],"boundarySelector":[1,"boundary-selector"],"resizeBehavior":[1,"resize-behavior"],"overflowBehavior":[16],"flipBehavior":[16],"updateOnResize":[4,"update-on-resize"],"contentResizeObserverFactory":[16],"popperRendered":[32]}]]]], options);
 });

package/dist/cjs/dialog-fb6cfed9.js

@@ -0,0 +1,225 @@
+'use strict';
+
+const index = require('./index-4281b6d5.js');
+const index$1 = require('./index-b9715722.js');
+
+function readDOM(callback) {
+  index.readTask(callback);
+}
+function getBoundingClientRect(el) {
+  return el.getBoundingClientRect();
+}
+function getComputedStyle(el) {
+  return window.getComputedStyle(el);
+}
+
+const dialogCss = ":host{--backdrop-color:rgba(0,0,0,0.4);--z-index:var(--vertex-ui-dialog-layer)}.hidden>.dialog{opacity:0;width:0;height:0;visibility:hidden}.hidden{pointer-events:none;display:none}.close{margin-left:auto}.header{width:100%;display:flex;font-size:1.125rem;height:2rem;margin-bottom:1rem}.body{position:relative;width:100%;height:100%}.dialog-backdrop{position:fixed;z-index:var(--z-index);left:0;top:0;width:100%;height:100%;overflow:auto;background-color:var(--backdrop-color);padding:2rem;box-sizing:border-box}.dialog{background-color:var(--vertex-ui-white);position:absolute;align-items:center;color:var(--vertex-ui-neutral-800);font-family:var(--vertex-ui-font-family);overflow:hidden}.dialog.no-select{user-select:none}.overlay{top:50%;left:50%;transform:translate(-50%, -50%);border:1px solid var(--vertex-ui-neutral-300);border-radius:6px;min-width:var(--min-width, var(--vertex-ui-min-dialog-width));box-shadow:0 1px 2px rgba(0, 0, 0, 0.15);display:flex}.overlay.resizable{min-height:var(--min-height, var(--vertex-ui-min-dialog-height))}.fullscreen{height:100vh;width:100vw}.contents{display:flex;position:relative;flex-direction:column;padding:1.5rem;width:100%;height:100%;box-sizing:border-box}.close:hover,.close:focus{color:black;text-decoration:none;cursor:pointer}.footer{display:flex}.resize{cursor:nwse-resize;position:absolute;bottom:0.125rem;right:0.125rem}.resize-cursor{cursor:nwse-resize}";
+
+const Dialog = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.backdropClick = index.createEvent(this, "backdropClick", 7);
+    this.closed = index.createEvent(this, "closed", 7);
+    /**
+     * Whether this dialog's content is visible.
+     */
+    this.open = false;
+    /**
+     * Whether this dialog should be full screen
+     */
+    this.fullscreen = false;
+    /**
+     * Whether this dialog can be resized.
+     */
+    this.resizable = false;
+    this.isResizing = false;
+    this.handleKeyDown = (_) => {
+      if (this.open) {
+        this.open = false;
+      }
+    };
+    this.handlePointerDown = (e) => {
+      this.isResizing = true;
+      readDOM(() => {
+        if (this.dialogElement != null) {
+          const boundingRect = getBoundingClientRect(this.dialogElement);
+          this.initialDialogBoundingRect = boundingRect;
+          this.lastPointerPosition = {
+            x: boundingRect.right,
+            y: boundingRect.bottom,
+          };
+        }
+      });
+      window.addEventListener('pointermove', this.handlePointerMove);
+      window.addEventListener('pointerup', this.handlePointerUp);
+    };
+    this.handlePointerMove = (e) => {
+      if (this.lastPointerPosition != null &&
+        this.initialDialogBoundingRect != null &&
+        this.width != null &&
+        this.height != null) {
+        const diffX = e.clientX - this.lastPointerPosition.x;
+        const diffY = e.clientY - this.lastPointerPosition.y;
+        const expectedWidth = this.width + diffX * 2;
+        const expectedHeight = this.height + diffY * 2;
+        this.width = this.constrainDimension(expectedWidth, this.getMinWidth(), this.getMaxWidth());
+        this.height = this.constrainDimension(expectedHeight, this.getMinHeight(), this.getMaxHeight());
+        this.lastPointerPosition = {
+          x: this.constrainX(e.clientX, this.width, this.initialDialogBoundingRect),
+          y: this.constrainY(e.clientY, this.height, this.initialDialogBoundingRect),
+        };
+      }
+    };
+    this.handlePointerUp = (e) => {
+      this.lastPointerPosition = undefined;
+      this.initialDialogBoundingRect = undefined;
+      this.isResizing = false;
+      window.removeEventListener('pointermove', this.handlePointerMove);
+      window.removeEventListener('pointerup', this.handlePointerUp);
+    };
+    this.constrainDimension = (value, min, max) => {
+      return Math.min(Math.max(value, min), max);
+    };
+    this.constrainX = (x, width, bounds) => {
+      if (width <= this.getMinWidth()) {
+        return bounds.right;
+      }
+      else if (width >= this.getMinHeight()) {
+        return bounds.right + (width - bounds.width) / 2;
+      }
+      return x;
+    };
+    this.constrainY = (y, height, bounds) => {
+      if (height <= this.getMinHeight()) {
+        return bounds.bottom;
+      }
+      else if (height >= this.getMaxHeight()) {
+        return bounds.bottom + (height - bounds.height) / 2;
+      }
+      return y;
+    };
+    this.getMaxWidth = () => {
+      var _a;
+      return (_a = this.maxWidth) !== null && _a !== void 0 ? _a : Number.POSITIVE_INFINITY;
+    };
+    this.getMaxHeight = () => {
+      var _a;
+      return (_a = this.maxHeight) !== null && _a !== void 0 ? _a : Number.POSITIVE_INFINITY;
+    };
+    this.getMinWidth = () => {
+      var _a;
+      return (_a = this.minWidth) !== null && _a !== void 0 ? _a : Number.NEGATIVE_INFINITY;
+    };
+    this.getMinHeight = () => {
+      var _a;
+      return (_a = this.minHeight) !== null && _a !== void 0 ? _a : Number.NEGATIVE_INFINITY;
+    };
+    this.resize = () => {
+      readDOM(() => {
+        if (this.backdropElement != null) {
+          const styles = getComputedStyle(this.backdropElement);
+          const boundaryPadding = parseFloat(styles.padding);
+          this.boundaryPadding = isNaN(boundaryPadding) ? 0 : boundaryPadding;
+          this.maxHeight = window.innerHeight - this.boundaryPadding * 2;
+          this.maxWidth = window.innerWidth - this.boundaryPadding * 2;
+          this.width =
+            this.width != null ? Math.min(this.maxWidth, this.width) : undefined;
+          this.height =
+            this.height != null
+              ? Math.min(this.maxHeight, this.height)
+              : undefined;
+        }
+      });
+    };
+    this.handleKeyDown = this.handleKeyDown.bind(this);
+    this.mutationObserver = new MutationObserver(this.resize);
+    this.resizeObserver = new ResizeObserver(this.resize);
+  }
+  componentDidLoad() {
+    window.addEventListener('resize', this.resize);
+    this.mutationObserver.observe(this.hostEl, {
+      attributes: true,
+      attributeFilter: ['style'],
+    });
+    this.resizeObserver.observe(this.hostEl);
+  }
+  componentWillRender() {
+    if (this.open && this.width == null && this.height == null) {
+      readDOM(() => {
+        if (this.dialogElement != null) {
+          const boundingRect = getBoundingClientRect(this.dialogElement);
+          this.minWidth = boundingRect.width;
+          this.minHeight = boundingRect.height;
+          this.width = this.minWidth;
+          this.height = this.minHeight;
+          this.resize();
+        }
+      });
+    }
+  }
+  disconnectedCallback() {
+    this.width = undefined;
+    this.height = undefined;
+    this.lastPointerPosition = undefined;
+    this.isResizing = false;
+  }
+  clearComputedValues() {
+    this.width = undefined;
+    this.height = undefined;
+    this.minWidth = undefined;
+    this.minHeight = undefined;
+    this.maxWidth = undefined;
+    this.maxHeight = undefined;
+  }
+  updateOpened(open) {
+    if (!open) {
+      this.closed.emit();
+    }
+  }
+  keyDownListener(ev) {
+    if (this.open && ev.key === 'Escape') {
+      this.open = false;
+    }
+  }
+  render() {
+    var _a, _b;
+    const width = this.width != null || this.minWidth != null
+      ? `${(_a = this.width) !== null && _a !== void 0 ? _a : this.minWidth}px`
+      : undefined;
+    const height = this.height != null || this.minHeight != null
+      ? `${(_b = this.height) !== null && _b !== void 0 ? _b : this.minHeight}px`
+      : undefined;
+    return (index.h("div", { ref: (el) => {
+        this.backdropElement = el;
+      }, onPointerDown: () => {
+        this.backdropClick.emit();
+      }, class: index$1.classnames('dialog-backdrop', {
+        hidden: !this.open,
+        'resize-cursor': this.isResizing,
+      }) }, index.h("div", { ref: (el) => {
+        this.dialogElement = el;
+      }, class: index$1.classnames('dialog', {
+        resizable: this.resizable,
+        fullscreen: this.fullscreen,
+        overlay: !this.fullscreen,
+        'no-select': this.lastPointerPosition != null,
+      }), onPointerDown: (e) => {
+        e.stopPropagation();
+      }, style: this.resizable && !this.fullscreen
+        ? {
+          width,
+          height,
+        }
+        : undefined }, index.h("div", { class: "contents" }, index.h("slot", { name: "header" }, index.h("div", { class: "header" }, index.h("slot", { name: "heading" }), index.h("div", { class: "close" }, index.h("slot", { name: "close-dialog" }, index.h("vertex-icon-button", { onPointerDown: () => {
+        this.open = false;
+      }, iconSize: "sm", iconName: "close" }))))), index.h("div", { class: "body" }, index.h("slot", null)), index.h("div", { class: "footer" }, index.h("slot", { name: "footer" }, index.h("slot", { name: "footer-actions" }))), this.resizable && !this.fullscreen && (index.h("vertex-icon", { class: "resize", onPointerDown: this.handlePointerDown, name: "resize", size: "xs" }))))));
+  }
+  get hostEl() { return index.getElement(this); }
+  static get watchers() { return {
+    "resizable": ["clearComputedValues"],
+    "open": ["updateOpened"]
+  }; }
+};
+Dialog.style = dialogCss;
+
+exports.Dialog = Dialog;

package/dist/cjs/{draggable-popover-14f7893a.js → draggable-popover-daaccc8d.js}

@@ -8,6 +8,7 @@ const draggablePopoverCss = "button{border:none;background-color:transparent;fon
 const DraggablePopover = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.positionChanged = index.createEvent(this, "positionChanged", 7);
     this.anchorPosition = { x: 0, y: 0 };
     this.lastPosition = { x: 0, y: 0 };
     this.dragging = false;
@@ -57,6 +58,9 @@ const DraggablePopover = class {
       this.lastPosition = this.anchorPosition;
     }
   }
+  lastPositionChanged() {
+    this.positionChanged.emit(this.anchorPosition);
+  }
   render() {
     return (index.h("vertex-popover", { position: this.anchorPosition, boundarySelector: this.boundarySelector, backdrop: false, open: true, resizeBehavior: "fixed", updateOnResize: !this.dragging, overflowBehavior: {
         options: {
@@ -72,7 +76,8 @@ const DraggablePopover = class {
       } }, index.h("div", { ref: (el) => (this.containerEl = el), class: index$1.classnames('container', { dragging: this.dragging }) }, index.h("div", { class: "icon-container" }, index.h("div", { class: "icon", onPointerDown: this.handlePointerDown }, index.h("slot", { name: "drag-icon" }, index.h("vertex-icon", { size: "sm", name: "drag-indicator" })))), index.h("slot", null))));
   }
   static get watchers() { return {
-    "position": ["updatePosition"]
+    "position": ["updatePosition"],
+    "lastPosition": ["lastPositionChanged"]
   }; }
 };
 DraggablePopover.style = draggablePopoverCss;

package/dist/cjs/{icon-326179a0.js → icon-b03c2f5b.js}

@@ -2,7 +2,7 @@
 
 const index = require('./index-4281b6d5.js');
 const index$1 = require('./index-b9715722.js');
-const iconHelper = require('./icon-helper-49a5185e.js');
+const iconHelper = require('./icon-helper-6bd9ce5e.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-05f39b69.js → icon-button-5bcecec5.js}

@@ -1,7 +1,7 @@
 'use strict';
 
 const index = require('./index-4281b6d5.js');
-const iconHelper = require('./icon-helper-49a5185e.js');
+const iconHelper = require('./icon-helper-6bd9ce5e.js');
 const index$1 = require('./index-b9715722.js');
 
 const iconButtonCss = "button{border:none;background-color:transparent;font-family:var(--vertex-ui-font-family);font-size:0.875rem;padding:0}:host{--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)}.container{display:flex;justify-content:center;align-items:center;outline:none;fill:currentColor;color:currentColor;cursor:pointer}.container:not(.plain){border-radius:4px;padding:0.25rem}.icon-button{display:flex;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%}.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:not-allowed}.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:not-allowed;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)}";

package/dist/cjs/{icon-helper-49a5185e.js → icon-helper-6bd9ce5e.js}

@@ -114,6 +114,9 @@ const CommentResolve = () => (index.h("svg", { xmlns: "http://www.w3.org/2000/sv
 const CommentShow = () => (index.h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 16 16", "data-testid": "comment-show" },
   index.h("path", { d: "M11.5,8h-7a.5.5,0,0,0,0,1h7a.5.5,0,0,0,0-1Zm0-3h-7a.5.5,0,0,0,0,1h7a.5.5,0,0,0,0-1Zm2-3H2.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,2Zm.5,8.5a.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,3h11a.5.5,0,0,1,.5.5Z" })));
 
+const Copy = () => (index.h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 16 16", "data-testid": "copy" },
+  index.h("path", { d: "M13.51,1h-8A1.51,1.51,0,0,0,4,2.52V4H2.51A1.5,1.5,0,0,0,1,5.5v8A1.5,1.5,0,0,0,2.51,15h8A1.5,1.5,0,0,0,12,13.5V12h1.51a1.5,1.5,0,0,0,1.5-1.5v-8A1.5,1.5,0,0,0,13.51,1ZM11,13.5a.5.5,0,0,1-.5.5h-8a.5.5,0,0,1-.5-.5v-8a.5.5,0,0,1,.5-.5h8a.5.5,0,0,1,.5.5Zm3-3a.51.51,0,0,1-.5.5H12V5.5A1.5,1.5,0,0,0,10.5,4H5V2.52a.51.51,0,0,1,.5-.5h8a.51.51,0,0,1,.5.5Z" })));
+
 const CrossSection = () => (index.h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 16 16", "data-testid": "cross-section" },
   index.h("path", { d: "M4.5,13a.51.51,0,1,0,.35.15A.47.47,0,0,0,4.5,13ZM4.35,4.35a.49.49,0,0,0-.7-.7h0a.5.5,0,0,0,.71.71ZM4.5,5a.5.5,0,0,0-.35.85.5.5,0,1,0,.7-.7A.47.47,0,0,0,4.5,5ZM5.85,2.15a.48.48,0,0,0-.7,0,.48.48,0,0,0,0,.7A.5.5,0,0,0,6,2.5.47.47,0,0,0,5.85,2.15ZM9.67,2,10,1.67A.52.52,0,0,0,10.5,2a.5.5,0,0,0,.5-.5V.5a.41.41,0,0,0,0-.19A.51.51,0,0,0,10.69,0a.5.5,0,0,0-.38,0,.36.36,0,0,0-.16.11h0L8,2.34A.5.5,0,1,0,7.33,3L6.15,4.15A.47.47,0,0,0,6,4.5v11H6a.41.41,0,0,0,0,.19.51.51,0,0,0,.27.27.41.41,0,0,0,.19,0h0a.41.41,0,0,0,.19,0,.36.36,0,0,0,.16-.11l2-2a.5.5,0,1,0-.71-.71L7,14.29V4.71l2-2A.5.5,0,1,0,9.67,2ZM2.5,5a.47.47,0,0,0-.35.15.48.48,0,0,0,0,.7.48.48,0,0,0,.7,0A.5.5,0,0,0,2.5,5Zm0,2a.5.5,0,1,0,.5.5A.5.5,0,0,0,2.5,7ZM8.15,5.15A.48.48,0,1,0,8.5,5,.47.47,0,0,0,8.15,5.15ZM13.5,3h0a.51.51,0,0,0,.5-.5.47.47,0,0,0-.15-.35A.47.47,0,0,0,13.52,2h0a.47.47,0,0,0-.35.15.48.48,0,0,0,0,.7A.47.47,0,0,0,13.5,3ZM2.5,13a.47.47,0,0,0-.35.15.48.48,0,0,0,0,.7.48.48,0,0,0,.7,0A.5.5,0,0,0,2.5,13Zm0-4a.5.5,0,1,0,.5.5A.5.5,0,0,0,2.5,9Zm0,2a.5.5,0,1,0,.5.5A.5.5,0,0,0,2.5,11Zm11-3a.5.5,0,0,0-.5.5.49.49,0,0,0,.49.5.5.5,0,1,0,0-1Zm-3,5h0a.5.5,0,0,0,0,1h0a.5.5,0,0,0,0-1Zm3-3a.51.51,0,1,0,.35.15A.47.47,0,0,0,13.48,10Zm0-4a.5.5,0,0,0-.5.5.5.5,0,0,0,.5.5.5.5,0,0,0,0-1Zm0-2a.5.5,0,0,0-.5.5.49.49,0,0,0,.49.5.5.5,0,1,0,0-1Zm-1.87,7.65h0a.49.49,0,0,0,.7.7h0a.5.5,0,0,0-.71-.71Zm0-8h0a.48.48,0,0,0,0,.7.49.49,0,0,0,.7,0h0a.5.5,0,0,0,0-.71A.48.48,0,0,0,11.67,3.64ZM10.5,9a.5.5,0,1,0,.5.5A.5.5,0,0,0,10.5,9Zm0,2a.5.5,0,1,0,.5.5A.5.5,0,0,0,10.5,11Zm0-4a.5.5,0,1,0,.5.5A.5.5,0,0,0,10.5,7ZM12,2.5a.5.5,0,1,0-.5.5A.5.5,0,0,0,12,2.5ZM10.5,5a.5.5,0,0,0-.35.85.5.5,0,1,0,.7-.7A.47.47,0,0,0,10.5,5Z" })));
 
@@ -218,6 +221,25 @@ const PersonRun = () => (index.h("svg", { xmlns: "http://www.w3.org/2000/svg", v
 const PersonWalk = () => (index.h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 16 16", "data-testid": "person-walk" },
   index.h("path", { d: "M9,7.71l1.15,1.14a.49.49,0,0,0,.7-.7L9,6.29ZM7.5,4A1.5,1.5,0,1,0,6,2.5,1.5,1.5,0,0,0,7.5,4Zm0-2a.5.5,0,1,1-.5.5A.5.5,0,0,1,7.5,2ZM10,11.34l-.12-.19L8,9.29v-4l-.15-.14-.06,0,0,0h0L7.56,5h0l-.22,0h0l-2,1a.51.51,0,0,0-.23.23l-1,2a.5.5,0,0,0,.9.44l.92-1.85L7,6.31V9.5a.52.52,0,0,0,.14.35l1.07,1.06h0l.85.85,1,2.89a.5.5,0,0,0,.94-.32ZM4.1,14.2a.5.5,0,0,0,.8.6l2.48-3.3-.72-.72Z" })));
 
+const PersonHeight = () => (index.h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 16 16", "data-testid": "person-height" },
+  index.h("g", { fill: "none", stroke: "currentColor" },
+    index.h("path", { "stroke-linejoin": "round", d: "M1.03 1.152h7.804ZM1.03 14.91h7.804ZM6.77 12.088l-1.526 1.525ZM3.671 12.075 5.196 13.6Z" }),
+    index.h("path", { "stroke-linecap": "round", "stroke-linejoin": "round", d: "m12.072 11.029-1.846 3.196zM12.072 11.029l1.845 3.196zM12.072 6.266l-1.846 3.196ZM12.072 6.266l1.845 3.196Z" }),
+    index.h("ellipse", { cx: "12.049", cy: "3.094", "paint-order": "markers stroke fill", rx: "1.104", ry: "1.075" }),
+    index.h("path", { "stroke-linejoin": "round", d: "M6.77 3.957 5.243 2.432ZM3.671 3.97l1.525-1.525ZM5.222 2.987v10.14ZM12.072 10.967v-5.23Z" }))));
+
+const PersonShort = () => (index.h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 16 16", "data-testid": "person-short" },
+  index.h("g", { fill: "none", stroke: "currentColor" },
+    index.h("path", { "stroke-linecap": "round", "stroke-linejoin": "round", d: "m8.293 12.86-2.158 2.374ZM8.293 12.86l2.157 2.374zM8.293 9.325l-2.158 2.373ZM8.293 9.325l2.157 2.373Z" }),
+    index.h("path", { "stroke-linejoin": "round", d: "M8.293 12.815V8.932Z" }),
+    index.h("ellipse", { cx: "8.242", cy: "6.771", "paint-order": "markers stroke fill", rx: ".981", ry: ".956" }))));
+
+const PersonTall = () => (index.h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 16 16", "data-testid": "person-tall" },
+  index.h("g", { fill: "none", stroke: "currentColor" },
+    index.h("path", { "stroke-linecap": "round", "stroke-linejoin": "round", d: "m8.074 11.39-2.158 3.736ZM8.074 11.39l2.157 3.736zM8.074 5.82 5.916 9.559ZM8.074 5.82l2.157 3.738Z" }),
+    index.h("ellipse", { cx: "8.047", cy: "2.448", "paint-order": "markers stroke fill", rx: "1.29", ry: "1.256" }),
+    index.h("path", { "stroke-linejoin": "round", d: "M8.074 11.317V5.202Z" }))));
+
 const PinFill = () => (index.h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 16 16", "data-testid": "pin-fill" },
   index.h("path", { d: "M8,.55A5.9,5.9,0,0,0,2.1,6.44a9.14,9.14,0,0,0,2.66,6.24,11.44,11.44,0,0,0,1.93,1.65,7.43,7.43,0,0,0,.73.44l.28.12a.78.78,0,0,0,.6,0,6.65,6.65,0,0,0,1.34-.79,11.79,11.79,0,0,0,2.76-2.88,8.59,8.59,0,0,0,1.5-4.78A5.9,5.9,0,0,0,8,.55ZM8,8.44a2,2,0,1,1,2-2A2,2,0,0,1,8,8.44Z" })));
 
@@ -289,6 +311,9 @@ const VisibilityVisible = () => (index.h("svg", { xmlns: "http://www.w3.org/2000
 const Zoom = () => (index.h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 16 16", "data-testid": "zoom" },
   index.h("path", { d: "M6.85,3.15a.48.48,0,0,0-.7,0l-2,2a.49.49,0,0,0,.7.7L6.5,4.21,8.15,5.85a.49.49,0,0,0,.7-.7Zm1.3,4L6.5,8.79,4.85,7.15a.49.49,0,0,0-.7.7l2,2a.48.48,0,0,0,.7,0l2-2a.49.49,0,0,0-.7-.7Zm6.7,7-4-4a.37.37,0,0,0-.2-.12,5.45,5.45,0,1,0-.62.62.37.37,0,0,0,.12.2l4,4a.49.49,0,0,0,.7-.7ZM9.71,9.71a4.51,4.51,0,0,1-6.42,0,4.51,4.51,0,0,1,0-6.42,4.51,4.51,0,0,1,6.42,0,4.51,4.51,0,0,1,0,6.42Z" })));
 
+const Resize = () => (index.h("svg", { "data-testid": "resize", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 16 16" },
+  index.h("path", { d: "\n             M14.5,14.5\n             l1-1\n             a.2.2,0,0,0-.75-.75\n             L13.75,13.75\n             l-1,1\n             a.2.2,0,0,0.75.75Z\n             M14.5,10.5\n             l1-1\n             a.2.2,0,0,0-.75-.75\n             L9.75,13.75\n             l-1,1\n             a.2.2,0,0,0.75.75Z\n             M14.5,6.5\n             l1-1\n             a.2.2,0,0,0-.75-.75\n             L5.75,13.75\n             l-1,1\n             a.2.2,0,0,0.75.75Z\n             M14.5,2.5\n             l1-1\n             a.2.2,0,0,0-.75-.75\n             L1.75,13.75\n             l-1,1\n             a.2.2,0,0,0.75.75Z" })));
+
 function getSvg(name) {
   switch (name) {
     case 'adjustments':
@@ -363,6 +388,8 @@ function getSvg(name) {
       return index.h(CommentResolve, null);
     case 'comment-show':
       return index.h(CommentShow, null);
+    case 'copy':
+      return index.h(Copy, null);
     case 'cross-section':
       return index.h(CrossSection, null);
     case 'cube-orthographic':
@@ -421,8 +448,14 @@ function getSvg(name) {
       return index.h(Pan, null);
     case 'pencil':
       return index.h(Pencil, null);
+    case 'person-height':
+      return index.h(PersonHeight, null);
     case 'person-run':
       return index.h(PersonRun, null);
+    case 'person-short':
+      return index.h(PersonShort, null);
+    case 'person-tall':
+      return index.h(PersonTall, null);
     case 'person-walk':
       return index.h(PersonWalk, null);
     case 'pin-fill':
@@ -441,6 +474,8 @@ function getSvg(name) {
       return index.h(Rabbit, null);
     case 'reset':
       return index.h(Reset, null);
+    case 'resize':
+      return index.h(Resize, null);
     case 'rotate':
       return index.h(Rotate, null);
     case 'ruler':

package/dist/cjs/index.cjs.js

@@ -2,29 +2,29 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const autoResizeTextarea = require('./auto-resize-textarea-6f700406.js');
+const autoResizeTextarea = require('./auto-resize-textarea-923dfeaf.js');
 const avatar = require('./avatar-1a0305f3.js');
 const avatarGroup = require('./avatar-group-3e79ca71.js');
-const button = require('./button-a652f98b.js');
+const button = require('./button-bae89340.js');
 const card = require('./card-2bccb1e2.js');
 const cardGroup = require('./card-group-268041cb.js');
 const chip = require('./chip-63de5487.js');
-const clickToEditTextField = require('./click-to-edit-text-field-7a863cd6.js');
+const clickToEditTextField = require('./click-to-edit-text-field-1c9f2920.js');
 const collapsible = require('./collapsible-fca4d66d.js');
 const colorCircle = require('./color-circle-779577d6.js');
 const colorPicker = require('./color-picker-84d0d7d7.js');
 const colorCirclePicker = require('./color-circle-picker-56ea92c0.js');
 const contextMenu = require('./context-menu-a86e89ca.js');
-const dialog = require('./dialog-f1220dc7.js');
-const draggablePopover = require('./draggable-popover-14f7893a.js');
+const dialog = require('./dialog-fb6cfed9.js');
+const draggablePopover = require('./draggable-popover-daaccc8d.js');
 const dropdownMenu = require('./dropdown-menu-0f605871.js');
 const expandable = require('./expandable-724c3988.js');
 const helpTooltip = require('./help-tooltip-3aaffd14.js');
-const menu = require('./menu-27013a38.js');
+const menu = require('./menu-ca39ac15.js');
 const menuDivider = require('./menu-divider-958fc5aa.js');
 const menuItem = require('./menu-item-51632152.js');
-const icon = require('./icon-326179a0.js');
-const iconButton = require('./icon-button-05f39b69.js');
+const icon = require('./icon-b03c2f5b.js');
+const iconButton = require('./icon-button-5bcecec5.js');
 const logoLoading = require('./logo-loading-f5b077a7.js');
 const popover = require('./popover-e8c564b3.js');
 const radio = require('./radio-6ad34c3d.js');
@@ -33,15 +33,15 @@ const resizable = require('./resizable-513835d0.js');
 const resultList = require('./result-list-ad4e4841.js');
 const searchBar = require('./search-bar-e850615c.js');
 const select = require('./select-bccc8f37.js');
-const slider = require('./slider-b24243c2.js');
+const slider = require('./slider-3488ff5a.js');
 const spinner = require('./spinner-5e2183ef.js');
-const textField = require('./text-field-0428fadb.js');
+const textField = require('./text-field-aceff1f6.js');
 const toast = require('./toast-2a577075.js');
 const toggle = require('./toggle-fc23c62a.js');
 const tooltip = require('./tooltip-66a2fb31.js');
 require('./index-4281b6d5.js');
 require('./index-b9715722.js');
-require('./icon-helper-49a5185e.js');
+require('./icon-helper-6bd9ce5e.js');
 require('./templates-4243180f.js');
 
 

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],"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-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-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-dialog.cjs",[[1,"vertex-dialog",{"open":[1540],"fullscreen":[4]},[[4,"keydown","keyDownListener"]]]]],["vertex-toggle.cjs",[[1,"vertex-toggle",{"variant":[1],"disabled":[4],"checked":[1540]}]]],["vertex-tooltip.cjs",[[1,"vertex-tooltip",{"content":[1],"disabled":[4],"placement":[1],"delay":[2],"animated":[4],"open":[32]}]]],["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],"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-slider.cjs",[[1,"vertex-slider",{"min":[2],"max":[2],"step":[8],"value":[1026],"disabled":[4]}]]],["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-auto-resize-textarea.cjs",[[1,"vertex-auto-resize-textarea",{"textareaSelector":[1,"textarea-selector"],"minRows":[514,"min-rows"],"maxRows":[514,"max-rows"],"textValue":[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-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-menu.cjs",[[1,"vertex-menu",{"animated":[4],"open":[1540],"placement":[1],"fallbackPlacements":[16],"position":[1040]}]]],["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],"backdrop":[4],"animated":[4],"anchorSelector":[1,"anchor-selector"],"boundarySelector":[1,"boundary-selector"],"resizeBehavior":[1,"resize-behavior"],"overflowBehavior":[16],"flipBehavior":[16],"updateOnResize":[4,"update-on-resize"],"contentResizeObserverFactory":[16],"popperRendered":[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],"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],"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],"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]}]]],["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],"backdrop":[4],"animated":[4],"anchorSelector":[1,"anchor-selector"],"boundarySelector":[1,"boundary-selector"],"resizeBehavior":[1,"resize-behavior"],"overflowBehavior":[16],"flipBehavior":[16],"updateOnResize":[4,"update-on-resize"],"contentResizeObserverFactory":[16],"popperRendered":[32]}]]]], options);
   });
 };