@vertexvis/ui 0.1.0-canary.6 → 0.1.0-canary.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (52) hide show
  1. package/dist/cjs/components.cjs.js +1 -1
  2. package/dist/cjs/index.cjs.js +3 -3
  3. package/dist/cjs/loader.cjs.js +1 -1
  4. package/dist/cjs/{result-list-1e592c3c.js → result-list-241ffe8d.js} +46 -2
  5. package/dist/cjs/search-bar-91cbcd07.js +421 -0
  6. package/dist/cjs/{text-field-0397fb34.js → text-field-bccbde1f.js} +1 -0
  7. package/dist/cjs/vertex-result-list.cjs.entry.js +1 -1
  8. package/dist/cjs/vertex-search-bar.cjs.entry.js +1 -1
  9. package/dist/cjs/vertex-textfield.cjs.entry.js +1 -1
  10. package/dist/collection/collection-manifest.json +1 -1
  11. package/dist/collection/components/result-list/result-list.js +52 -5
  12. package/dist/collection/components/result-list/types.js +1 -0
  13. package/dist/collection/components/search-bar/dom.js +12 -0
  14. package/dist/collection/components/search-bar/lib.js +35 -15
  15. package/dist/collection/components/search-bar/search-bar.css +0 -16
  16. package/dist/collection/components/search-bar/search-bar.js +380 -324
  17. package/dist/collection/components/text-field/text-field.js +1 -0
  18. package/dist/collection/util/templates/element-pool.js +19 -1
  19. package/dist/components/components.css +1 -1
  20. package/dist/components/components.esm.js +1 -1
  21. package/dist/components/index.esm.js +1 -1
  22. package/dist/components/p-406e73da.entry.js +1 -0
  23. package/dist/components/p-43b1b3f9.js +1 -0
  24. package/dist/components/p-6b862967.js +1 -0
  25. package/dist/components/p-cfe369bf.entry.js +1 -0
  26. package/dist/components/p-db34f10c.js +1 -0
  27. package/dist/components/p-ee496965.entry.js +1 -0
  28. package/dist/esm/components.js +1 -1
  29. package/dist/esm/index.js +3 -3
  30. package/dist/esm/loader.js +1 -1
  31. package/dist/esm/{result-list-36cfb08a.js → result-list-16c6afbd.js} +46 -2
  32. package/dist/esm/search-bar-f12a3599.js +419 -0
  33. package/dist/esm/{text-field-e542da25.js → text-field-32ac877e.js} +1 -0
  34. package/dist/esm/vertex-result-list.entry.js +1 -1
  35. package/dist/esm/vertex-search-bar.entry.js +1 -1
  36. package/dist/esm/vertex-textfield.entry.js +1 -1
  37. package/dist/types/components/result-list/result-list.d.ts +6 -1
  38. package/dist/types/components/result-list/types.d.ts +4 -0
  39. package/dist/types/components/search-bar/dom.d.ts +3 -0
  40. package/dist/types/components/search-bar/lib.d.ts +24 -6
  41. package/dist/types/components/search-bar/search-bar.d.ts +124 -42
  42. package/dist/types/components.d.ts +81 -20
  43. package/dist/types/util/templates/element-pool.d.ts +10 -1
  44. package/package.json +4 -3
  45. package/dist/cjs/search-bar-bb40cfa7.js +0 -290
  46. package/dist/components/p-19318fee.entry.js +0 -1
  47. package/dist/components/p-209db2ba.entry.js +0 -1
  48. package/dist/components/p-4224c2ad.js +0 -1
  49. package/dist/components/p-52739247.js +0 -1
  50. package/dist/components/p-ae6a3c46.entry.js +0 -1
  51. package/dist/components/p-bd11e7d1.js +0 -1
  52. package/dist/esm/search-bar-59cc151d.js +0 -288
@@ -88,7 +88,7 @@ const patchDynamicImport = (base, orgScriptElm) => {
88
88
  };
89
89
 
90
90
  patchBrowser().then(options => {
91
- 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],"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);
91
+ 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],"replacementUriType":[1,"replacement-uri-type"],"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);
92
92
  });
93
93
 
94
94
  exports.setNonce = index.setNonce;
@@ -31,12 +31,12 @@ const popover = require('./popover-942209b8.js');
31
31
  const radio = require('./radio-bff991d2.js');
32
32
  const radioGroup = require('./radio-group-d628f631.js');
33
33
  const resizable = require('./resizable-e4248256.js');
34
- const resultList = require('./result-list-1e592c3c.js');
35
- const searchBar = require('./search-bar-bb40cfa7.js');
34
+ const resultList = require('./result-list-241ffe8d.js');
35
+ const searchBar = require('./search-bar-91cbcd07.js');
36
36
  const select = require('./select-5f8aecfe.js');
37
37
  const slider = require('./slider-13594e49.js');
38
38
  const spinner = require('./spinner-bb990a42.js');
39
- const textField = require('./text-field-0397fb34.js');
39
+ const textField = require('./text-field-bccbde1f.js');
40
40
  const toast = require('./toast-bee7f47b.js');
41
41
  const toggle = require('./toggle-a5dde469.js');
42
42
  const tooltip = require('./tooltip-e9f63631.js');
@@ -14,7 +14,7 @@ const patchEsm = () => {
14
14
  const defineCustomElements = (win, options) => {
15
15
  if (typeof window === 'undefined') return Promise.resolve();
16
16
  return patchEsm().then(() => {
17
- 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],"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);
17
+ 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],"replacementUriType":[1,"replacement-uri-type"],"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);
18
18
  });
19
19
  };
20
20
 
@@ -5,10 +5,12 @@ const index$1 = require('./index-e1b40fa6.js');
5
5
  const templates = require('./templates-e7b3ffbb.js');
6
6
 
7
7
  class ElementPool {
8
- constructor(container, elementFactory) {
8
+ constructor(container, elementFactory, eventHandlerFactory) {
9
9
  this.container = container;
10
10
  this.elementFactory = elementFactory;
11
+ this.eventHandlerFactory = eventHandlerFactory;
11
12
  this.instanceMap = new Map();
13
+ this.handlerMap = new Map();
12
14
  this.elements = [];
13
15
  }
14
16
  swapHeadToTail(count) {
@@ -60,15 +62,31 @@ class ElementPool {
60
62
  this.elements.push(instance.element);
61
63
  this.instanceMap.set(instance.element, instance);
62
64
  this.container.append(instance.element);
65
+ this.addEventListeners(instance.element);
63
66
  return instance;
64
67
  }
68
+ addEventListeners(element) {
69
+ var _a;
70
+ const handlers = (_a = this.eventHandlerFactory) === null || _a === void 0 ? void 0 : _a.call(this, element);
71
+ handlers === null || handlers === void 0 ? void 0 : handlers.forEach((d) => {
72
+ element.addEventListener(d.type, d.handler);
73
+ });
74
+ this.handlerMap.set(element, handlers !== null && handlers !== void 0 ? handlers : []);
75
+ }
65
76
  deleteElement() {
66
77
  const element = this.elements.pop();
67
78
  if (element != null) {
68
79
  this.instanceMap.delete(element);
69
80
  element.remove();
81
+ this.removeEventListeners(element);
70
82
  }
71
83
  }
84
+ removeEventListeners(element) {
85
+ var _a;
86
+ (_a = this.handlerMap.get(element)) === null || _a === void 0 ? void 0 : _a.forEach((d) => {
87
+ element.removeEventListener(d.type, d.handler);
88
+ });
89
+ }
72
90
  }
73
91
 
74
92
  const getResultListHeight = (el) => {
@@ -88,6 +106,7 @@ const ResultList = class {
88
106
  constructor(hostRef) {
89
107
  index.registerInstance(this, hostRef);
90
108
  this.enterPressed = index.createEvent(this, "enterPressed", 7);
109
+ this.resultClick = index.createEvent(this, "resultClick", 7);
91
110
  this.computeResultHeight = () => {
92
111
  if (this.computedResultHeight == null) {
93
112
  const result = this.hostEl.querySelector('*[slot="result"]');
@@ -112,7 +131,7 @@ const ResultList = class {
112
131
  }
113
132
  };
114
133
  this.createResultPool = () => {
115
- this.stateMap.resultPool = new ElementPool(this.hostEl, () => this.createResultInstance());
134
+ this.stateMap.resultPool = new ElementPool(this.hostEl, () => this.createResultInstance(), () => this.createResultHandlers());
116
135
  };
117
136
  this.createResultInstance = () => {
118
137
  if (this.stateMap.resultTemplate != null) {
@@ -124,6 +143,18 @@ const ResultList = class {
124
143
  throw new Error('Result template not defined.');
125
144
  }
126
145
  };
146
+ this.createResultHandlers = () => {
147
+ return [
148
+ {
149
+ type: 'pointerdown',
150
+ handler: this.handlePointerDown,
151
+ },
152
+ {
153
+ type: 'click',
154
+ handler: this.handleResultClick,
155
+ },
156
+ ];
157
+ };
127
158
  this.layoutResults = () => {
128
159
  var _a, _b, _c, _d;
129
160
  const visibleRowCount = this.viewportEndIndex - this.viewportStartIndex + 1;
@@ -144,6 +175,7 @@ const ResultList = class {
144
175
  el.style.top = `${(this.viewportStartIndex + index) * this.resultHeight}px`;
145
176
  el.style.width = '100%';
146
177
  el.setAttribute('is-focused', `${this.viewportStartIndex + index === this.lastFocusedIndex}`);
178
+ el.setAttribute('data-result-id', result.id);
147
179
  binding.bind(result);
148
180
  }
149
181
  });
@@ -186,6 +218,8 @@ const ResultList = class {
186
218
  this.lastStartIndex = 0;
187
219
  this.lastFocusedIndex = 0;
188
220
  this.stateMap = {};
221
+ this.handleResultClick = this.handleResultClick.bind(this);
222
+ this.handlePointerDown = this.handlePointerDown.bind(this);
189
223
  }
190
224
  handleResultsChanged(results) {
191
225
  if (typeof results === 'string') {
@@ -231,6 +265,16 @@ const ResultList = class {
231
265
  height: `${this.parsedResults.length * this.resultHeight}px`,
232
266
  } }, index.h("slot", null), index.h("slot", { name: "result" })))))));
233
267
  }
268
+ handlePointerDown(event) {
269
+ event.preventDefault();
270
+ }
271
+ handleResultClick(event) {
272
+ const closestIdElement = event.target.closest('[data-result-id]');
273
+ const result = this.parsedResults.find((r) => r.id === (closestIdElement === null || closestIdElement === void 0 ? void 0 : closestIdElement.getAttribute('data-result-id')));
274
+ if (result != null) {
275
+ this.resultClick.emit(result);
276
+ }
277
+ }
234
278
  computeViewportResults() {
235
279
  const viewportHeight = this.getListHeight();
236
280
  if (viewportHeight != null && this.resultHeight > 0) {
@@ -0,0 +1,421 @@
1
+ 'use strict';
2
+
3
+ const index = require('./index-6a92256c.js');
4
+ const index$1 = require('./index-e1b40fa6.js');
5
+ const templates = require('./templates-e7b3ffbb.js');
6
+
7
+ // do not edit .js files directly - edit src/index.jst
8
+
9
+
10
+
11
+ var fastDeepEqual = function equal(a, b) {
12
+ if (a === b) return true;
13
+
14
+ if (a && b && typeof a == 'object' && typeof b == 'object') {
15
+ if (a.constructor !== b.constructor) return false;
16
+
17
+ var length, i, keys;
18
+ if (Array.isArray(a)) {
19
+ length = a.length;
20
+ if (length != b.length) return false;
21
+ for (i = length; i-- !== 0;)
22
+ if (!equal(a[i], b[i])) return false;
23
+ return true;
24
+ }
25
+
26
+
27
+
28
+ if (a.constructor === RegExp) return a.source === b.source && a.flags === b.flags;
29
+ if (a.valueOf !== Object.prototype.valueOf) return a.valueOf() === b.valueOf();
30
+ if (a.toString !== Object.prototype.toString) return a.toString() === b.toString();
31
+
32
+ keys = Object.keys(a);
33
+ length = keys.length;
34
+ if (length !== Object.keys(b).length) return false;
35
+
36
+ for (i = length; i-- !== 0;)
37
+ if (!Object.prototype.hasOwnProperty.call(b, keys[i])) return false;
38
+
39
+ for (i = length; i-- !== 0;) {
40
+ var key = keys[i];
41
+
42
+ if (!equal(a[key], b[key])) return false;
43
+ }
44
+
45
+ return true;
46
+ }
47
+
48
+ // true if both NaN, false otherwise
49
+ return a!==a && b!==b;
50
+ };
51
+
52
+ const getWindowSelection = () => {
53
+ if (typeof window !== 'undefined') {
54
+ return window.getSelection();
55
+ }
56
+ return undefined;
57
+ };
58
+ const createDocumentRange = () => {
59
+ return document.createRange();
60
+ };
61
+ const createTextNode = (text) => {
62
+ return new Text(text);
63
+ };
64
+
65
+ const createResultUri = (result) => {
66
+ return `${result.type}:${result.id}`;
67
+ };
68
+ const createSearchResultReplacement = (result, before, after) => {
69
+ const urn = createResultUri(result);
70
+ return {
71
+ before: createTextNode(before),
72
+ beforeSpace: createTextNode(createHairSpace()),
73
+ result: createTextNode(urn),
74
+ afterSpace: after != null ? createTextNode(createNoBreakSpace()) : undefined,
75
+ after: after != null ? createTextNode(after) : undefined,
76
+ };
77
+ };
78
+ const getNodesForSearchResultReplacement = (replacement) => {
79
+ const keys = Object.keys(replacement);
80
+ return keys
81
+ .map((key) => replacement[key])
82
+ .filter((node) => node != null);
83
+ };
84
+ /**
85
+ * We leverage a couple unique spaces to represent mentions, allowing for
86
+ * correct cursor movement when using arrow keys. As these characters are
87
+ * purely for functional behavior of the input, `trimNonstandardSpaces`
88
+ * will remove them so the input is suitable for emitting.
89
+ *
90
+ * U+200A is a "Hair Space" which acts as a space, but is not visually
91
+ * represented as one.
92
+ *
93
+ * U+00A0 is a "No-Break Space" which is commonly added by browsers
94
+ * when interacting with a contenteditable element.
95
+ */
96
+ const trimNonstandardSpaces = (text) => {
97
+ return text.replace(/[\u200A]/g, '').replace(/[\u00A0]/g, ' ');
98
+ };
99
+ const createHairSpace = () => {
100
+ return String.fromCharCode(8202);
101
+ };
102
+ const createNoBreakSpace = () => {
103
+ return String.fromCharCode(160);
104
+ };
105
+
106
+ const searchBarCss = ".wrapper.sc-vertex-search-bar{display:flex;align-items:center;width:100%;box-sizing:border-box;background:none;border:1px solid transparent;border-radius:4px;font-family:var(--vertex-ui-font-family);font-size:0.875rem;line-height:1.4}.content-input.sc-vertex-search-bar{width:100%;box-sizing:border-box;padding:6px 0.5em 7px;border:1px solid transparent;background:none;font-family:var(--vertex-ui-font-family);font-weight:var(--vertex-ui-font-weight-base);font-size:0.875rem;line-height:1.4;white-space:pre-line}.content-input.sc-vertex-search-bar:focus{outline:none}.standard.sc-vertex-search-bar{border-color:var(--vertex-ui-neutral-400);color:var(--vertex-ui-neutral-800)}.standard.sc-vertex-search-bar .content-input.sc-vertex-search-bar:empty::before{content:attr(data-placeholder);color:var(--vertex-ui-neutral-500)}.standard.sc-vertex-search-bar:hover:not(.disabled),.standard.sc-vertex-search-bar:focus{border-color:var(--vertex-ui-neutral-500)}.standard.disabled.sc-vertex-search-bar{border-color:var(--vertex-ui-neutral-200)}.standard.disabled.sc-vertex-search-bar,.standard.disabled.sc-vertex-search-bar .content-input.sc-vertex-search-bar:empty::before{content:attr(data-placeholder);color:var(--vertex-ui-neutral-400)}.blank.sc-vertex-search-bar{color:var(--vertex-ui-neutral-800)}.blank.sc-vertex-search-bar:not(:hover) .content-input.sc-vertex-search-bar:focus{border-color:var(--vertex-ui-neutral-400);border-radius:4px}.blank.sc-vertex-search-bar .content-input.sc-vertex-search-bar:empty::before{content:attr(data-placeholder);color:var(--vertex-ui-neutral-500)}.blank.sc-vertex-search-bar:hover:not(.disabled) .content-input.sc-vertex-search-bar{border-color:var(--vertex-ui-neutral-400);border-radius:4px}.blank.disabled.sc-vertex-search-bar{border-color:var(--vertex-ui-neutral-200)}.blank.disabled.sc-vertex-search-bar,.blank.disabled.sc-vertex-search-bar .content-input.sc-vertex-search-bar:empty::before{content:attr(data-placeholder);color:var(--vertex-ui-neutral-400)}.filled.sc-vertex-search-bar{background-color:var(--vertex-ui-neutral-200);border-color:var(--vertex-ui-neutral-200);color:var(--vertex-ui-neutral-800)}.filled.disabled.sc-vertex-search-bar,.filled.disabled.sc-vertex-search-bar .content-input.sc-vertex-search-bar:empty::before{content:attr(data-placeholder);color:var(--vertex-ui-neutral-400)}.filled.sc-vertex-search-bar .content-input.sc-vertex-search-bar:empty::before{content:attr(data-placeholder);color:var(--vertex-ui-neutral-700)}.filled.sc-vertex-search-bar:hover:not(.disabled),.filled.sc-vertex-search-bar:focus{border-bottom-color:var(--vertex-ui-blue-600)}.filled.disabled.sc-vertex-search-bar{border-color:var(--vertex-ui-neutral-100)}.filled.disabled.sc-vertex-search-bar,.filled.disabled.sc-vertex-search-bar .content-input.sc-vertex-search-bar:empty::before{content:attr(data-placeholder);color:var(--vertex-ui-neutral-400)}.underlined.sc-vertex-search-bar{background-color:var(--vertex-ui-white);border-color:var(--vertex-ui-white) var(--vertex-ui-white) var(--vertex-ui-neutral-400) var(--vertex-ui-white);color:var(--vertex-ui-neutral-800)}.underlined.disabled.sc-vertex-search-bar,.underlined.disabled.sc-vertex-search-bar:empty::before{content:attr(data-placeholder);color:var(--vertex-ui-neutral-400)}.underlined.sc-vertex-search-bar:empty::before{content:attr(data-placeholder);color:var(--vertex-ui-neutral-700)}.underlined.sc-vertex-search-bar:hover:not(.disabled),.underlined.sc-vertex-search-bar:focus{background-color:var(--vertex-ui-neutral-200);border-color:var(--vertex-ui-neutral-200);border-bottom-color:var(--vertex-ui-blue-600)}.underlined.disabled.sc-vertex-search-bar{border-bottom-color:var(--vertex-ui-neutral-200)}.underlined.disabled.sc-vertex-search-bar,.underlined.disabled.sc-vertex-search-bar .content-input.sc-vertex-search-bar:empty::before{content:attr(data-placeholder);color:var(--vertex-ui-neutral-400)}.underlined.has-error.sc-vertex-search-bar{border-bottom-color:var(--vertex-ui-red-600)}";
107
+
108
+ const SearchBar = class {
109
+ constructor(hostRef) {
110
+ index.registerInstance(this, hostRef);
111
+ this.searchChanged = index.createEvent(this, "searchChanged", 7);
112
+ this.inputChanged = index.createEvent(this, "inputChanged", 7);
113
+ this.resultReplaced = index.createEvent(this, "resultReplaced", 7);
114
+ this.inputFocus = index.createEvent(this, "inputFocus", 7);
115
+ this.inputBlur = index.createEvent(this, "inputBlur", 7);
116
+ this.rawElements = [];
117
+ this.isIdenticalElement = (child, other) => {
118
+ return (child === this.triggeredElement ||
119
+ this.getTextContent(child) === this.getTextContent(other));
120
+ };
121
+ this.getTextContent = (node) => {
122
+ var _a;
123
+ if (node instanceof HTMLElement) {
124
+ return node.innerText;
125
+ }
126
+ return (_a = node.textContent) !== null && _a !== void 0 ? _a : '';
127
+ };
128
+ /**
129
+ * Inspects the cursor position for the following conditions:
130
+ *
131
+ * 1. The cursor has moved to text that contains a valid string
132
+ * and trigger character, indicating we need to dispatch a
133
+ * `searchChanged` event and display the results.
134
+ *
135
+ * 2. The cursor has moved within text that contains a valid string
136
+ * and trigger character, indicating we need to dispatch a
137
+ * `searchChanged` event to update the currently displayed results.
138
+ *
139
+ * 3. The cursor has moved to text that does not contain a valid
140
+ * string and trigger character, indicating we need to hide any
141
+ * displayed search results.
142
+ */
143
+ this.handleCursorPositionUpdate = () => {
144
+ var _a, _b;
145
+ const windowRange = (_a = getWindowSelection()) === null || _a === void 0 ? void 0 : _a.getRangeAt(0);
146
+ if (windowRange != null) {
147
+ const triggerText = this.readTriggerValue((_b = windowRange.commonAncestorContainer.textContent) !== null && _b !== void 0 ? _b : '', windowRange.startOffset);
148
+ if (!this.hasTriggered && triggerText != null) {
149
+ this.hasTriggered = true;
150
+ this.triggeredRange = windowRange;
151
+ this.triggeredElement = windowRange.commonAncestorContainer;
152
+ this.searchChanged.emit(triggerText.replace(this.triggerCharacter, ''));
153
+ }
154
+ else if (this.hasTriggered && triggerText != null) {
155
+ this.triggeredRange = windowRange;
156
+ this.triggeredElement = windowRange.commonAncestorContainer;
157
+ this.searchChanged.emit(triggerText.replace(this.triggerCharacter, ''));
158
+ }
159
+ else {
160
+ this.hasTriggered = false;
161
+ this.triggeredRange = undefined;
162
+ this.triggeredElement = undefined;
163
+ }
164
+ }
165
+ this.cursorPosition = this.getCursorPosition();
166
+ };
167
+ this.readTriggerValue = (value, fromIndex) => {
168
+ const adjustedValue = value.replace(String.fromCharCode(160), ' ');
169
+ const beforeSubstr = adjustedValue.substring(0, fromIndex);
170
+ const afterSubstr = adjustedValue.substring(fromIndex);
171
+ const adjustedBeforeSubstr = beforeSubstr.includes(this.triggerCharacter)
172
+ ? beforeSubstr.substring(beforeSubstr.lastIndexOf(this.triggerCharacter))
173
+ : '';
174
+ const adjustedAfterSubstr = afterSubstr.substring(0, this.firstIndexOfBreakCharacter(afterSubstr));
175
+ const result = `${adjustedBeforeSubstr}${adjustedAfterSubstr}`;
176
+ return result.includes(this.triggerCharacter) &&
177
+ !this.includesBreakCharacter(result)
178
+ ? result
179
+ : undefined;
180
+ };
181
+ this.includesBreakCharacter = (value) => {
182
+ return this.breakCharacters.some((bc) => value.includes(bc));
183
+ };
184
+ this.firstIndexOfBreakCharacter = (value) => {
185
+ const indices = this.breakCharacters
186
+ .map((bc) => value.indexOf(bc))
187
+ .filter((i) => i >= 0);
188
+ return indices.length > 0 ? Math.min(...indices) : value.length;
189
+ };
190
+ this.moveCursorToNodeEnd = (node, collapseToStart = false) => {
191
+ const selection = getWindowSelection();
192
+ if (selection != null) {
193
+ const range = createDocumentRange();
194
+ range.selectNodeContents(node);
195
+ range.collapse(collapseToStart);
196
+ selection.removeAllRanges();
197
+ selection.addRange(range);
198
+ }
199
+ };
200
+ this.getContentAsString = () => {
201
+ if (this.contentEl != null) {
202
+ return trimNonstandardSpaces(Array.from(this.contentEl.childNodes).reduce((res, n) => {
203
+ var _a;
204
+ if (n instanceof HTMLElement &&
205
+ n.getAttribute('data-replaced') === 'true') {
206
+ return `${res}${n.getAttribute('data-original')}`;
207
+ }
208
+ else if (n instanceof HTMLElement) {
209
+ return `${res}${n.innerText}`;
210
+ }
211
+ else {
212
+ return `${res}${(_a = n.textContent) !== null && _a !== void 0 ? _a : ''}`;
213
+ }
214
+ }, ''));
215
+ }
216
+ return '';
217
+ };
218
+ this.createReplacedElement = (original, data) => {
219
+ const template = this.hostEl.querySelector('template[slot="replaced"]');
220
+ if (template != null) {
221
+ const instance = templates.generateInstanceFromTemplate(template);
222
+ instance.bindings.bind(data);
223
+ instance.element.id = data.id;
224
+ instance.element.style.display = 'inline-block';
225
+ instance.element.contentEditable = 'false';
226
+ instance.element.tabIndex = -1;
227
+ instance.element.setAttribute('data-replaced', 'true');
228
+ instance.element.setAttribute('data-original', original);
229
+ return instance.element;
230
+ }
231
+ else {
232
+ throw new Error('Replaced template not defined.');
233
+ }
234
+ };
235
+ this.variant = 'standard';
236
+ this.disabled = false;
237
+ this.triggerCharacter = '@';
238
+ this.breakCharacters = [' ', '\n'];
239
+ this.resultItems = undefined;
240
+ this.placement = 'bottom-start';
241
+ this.value = undefined;
242
+ this.placeholder = undefined;
243
+ this.replacements = [];
244
+ this.replacementUriType = 'user';
245
+ this.cursorPosition = undefined;
246
+ this.displayedElements = [];
247
+ this.hasTriggered = false;
248
+ this.handleKeyDown = this.handleKeyDown.bind(this);
249
+ this.handleKeyUp = this.handleKeyUp.bind(this);
250
+ this.handleResultClick = this.handleResultClick.bind(this);
251
+ this.handleClick = this.handleClick.bind(this);
252
+ this.handleWindowClick = this.handleWindowClick.bind(this);
253
+ this.handleInput = this.handleInput.bind(this);
254
+ this.handleBlur = this.handleBlur.bind(this);
255
+ this.handleFocus = this.handleFocus.bind(this);
256
+ this.handleCursorPositionUpdate =
257
+ this.handleCursorPositionUpdate.bind(this);
258
+ this.updateContent = this.updateContent.bind(this);
259
+ this.replaceContent = this.replaceContent.bind(this);
260
+ }
261
+ componentDidLoad() {
262
+ this.replaceContent(this.value);
263
+ }
264
+ connectedCallback() {
265
+ window.addEventListener('click', this.handleWindowClick);
266
+ }
267
+ disconnectedCallback() {
268
+ window.removeEventListener('click', this.handleWindowClick);
269
+ }
270
+ replaceContent(newValue, oldValue) {
271
+ if (newValue != null && newValue !== oldValue) {
272
+ const pattern = `${this.replacementUriType}:[0-9a-z-]{36}`;
273
+ const matches = newValue.match(new RegExp(pattern, 'g'));
274
+ const replacementsMap = this.replacements.reduce((map, r) => (Object.assign(Object.assign({}, map), { [createResultUri(r)]: r })), {});
275
+ let nextSubstr = newValue;
276
+ const parts = matches != null
277
+ ? matches === null || matches === void 0 ? void 0 : matches.reduce((res, m) => {
278
+ if (replacementsMap[m] != null) {
279
+ const urn = createResultUri(replacementsMap[m]);
280
+ const index = nextSubstr.indexOf(urn);
281
+ const before = nextSubstr.substring(0, index);
282
+ const after = nextSubstr.substring(index + urn.length);
283
+ const replacement = createSearchResultReplacement(replacementsMap[m], before);
284
+ nextSubstr = after;
285
+ return [
286
+ ...res,
287
+ replacement.before,
288
+ replacement.beforeSpace,
289
+ replacement.result,
290
+ ];
291
+ }
292
+ return res;
293
+ }, [])
294
+ : [];
295
+ this.rawElements = [...parts, createTextNode(nextSubstr)];
296
+ this.updateContent(this.replacements);
297
+ }
298
+ }
299
+ updateContent(newValue, oldValue) {
300
+ if (this.contentEl != null && !fastDeepEqual(newValue, oldValue)) {
301
+ this.contentEl.innerHTML = '';
302
+ this.displayedElements = this.rawElements.map((el) => {
303
+ const raw = el instanceof HTMLElement ? el.innerText : el.textContent;
304
+ const replacement = this.replacements.find((r) => raw === null || raw === void 0 ? void 0 : raw.includes(createResultUri(r)));
305
+ if (raw != null && replacement != null) {
306
+ const replacementElement = this.createReplacedElement(raw, replacement);
307
+ return replacementElement;
308
+ }
309
+ return el;
310
+ });
311
+ this.displayedElements.forEach((el) => {
312
+ var _a;
313
+ (_a = this.contentEl) === null || _a === void 0 ? void 0 : _a.appendChild(typeof el === 'string' ? createTextNode(el) : el);
314
+ });
315
+ if (this.lastReplacedSpace != null) {
316
+ this.moveCursorToNodeEnd(this.lastReplacedSpace);
317
+ }
318
+ this.inputChanged.emit(this.getContentAsString());
319
+ }
320
+ }
321
+ render() {
322
+ var _a;
323
+ const classes = index$1.classnames('wrapper', {
324
+ standard: this.variant === 'standard',
325
+ filled: this.variant === 'filled',
326
+ underlined: this.variant === 'underlined',
327
+ blank: this.variant === 'blank',
328
+ disabled: this.disabled,
329
+ });
330
+ return (index.h(index.Host, null, index.h("div", { class: classes }, index.h("span", { class: "content-input", role: "textbox", contentEditable: "true", "aria-multiline": "true", "data-placeholder": this.placeholder, ref: (el) => (this.contentEl = el), onKeyDown: this.handleKeyDown, onKeyUp: this.handleCursorPositionUpdate, onClick: this.handleCursorPositionUpdate, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur })), index.h("vertex-result-list", { position: this.cursorPosition, placement: this.placement, open: this.hasTriggered &&
331
+ this.resultItems != null &&
332
+ this.resultItems.length > 0, items: (_a = this.resultItems) !== null && _a !== void 0 ? _a : [], onEnterPressed: this.handleResultClick, onResultClick: this.handleResultClick }, index.h("slot", { name: "results" })), index.h("slot", { name: "replaced" })));
333
+ }
334
+ handleKeyDown(event) {
335
+ if (this.hasTriggered && this.breakCharacters.includes(event.key)) {
336
+ this.hasTriggered = false;
337
+ this.triggeredRange = undefined;
338
+ this.triggeredElement = undefined;
339
+ }
340
+ }
341
+ handleKeyUp(event) {
342
+ this.handleCursorPositionUpdate();
343
+ this.cursorPosition = this.getCursorPosition();
344
+ }
345
+ async handleInput() {
346
+ this.inputChanged.emit(this.getContentAsString());
347
+ }
348
+ handleClick() {
349
+ this.handleCursorPositionUpdate();
350
+ }
351
+ handleWindowClick(event) {
352
+ if (event.target instanceof HTMLElement &&
353
+ event.target.getAttribute('data-replaced') === 'true' &&
354
+ event.target.nextSibling != null) {
355
+ this.moveCursorToNodeEnd(event.target.nextSibling, true);
356
+ }
357
+ }
358
+ handleFocus(event) {
359
+ this.inputFocus.emit(event);
360
+ }
361
+ handleBlur(event) {
362
+ this.hasTriggered = false;
363
+ this.inputBlur.emit(event);
364
+ }
365
+ handleResultClick(event) {
366
+ var _a;
367
+ const triggeredRange = this.triggeredRange;
368
+ const triggeredElement = this.triggeredElement;
369
+ const value = triggeredElement instanceof HTMLElement
370
+ ? triggeredElement.innerText
371
+ : triggeredElement === null || triggeredElement === void 0 ? void 0 : triggeredElement.textContent;
372
+ if (this.contentEl != null &&
373
+ triggeredRange != null &&
374
+ triggeredElement != null &&
375
+ value != null) {
376
+ const triggeredValue = (_a = this.readTriggerValue(value, triggeredRange.startOffset)) !== null && _a !== void 0 ? _a : '';
377
+ const split = value.split(triggeredValue);
378
+ const before = split[0];
379
+ const after = split[1];
380
+ const replacement = createSearchResultReplacement(event.detail, before, after);
381
+ this.lastReplacedSpace = replacement.afterSpace;
382
+ this.rawElements = Array.from(this.contentEl.childNodes).reduce((re, e) => {
383
+ if (this.isIdenticalElement(e, triggeredElement)) {
384
+ return [...re, ...getNodesForSearchResultReplacement(replacement)];
385
+ }
386
+ else {
387
+ return [...re, e];
388
+ }
389
+ }, []);
390
+ this.hasTriggered = false;
391
+ this.resultReplaced.emit(event.detail);
392
+ this.replacements = [
393
+ ...this.replacements.filter((r) => r.id !== event.detail.id),
394
+ event.detail,
395
+ ];
396
+ }
397
+ }
398
+ getCursorPosition() {
399
+ var _a;
400
+ const selection = getWindowSelection();
401
+ if (selection != null && selection.rangeCount > 0) {
402
+ const cursorBounds = selection.getRangeAt(0).getBoundingClientRect();
403
+ const contentBounds = (_a = this.contentEl) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect();
404
+ const cursorBottom = cursorBounds.bottom || (contentBounds === null || contentBounds === void 0 ? void 0 : contentBounds.bottom) || 0;
405
+ const cursorTop = cursorBounds.top || (contentBounds === null || contentBounds === void 0 ? void 0 : contentBounds.top) || 0;
406
+ return {
407
+ x: cursorBounds.left || (contentBounds === null || contentBounds === void 0 ? void 0 : contentBounds.left) || 0,
408
+ y: this.placement.includes('top') ? cursorTop : cursorBottom,
409
+ };
410
+ }
411
+ throw new Error('Unable to retrieve window selection.');
412
+ }
413
+ get hostEl() { return index.getElement(this); }
414
+ static get watchers() { return {
415
+ "value": ["replaceContent"],
416
+ "replacements": ["updateContent"]
417
+ }; }
418
+ };
419
+ SearchBar.style = searchBarCss;
420
+
421
+ exports.SearchBar = SearchBar;