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

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.
@@ -32,7 +32,7 @@ const radio = require('./radio-bff991d2.js');
32
32
  const radioGroup = require('./radio-group-d628f631.js');
33
33
  const resizable = require('./resizable-e4248256.js');
34
34
  const resultList = require('./result-list-241ffe8d.js');
35
- const searchBar = require('./search-bar-a321b3e1.js');
35
+ const searchBar = require('./search-bar-e101ba43.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');
@@ -4,6 +4,51 @@ const index = require('./index-6a92256c.js');
4
4
  const index$1 = require('./index-e1b40fa6.js');
5
5
  const templates = require('./templates-e7b3ffbb.js');
6
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
+
7
52
  const getWindowSelection = () => {
8
53
  if (typeof window !== 'undefined') {
9
54
  return window.getSelection();
@@ -224,11 +269,11 @@ const SearchBar = class {
224
269
  }, [])
225
270
  : [];
226
271
  this.rawElements = [...parts, createTextNode(nextSubstr)];
227
- this.updateContent();
272
+ this.updateContent(this.replacements);
228
273
  }
229
274
  }
230
- updateContent() {
231
- if (this.contentEl != null) {
275
+ updateContent(newValue, oldValue) {
276
+ if (this.contentEl != null && !fastDeepEqual(newValue, oldValue)) {
232
277
  this.contentEl.innerHTML = '';
233
278
  this.displayedElements = this.rawElements.map((el) => {
234
279
  const raw = el instanceof HTMLElement ? el.innerText : el.textContent;
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const searchBar = require('./search-bar-a321b3e1.js');
5
+ const searchBar = require('./search-bar-e101ba43.js');
6
6
  require('./index-6a92256c.js');
7
7
  require('./index-e1b40fa6.js');
8
8
  require('./templates-e7b3ffbb.js');
@@ -1,5 +1,6 @@
1
1
  import { h, Host, } from '@stencil/core';
2
2
  import classNames from 'classnames';
3
+ import deepEqual from 'fast-deep-equal';
3
4
  import { generateInstanceFromTemplate } from '../../util/templates/templates';
4
5
  import { createDocumentRange, createTextNode, getWindowSelection } from './dom';
5
6
  import { createResultUrn, createSearchResultReplacement, getNodesForSearchResultReplacement, trimNonstandardSpaces, } from './lib';
@@ -173,11 +174,11 @@ export class SearchBar {
173
174
  }, [])
174
175
  : [];
175
176
  this.rawElements = [...parts, createTextNode(nextSubstr)];
176
- this.updateContent();
177
+ this.updateContent(this.replacements);
177
178
  }
178
179
  }
179
- updateContent() {
180
- if (this.contentEl != null) {
180
+ updateContent(newValue, oldValue) {
181
+ if (this.contentEl != null && !deepEqual(newValue, oldValue)) {
181
182
  this.contentEl.innerHTML = '';
182
183
  this.displayedElements = this.rawElements.map((el) => {
183
184
  const raw = el instanceof HTMLElement ? el.innerText : el.textContent;
@@ -1 +1 @@
1
- import{d as e,N as t,w as a,p as o,a as r,b as i}from"./p-6834631c.js";export{s as setNonce}from"./p-6834631c.js";(()=>{const i=Array.from(e.querySelectorAll("script")).find((e=>new RegExp(`/${t}(\\.esm)?\\.js($|\\?|#)`).test(e.src)||e.getAttribute("data-stencil-namespace")===t)),n={};return n.resourcesUrl=new URL(".",new URL(i.getAttribute("data-resources-url")||i.src,a.location.href)).href,((o,i)=>{const n=`__sc_import_${t.replace(/\s|-/g,"_")}`;try{a[n]=new Function("w",`return import(w);//${Math.random()}`)}catch(t){const l=new Map;a[n]=t=>{var c;const s=new URL(t,o).href;let p=l.get(s);if(!p){const t=e.createElement("script");t.type="module",t.crossOrigin=i.crossOrigin,t.src=URL.createObjectURL(new Blob([`import * as m from '${s}'; window.${n}.m = m;`],{type:"application/javascript"}));const o=null!==(c=r.t)&&void 0!==c?c:function(e){var t,a,o;return null!==(o=null===(a=null===(t=e.head)||void 0===t?void 0:t.querySelector('meta[name="csp-nonce"]'))||void 0===a?void 0:a.getAttribute("content"))&&void 0!==o?o:void 0}(e);null!=o&&t.setAttribute("nonce",o),p=new Promise((e=>{t.onload=()=>{e(a[n].m),t.remove()}})),l.set(s,p),e.head.appendChild(t)}return p}}})(n.resourcesUrl,i),a.customElements?o(n):__sc_import_components("./p-c3ec6642.js").then((()=>n))})().then((e=>i([["p-24c72960",[[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"]}]]],["p-226e83a6",[[1,"vertex-collapsible",{label:[1],open:[1540]}]]],["p-41ced35c",[[1,"vertex-context-menu",{targetSelector:[1,"target-selector"],animated:[4],position:[32],open:[32]}]]],["p-0f8b9ede",[[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"]]]]],["p-e7336466",[[1,"vertex-draggable-popover",{position:[1],boundarySelector:[1,"boundary-selector"],boundaryPadding:[2,"boundary-padding"],anchorPosition:[32],lastPosition:[32],dragging:[32]}]]],["p-e3d0c2d1",[[1,"vertex-dropdown-menu",{animated:[4],placement:[1],open:[32]}]]],["p-fe7e7a74",[[1,"vertex-help-tooltip",{animated:[4],placement:[1],open:[32]}]]],["p-c4518377",[[6,"vertex-search-bar",{variant:[1],disabled:[4],triggerCharacter:[1,"trigger-character"],breakCharacters:[16],resultItems:[16],placement:[1],value:[1],placeholder:[1],replacements:[1040],cursorPosition:[32],displayedElements:[32],hasTriggered:[32]}]]],["p-7cfb3736",[[1,"vertex-select",{value:[513],placeholder:[513],disabled:[516],animated:[4],hideSelected:[4,"hide-selected"],resizeObserverFactory:[16],open:[32],position:[32],displayValue:[32]}]]],["p-16719272",[[1,"vertex-slider",{min:[2],max:[2],valueLabelDisplay:[1,"value-label-display"],step:[8],size:[1],value:[1026],disabled:[4]}]]],["p-756c9977",[[1,"vertex-toast",{content:[1],placement:[1],duration:[2],animated:[4],open:[4],type:[1],isOpen:[32]}]]],["p-7f64b251",[[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]}]]],["p-35e7ab78",[[1,"vertex-color-picker",{value:[1537],disabled:[4]}]]],["p-53515813",[[1,"vertex-toggle",{variant:[1],disabled:[4],checked:[1540]}]]],["p-bca6275a",[[1,"vertex-avatar",{firstName:[1,"first-name"],lastName:[1,"last-name"],value:[1],active:[4],variant:[1]}]]],["p-91123ff6",[[1,"vertex-avatar-group"]]],["p-0b4406fa",[[1,"vertex-badge",{badgeText:[1,"badge-text"],badgeColor:[1,"badge-color"]}]]],["p-fca52578",[[1,"vertex-button",{type:[1],color:[1],variant:[1],size:[1],expand:[1],href:[1],target:[1],disabled:[516]}]]],["p-6d4f055b",[[1,"vertex-card",{mode:[1]}]]],["p-211c1186",[[1,"vertex-card-group",{selected:[516],hovered:[516],expanded:[516]}]]],["p-d7c0c287",[[1,"vertex-chip",{variant:[1],color:[1]}]]],["p-a2018217",[[1,"vertex-logo-loading"]]],["p-cc2e3192",[[1,"vertex-menu-divider"]]],["p-573b8ec6",[[1,"vertex-menu-item",{disabled:[516]}]]],["p-33400eed",[[2,"vertex-radio",{disabled:[516],value:[513],label:[513],name:[513],checked:[516]}]]],["p-8b85ea4a",[[1,"vertex-radio-group",{name:[513],value:[1537]}]]],["p-ea4a2f74",[[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]}]]],["p-69375605",[[1,"vertex-spinner",{color:[1],size:[1]}]]],["p-80c989fa",[[1,"vertex-expandable",{expanded:[1540],expanding:[1540],collapsing:[1540],controlled:[516],expandType:[513,"expand-type"],animated:[4],contentScrollHeight:[32]}]]],["p-ee496965",[[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]}]]],["p-406e73da",[[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]}]]],["p-0b1cdc8a",[[1,"vertex-tooltip",{content:[1],disabled:[4],placement:[1],delay:[2],animated:[4],open:[32]}]]],["p-20a74d5d",[[1,"vertex-color-circle",{color:[513],supplementalColor:[513,"supplemental-color"],theme:[513],lightenPercentage:[2,"lighten-percentage"],darkenPercentage:[2,"darken-percentage"],lightened:[1537],darkened:[1537]}]]],["p-9c384f6c",[[1,"vertex-auto-resize-textarea",{textareaSelector:[1,"textarea-selector"],initialValue:[1,"initial-value"],minRows:[514,"min-rows"],maxRows:[514,"max-rows"],textValue:[32]}]]],["p-0517ca62",[[1,"vertex-menu",{animated:[4],open:[1540],placement:[1],fallbackPlacements:[16],backdrop:[4],position:[1040],popoverProps:[16]}]]],["p-f71fc166",[[1,"vertex-icon-button",{iconName:[1,"icon-name"],disabled:[516],variant:[1],iconColor:[1,"icon-color"],iconSize:[1,"icon-size"]}]]],["p-7dba2574",[[1,"vertex-icon",{name:[1],size:[1]}]]],["p-606596de",[[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]}]]]],e)));
1
+ import{d as e,N as t,w as a,p as o,a as r,b as i}from"./p-6834631c.js";export{s as setNonce}from"./p-6834631c.js";(()=>{const i=Array.from(e.querySelectorAll("script")).find((e=>new RegExp(`/${t}(\\.esm)?\\.js($|\\?|#)`).test(e.src)||e.getAttribute("data-stencil-namespace")===t)),n={};return n.resourcesUrl=new URL(".",new URL(i.getAttribute("data-resources-url")||i.src,a.location.href)).href,((o,i)=>{const n=`__sc_import_${t.replace(/\s|-/g,"_")}`;try{a[n]=new Function("w",`return import(w);//${Math.random()}`)}catch(t){const l=new Map;a[n]=t=>{var c;const s=new URL(t,o).href;let p=l.get(s);if(!p){const t=e.createElement("script");t.type="module",t.crossOrigin=i.crossOrigin,t.src=URL.createObjectURL(new Blob([`import * as m from '${s}'; window.${n}.m = m;`],{type:"application/javascript"}));const o=null!==(c=r.t)&&void 0!==c?c:function(e){var t,a,o;return null!==(o=null===(a=null===(t=e.head)||void 0===t?void 0:t.querySelector('meta[name="csp-nonce"]'))||void 0===a?void 0:a.getAttribute("content"))&&void 0!==o?o:void 0}(e);null!=o&&t.setAttribute("nonce",o),p=new Promise((e=>{t.onload=()=>{e(a[n].m),t.remove()}})),l.set(s,p),e.head.appendChild(t)}return p}}})(n.resourcesUrl,i),a.customElements?o(n):__sc_import_components("./p-c3ec6642.js").then((()=>n))})().then((e=>i([["p-24c72960",[[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"]}]]],["p-226e83a6",[[1,"vertex-collapsible",{label:[1],open:[1540]}]]],["p-41ced35c",[[1,"vertex-context-menu",{targetSelector:[1,"target-selector"],animated:[4],position:[32],open:[32]}]]],["p-0f8b9ede",[[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"]]]]],["p-e7336466",[[1,"vertex-draggable-popover",{position:[1],boundarySelector:[1,"boundary-selector"],boundaryPadding:[2,"boundary-padding"],anchorPosition:[32],lastPosition:[32],dragging:[32]}]]],["p-e3d0c2d1",[[1,"vertex-dropdown-menu",{animated:[4],placement:[1],open:[32]}]]],["p-fe7e7a74",[[1,"vertex-help-tooltip",{animated:[4],placement:[1],open:[32]}]]],["p-f51fef1d",[[6,"vertex-search-bar",{variant:[1],disabled:[4],triggerCharacter:[1,"trigger-character"],breakCharacters:[16],resultItems:[16],placement:[1],value:[1],placeholder:[1],replacements:[1040],cursorPosition:[32],displayedElements:[32],hasTriggered:[32]}]]],["p-7cfb3736",[[1,"vertex-select",{value:[513],placeholder:[513],disabled:[516],animated:[4],hideSelected:[4,"hide-selected"],resizeObserverFactory:[16],open:[32],position:[32],displayValue:[32]}]]],["p-16719272",[[1,"vertex-slider",{min:[2],max:[2],valueLabelDisplay:[1,"value-label-display"],step:[8],size:[1],value:[1026],disabled:[4]}]]],["p-756c9977",[[1,"vertex-toast",{content:[1],placement:[1],duration:[2],animated:[4],open:[4],type:[1],isOpen:[32]}]]],["p-7f64b251",[[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]}]]],["p-35e7ab78",[[1,"vertex-color-picker",{value:[1537],disabled:[4]}]]],["p-53515813",[[1,"vertex-toggle",{variant:[1],disabled:[4],checked:[1540]}]]],["p-bca6275a",[[1,"vertex-avatar",{firstName:[1,"first-name"],lastName:[1,"last-name"],value:[1],active:[4],variant:[1]}]]],["p-91123ff6",[[1,"vertex-avatar-group"]]],["p-0b4406fa",[[1,"vertex-badge",{badgeText:[1,"badge-text"],badgeColor:[1,"badge-color"]}]]],["p-fca52578",[[1,"vertex-button",{type:[1],color:[1],variant:[1],size:[1],expand:[1],href:[1],target:[1],disabled:[516]}]]],["p-6d4f055b",[[1,"vertex-card",{mode:[1]}]]],["p-211c1186",[[1,"vertex-card-group",{selected:[516],hovered:[516],expanded:[516]}]]],["p-d7c0c287",[[1,"vertex-chip",{variant:[1],color:[1]}]]],["p-a2018217",[[1,"vertex-logo-loading"]]],["p-cc2e3192",[[1,"vertex-menu-divider"]]],["p-573b8ec6",[[1,"vertex-menu-item",{disabled:[516]}]]],["p-33400eed",[[2,"vertex-radio",{disabled:[516],value:[513],label:[513],name:[513],checked:[516]}]]],["p-8b85ea4a",[[1,"vertex-radio-group",{name:[513],value:[1537]}]]],["p-ea4a2f74",[[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]}]]],["p-69375605",[[1,"vertex-spinner",{color:[1],size:[1]}]]],["p-80c989fa",[[1,"vertex-expandable",{expanded:[1540],expanding:[1540],collapsing:[1540],controlled:[516],expandType:[513,"expand-type"],animated:[4],contentScrollHeight:[32]}]]],["p-ee496965",[[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]}]]],["p-406e73da",[[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]}]]],["p-0b1cdc8a",[[1,"vertex-tooltip",{content:[1],disabled:[4],placement:[1],delay:[2],animated:[4],open:[32]}]]],["p-20a74d5d",[[1,"vertex-color-circle",{color:[513],supplementalColor:[513,"supplemental-color"],theme:[513],lightenPercentage:[2,"lighten-percentage"],darkenPercentage:[2,"darken-percentage"],lightened:[1537],darkened:[1537]}]]],["p-9c384f6c",[[1,"vertex-auto-resize-textarea",{textareaSelector:[1,"textarea-selector"],initialValue:[1,"initial-value"],minRows:[514,"min-rows"],maxRows:[514,"max-rows"],textValue:[32]}]]],["p-0517ca62",[[1,"vertex-menu",{animated:[4],open:[1540],placement:[1],fallbackPlacements:[16],backdrop:[4],position:[1040],popoverProps:[16]}]]],["p-f71fc166",[[1,"vertex-icon-button",{iconName:[1,"icon-name"],disabled:[516],variant:[1],iconColor:[1,"icon-color"],iconSize:[1,"icon-size"]}]]],["p-7dba2574",[[1,"vertex-icon",{name:[1],size:[1]}]]],["p-606596de",[[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]}]]]],e)));
@@ -1 +1 @@
1
- export{A as AutoResizeTextArea}from"./p-bec53c3a.js";export{A as Avatar}from"./p-c2c076f1.js";export{A as AvatarGroup}from"./p-81cb4da4.js";export{B as Badge}from"./p-29d7697f.js";export{B as Button}from"./p-64e8b92c.js";export{C as Card}from"./p-a3c04bbd.js";export{C as CardGroup}from"./p-ff4a1c3a.js";export{C as Chip}from"./p-a6614625.js";export{C as ClickToEditTextField}from"./p-0e628c05.js";export{C as Collapsible}from"./p-8fe0084d.js";export{C as ColorCircle}from"./p-d9b9aebe.js";export{C as ColorCirclePicker}from"./p-9374ef6c.js";export{C as ColorPicker}from"./p-8434602f.js";export{C as ContextMenu}from"./p-f2bc7ec5.js";export{D as Dialog}from"./p-165aed7d.js";export{D as DraggablePopover}from"./p-41a7564c.js";export{D as DropdownMenu}from"./p-39133bc7.js";export{E as Expandable}from"./p-6a640a2c.js";export{H as HelpTooltip}from"./p-2cff3285.js";export{I as Icon}from"./p-ca52a423.js";export{I as IconButton}from"./p-103249b4.js";export{L as LogoLoading}from"./p-817bf6ff.js";export{M as Menu}from"./p-7b75e004.js";export{M as MenuDivider}from"./p-c939fa4e.js";export{M as MenuItem}from"./p-988058f9.js";export{P as Popover}from"./p-c2706288.js";export{R as Radio}from"./p-36c853c4.js";export{R as RadioGroup}from"./p-f693e6f8.js";export{R as Resizable}from"./p-6ec189d2.js";export{R as ResultList}from"./p-6b862967.js";export{S as SearchBar}from"./p-f064f911.js";export{S as Select}from"./p-912f6e24.js";export{S as Slider}from"./p-cd6ddb10.js";export{S as Spinner}from"./p-09ba50c3.js";export{T as TextField}from"./p-43b1b3f9.js";export{T as Toast}from"./p-3dd08a0f.js";export{T as Toggle}from"./p-59fb829f.js";export{T as Tooltip}from"./p-92930f2a.js";import"./p-6834631c.js";import"./p-b2c7b113.js";import"./p-fe062eb0.js";import"./p-03dbb28c.js";import"./p-1356f525.js";import"./p-59032668.js";
1
+ export{A as AutoResizeTextArea}from"./p-bec53c3a.js";export{A as Avatar}from"./p-c2c076f1.js";export{A as AvatarGroup}from"./p-81cb4da4.js";export{B as Badge}from"./p-29d7697f.js";export{B as Button}from"./p-64e8b92c.js";export{C as Card}from"./p-a3c04bbd.js";export{C as CardGroup}from"./p-ff4a1c3a.js";export{C as Chip}from"./p-a6614625.js";export{C as ClickToEditTextField}from"./p-0e628c05.js";export{C as Collapsible}from"./p-8fe0084d.js";export{C as ColorCircle}from"./p-d9b9aebe.js";export{C as ColorCirclePicker}from"./p-9374ef6c.js";export{C as ColorPicker}from"./p-8434602f.js";export{C as ContextMenu}from"./p-f2bc7ec5.js";export{D as Dialog}from"./p-165aed7d.js";export{D as DraggablePopover}from"./p-41a7564c.js";export{D as DropdownMenu}from"./p-39133bc7.js";export{E as Expandable}from"./p-6a640a2c.js";export{H as HelpTooltip}from"./p-2cff3285.js";export{I as Icon}from"./p-ca52a423.js";export{I as IconButton}from"./p-103249b4.js";export{L as LogoLoading}from"./p-817bf6ff.js";export{M as Menu}from"./p-7b75e004.js";export{M as MenuDivider}from"./p-c939fa4e.js";export{M as MenuItem}from"./p-988058f9.js";export{P as Popover}from"./p-c2706288.js";export{R as Radio}from"./p-36c853c4.js";export{R as RadioGroup}from"./p-f693e6f8.js";export{R as Resizable}from"./p-6ec189d2.js";export{R as ResultList}from"./p-6b862967.js";export{S as SearchBar}from"./p-8393b6a7.js";export{S as Select}from"./p-912f6e24.js";export{S as Slider}from"./p-cd6ddb10.js";export{S as Spinner}from"./p-09ba50c3.js";export{T as TextField}from"./p-43b1b3f9.js";export{T as Toast}from"./p-3dd08a0f.js";export{T as Toggle}from"./p-59fb829f.js";export{T as Tooltip}from"./p-92930f2a.js";import"./p-6834631c.js";import"./p-b2c7b113.js";import"./p-fe062eb0.js";import"./p-03dbb28c.js";import"./p-1356f525.js";import"./p-59032668.js";
@@ -0,0 +1 @@
1
+ import{r as e,e as t,h as r,H as i,g as s}from"./p-6834631c.js";import{c as a}from"./p-fe062eb0.js";import{g as n}from"./p-1356f525.js";var l=function e(t,r){if(t===r)return!0;if(t&&r&&"object"==typeof t&&"object"==typeof r){if(t.constructor!==r.constructor)return!1;var i,s,a;if(Array.isArray(t)){if((i=t.length)!=r.length)return!1;for(s=i;0!=s--;)if(!e(t[s],r[s]))return!1;return!0}if(t.constructor===RegExp)return t.source===r.source&&t.flags===r.flags;if(t.valueOf!==Object.prototype.valueOf)return t.valueOf()===r.valueOf();if(t.toString!==Object.prototype.toString)return t.toString()===r.toString();if((i=(a=Object.keys(t)).length)!==Object.keys(r).length)return!1;for(s=i;0!=s--;)if(!Object.prototype.hasOwnProperty.call(r,a[s]))return!1;for(s=i;0!=s--;){var n=a[s];if(!e(t[n],r[n]))return!1}return!0}return t!=t&&r!=r};const o=()=>{if("undefined"!=typeof window)return window.getSelection()},h=e=>new Text(null!=e&&""!==e?e:" "),c=e=>`${e.type}:${e.id}`,d=(e,t,r)=>{const i=c(e);return{before:h(t),beforeSpace:h(v()),result:h(i),afterSpace:null!=r?h(b()):void 0,after:null!=r?h(r):void 0}},u=e=>Object.keys(e).map((t=>e[t])).filter((e=>null!=e)),v=()=>String.fromCharCode(8202),b=()=>String.fromCharCode(160),x=class{constructor(r){e(this,r),this.searchChanged=t(this,"searchChanged",7),this.inputChanged=t(this,"inputChanged",7),this.resultReplaced=t(this,"resultReplaced",7),this.inputFocus=t(this,"inputFocus",7),this.inputBlur=t(this,"inputBlur",7),this.rawElements=[],this.isIdenticalElement=(e,t)=>e===this.triggeredElement||this.getTextContent(e)===this.getTextContent(t),this.getTextContent=e=>{var t;return e instanceof HTMLElement?e.innerText:null!==(t=e.textContent)&&void 0!==t?t:""},this.handleCursorPositionUpdate=()=>{var e,t,r;const i=null===(e=o())||void 0===e?void 0:e.getRangeAt(0);if(null!=i)if(this.hasTriggered){if(this.hasTriggered){const e=this.readTriggerValue(null!==(r=i.commonAncestorContainer.textContent)&&void 0!==r?r:"",i.startOffset);null!=e?(this.triggeredRange=i,this.triggeredElement=i.commonAncestorContainer,this.searchChanged.emit(e.replace(this.triggerCharacter,""))):(this.hasTriggered=!1,this.triggeredRange=void 0,this.triggeredElement=void 0)}}else{const e=this.readTriggerValue(null!==(t=i.commonAncestorContainer.textContent)&&void 0!==t?t:"",i.startOffset);null!=e&&(this.hasTriggered=!0,this.triggeredRange=i,this.triggeredElement=i.commonAncestorContainer,this.searchChanged.emit(e.replace(this.triggerCharacter,"")))}this.cursorPosition=this.getCursorPosition()},this.readTriggerValue=(e,t)=>{const r=e.replace(String.fromCharCode(160)," "),i=r.substring(0,t),s=r.substring(t),a=`${i.includes(this.triggerCharacter)?i.substring(i.lastIndexOf(this.triggerCharacter)):""}${s.substring(0,this.firstIndexOfBreakCharacter(s))}`;return a.includes(this.triggerCharacter)&&!this.includesBreakCharacter(a)?a:void 0},this.includesBreakCharacter=e=>this.breakCharacters.some((t=>e.includes(t))),this.firstIndexOfBreakCharacter=e=>{const t=this.breakCharacters.map((t=>e.indexOf(t))).filter((e=>e>=0));return t.length>0?Math.min(...t):e.length},this.moveCursorToNodeEnd=(e,t=!1)=>{const r=o();if(null!=r){const i=document.createRange();i.selectNodeContents(e),i.collapse(t),r.removeAllRanges(),r.addRange(i)}},this.getContentAsString=()=>null!=this.contentEl?Array.from(this.contentEl.childNodes).reduce(((e,t)=>{var r;return t instanceof HTMLElement&&"true"===t.getAttribute("data-replaced")?`${e}${t.getAttribute("data-original")}`:t instanceof HTMLElement?`${e}${t.innerText}`:`${e}${null!==(r=t.textContent)&&void 0!==r?r:""}`}),"").replace(/[\u200A]/g,"").replace(/[\u00A0]/g," "):"",this.createReplacedElement=(e,t)=>{const r=this.hostEl.querySelector('template[slot="replaced"]');if(null!=r){const i=n(r);return i.bindings.bind(t),i.element.id=t.id,i.element.style.display="inline-block",i.element.contentEditable="false",i.element.tabIndex=-1,i.element.setAttribute("data-replaced","true"),i.element.setAttribute("data-original",e),i.element}throw new Error("Replaced template not defined.")},this.variant="standard",this.disabled=!1,this.triggerCharacter="@",this.breakCharacters=[" ","\n"],this.resultItems=void 0,this.placement="bottom-start",this.value=void 0,this.placeholder=void 0,this.replacements=[],this.cursorPosition={x:0,y:0},this.displayedElements=[],this.hasTriggered=!1,this.handleKeyDown=this.handleKeyDown.bind(this),this.handleKeyUp=this.handleKeyUp.bind(this),this.handleResultClick=this.handleResultClick.bind(this),this.handleClick=this.handleClick.bind(this),this.handleWindowClick=this.handleWindowClick.bind(this),this.handleInput=this.handleInput.bind(this),this.handleBlur=this.handleBlur.bind(this),this.handleFocus=this.handleFocus.bind(this),this.handleCursorPositionUpdate=this.handleCursorPositionUpdate.bind(this),this.updateContent=this.updateContent.bind(this),this.replaceContent=this.replaceContent.bind(this)}componentDidLoad(){this.replaceContent(this.value)}connectedCallback(){window.addEventListener("click",this.handleWindowClick)}disconnectedCallback(){window.removeEventListener("click",this.handleWindowClick)}replaceContent(e,t){if(null!=e&&e!==t){const t=e.match(/[a-z]*:[0-9a-z-]{36}/g),r=this.replacements.reduce(((e,t)=>Object.assign(Object.assign({},e),{[c(t)]:t})),{});let i=e;const s=null!=t?null==t?void 0:t.reduce(((e,t)=>{if(null!=r[t]){const s=c(r[t]),a=i.indexOf(s),n=i.substring(0,a),l=i.substring(a+s.length),o=d(r[t],n);return i=l,[...e,o.before,o.beforeSpace,o.result]}return e}),[]):[];this.rawElements=[...s,h(i)],this.updateContent(this.replacements)}}updateContent(e,t){null==this.contentEl||l(e,t)||(this.contentEl.innerHTML="",this.displayedElements=this.rawElements.map((e=>{const t=e instanceof HTMLElement?e.innerText:e.textContent,r=this.replacements.find((e=>null==t?void 0:t.includes(e.id)));return null!=t&&null!=r?this.createReplacedElement(t,r):e})),this.displayedElements.forEach((e=>{var t;null===(t=this.contentEl)||void 0===t||t.appendChild("string"==typeof e?h(e):e)})),null!=this.lastReplacedSpace&&this.moveCursorToNodeEnd(this.lastReplacedSpace),this.inputChanged.emit(this.getContentAsString()))}render(){var e;const t=a("wrapper",{standard:"standard"===this.variant,filled:"filled"===this.variant,underlined:"underlined"===this.variant,blank:"blank"===this.variant,disabled:this.disabled});return r(i,null,r("div",{class:t},r("span",{class:"content-input",role:"textbox",contentEditable:"true","aria-multiline":"true","data-placeholder":this.placeholder,ref:e=>this.contentEl=e,onKeyDown:this.handleKeyDown,onKeyUp:this.handleCursorPositionUpdate,onClick:this.handleCursorPositionUpdate,onInput:this.handleInput,onFocus:this.handleFocus,onBlur:this.handleBlur})),r("vertex-result-list",{position:this.cursorPosition,placement:this.placement,open:this.hasTriggered&&null!=this.resultItems&&this.resultItems.length>0,items:null!==(e=this.resultItems)&&void 0!==e?e:[],onEnterPressed:this.handleResultClick,onResultClick:this.handleResultClick},r("slot",{name:"results"})),r("slot",{name:"replaced"}))}handleKeyDown(e){this.hasTriggered&&this.breakCharacters.includes(e.key)&&(this.hasTriggered=!1,this.triggeredRange=void 0,this.triggeredElement=void 0)}handleKeyUp(e){this.handleCursorPositionUpdate(),this.cursorPosition=this.getCursorPosition()}async handleInput(){this.inputChanged.emit(this.getContentAsString())}handleClick(){this.handleCursorPositionUpdate()}handleWindowClick(e){e.target instanceof HTMLElement&&"true"===e.target.getAttribute("data-replaced")&&null!=e.target.nextSibling&&this.moveCursorToNodeEnd(e.target.nextSibling,!0)}handleFocus(e){this.inputFocus.emit(e)}handleBlur(e){this.hasTriggered=!1,this.inputBlur.emit(e)}handleResultClick(e){var t;const r=this.triggeredRange,i=this.triggeredElement,s=i instanceof HTMLElement?i.innerText:null==i?void 0:i.textContent;if(null!=this.contentEl&&null!=r&&null!=i&&null!=s){const a=null!==(t=this.readTriggerValue(s,r.startOffset))&&void 0!==t?t:"",n=s.split(a),l=d(e.detail,n[0],n[1]);this.lastReplacedSpace=l.afterSpace,this.rawElements=Array.from(this.contentEl.childNodes).reduce(((e,t)=>this.isIdenticalElement(t,i)?[...e,...u(l)]:[...e,t]),[]),this.hasTriggered=!1,this.replacements=[...this.replacements.filter((t=>t.id!==e.detail.id)),e.detail],this.resultReplaced.emit(e.detail)}}getCursorPosition(){var e;const t=o();if(null!=t&&t.rangeCount>0){const r=t.getRangeAt(0).getBoundingClientRect(),i=null===(e=this.contentEl)||void 0===e?void 0:e.getBoundingClientRect(),s=r.bottom||(null==i?void 0:i.bottom)||0,a=r.top||(null==i?void 0:i.top)||0;return{x:r.left||(null==i?void 0:i.left)||0,y:this.placement.includes("top")?a:s}}throw new Error("Unable to retrieve window selection.")}get hostEl(){return s(this)}static get watchers(){return{value:["replaceContent"],replacements:["updateContent"]}}};x.style=".wrapper.sc-vertex-search-bar{display:flex;border:1px solid var(--vertex-ui-neutral-600);border-radius:0.5rem}.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}.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)}";export{x as S}
@@ -0,0 +1 @@
1
+ export{S as vertex_search_bar}from"./p-8393b6a7.js";import"./p-6834631c.js";import"./p-fe062eb0.js";import"./p-1356f525.js";import"./p-59032668.js";
package/dist/esm/index.js CHANGED
@@ -28,7 +28,7 @@ export { R as Radio } from './radio-39c11ba4.js';
28
28
  export { R as RadioGroup } from './radio-group-7c35d2f0.js';
29
29
  export { R as Resizable } from './resizable-a147709b.js';
30
30
  export { R as ResultList } from './result-list-16c6afbd.js';
31
- export { S as SearchBar } from './search-bar-6fad2f2e.js';
31
+ export { S as SearchBar } from './search-bar-12d91ad5.js';
32
32
  export { S as Select } from './select-d4e135b7.js';
33
33
  export { S as Slider } from './slider-dcdb388f.js';
34
34
  export { S as Spinner } from './spinner-afccea51.js';
@@ -2,6 +2,51 @@ import { r as registerInstance, e as createEvent, h, H as Host, g as getElement
2
2
  import { c as classnames } from './index-9c609209.js';
3
3
  import { g as generateInstanceFromTemplate } from './templates-797420bf.js';
4
4
 
5
+ // do not edit .js files directly - edit src/index.jst
6
+
7
+
8
+
9
+ var fastDeepEqual = function equal(a, b) {
10
+ if (a === b) return true;
11
+
12
+ if (a && b && typeof a == 'object' && typeof b == 'object') {
13
+ if (a.constructor !== b.constructor) return false;
14
+
15
+ var length, i, keys;
16
+ if (Array.isArray(a)) {
17
+ length = a.length;
18
+ if (length != b.length) return false;
19
+ for (i = length; i-- !== 0;)
20
+ if (!equal(a[i], b[i])) return false;
21
+ return true;
22
+ }
23
+
24
+
25
+
26
+ if (a.constructor === RegExp) return a.source === b.source && a.flags === b.flags;
27
+ if (a.valueOf !== Object.prototype.valueOf) return a.valueOf() === b.valueOf();
28
+ if (a.toString !== Object.prototype.toString) return a.toString() === b.toString();
29
+
30
+ keys = Object.keys(a);
31
+ length = keys.length;
32
+ if (length !== Object.keys(b).length) return false;
33
+
34
+ for (i = length; i-- !== 0;)
35
+ if (!Object.prototype.hasOwnProperty.call(b, keys[i])) return false;
36
+
37
+ for (i = length; i-- !== 0;) {
38
+ var key = keys[i];
39
+
40
+ if (!equal(a[key], b[key])) return false;
41
+ }
42
+
43
+ return true;
44
+ }
45
+
46
+ // true if both NaN, false otherwise
47
+ return a!==a && b!==b;
48
+ };
49
+
5
50
  const getWindowSelection = () => {
6
51
  if (typeof window !== 'undefined') {
7
52
  return window.getSelection();
@@ -222,11 +267,11 @@ const SearchBar = class {
222
267
  }, [])
223
268
  : [];
224
269
  this.rawElements = [...parts, createTextNode(nextSubstr)];
225
- this.updateContent();
270
+ this.updateContent(this.replacements);
226
271
  }
227
272
  }
228
- updateContent() {
229
- if (this.contentEl != null) {
273
+ updateContent(newValue, oldValue) {
274
+ if (this.contentEl != null && !fastDeepEqual(newValue, oldValue)) {
230
275
  this.contentEl.innerHTML = '';
231
276
  this.displayedElements = this.rawElements.map((el) => {
232
277
  const raw = el instanceof HTMLElement ? el.innerText : el.textContent;
@@ -1,4 +1,4 @@
1
- export { S as vertex_search_bar } from './search-bar-6fad2f2e.js';
1
+ export { S as vertex_search_bar } from './search-bar-12d91ad5.js';
2
2
  import './index-72f28b71.js';
3
3
  import './index-9c609209.js';
4
4
  import './templates-797420bf.js';
@@ -101,7 +101,7 @@ export declare class SearchBar {
101
101
  protected connectedCallback(): void;
102
102
  protected disconnectedCallback(): void;
103
103
  protected replaceContent(newValue?: string, oldValue?: string): void;
104
- protected updateContent(): void;
104
+ protected updateContent(newValue?: Result[], oldValue?: Result[]): void;
105
105
  render(): h.JSX.IntrinsicElements;
106
106
  private handleKeyDown;
107
107
  private handleKeyUp;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vertexvis/ui",
3
- "version": "0.1.0-testing.5",
3
+ "version": "0.1.0-testing.6",
4
4
  "description": "The Vertex UI component library.",
5
5
  "main": "dist/index.cjs.js",
6
6
  "module": "dist/index.js",
@@ -84,7 +84,8 @@
84
84
  },
85
85
  "dependencies": {
86
86
  "@floating-ui/dom": "^1.6.5",
87
- "@vertexvis/utils": "^0.21.0"
87
+ "@vertexvis/utils": "^0.21.0",
88
+ "fast-deep-equal": "^3.1.3"
88
89
  },
89
- "gitHead": "8013122df0b6a3d4a6def2e30f5084b12e520ea7"
90
+ "gitHead": "1a980a743748856fc06e7d8c7e13daf447092ca3"
90
91
  }
@@ -1 +0,0 @@
1
- export{S as vertex_search_bar}from"./p-f064f911.js";import"./p-6834631c.js";import"./p-fe062eb0.js";import"./p-1356f525.js";import"./p-59032668.js";
@@ -1 +0,0 @@
1
- import{r as e,e as t,h as r,H as s,g as i}from"./p-6834631c.js";import{c as a}from"./p-fe062eb0.js";import{g as n}from"./p-1356f525.js";const l=()=>{if("undefined"!=typeof window)return window.getSelection()},o=e=>new Text(null!=e&&""!==e?e:" "),h=e=>`${e.type}:${e.id}`,c=(e,t,r)=>{const s=h(e);return{before:o(t),beforeSpace:o(u()),result:o(s),afterSpace:null!=r?o(v()):void 0,after:null!=r?o(r):void 0}},d=e=>Object.keys(e).map((t=>e[t])).filter((e=>null!=e)),u=()=>String.fromCharCode(8202),v=()=>String.fromCharCode(160),b=class{constructor(r){e(this,r),this.searchChanged=t(this,"searchChanged",7),this.inputChanged=t(this,"inputChanged",7),this.resultReplaced=t(this,"resultReplaced",7),this.inputFocus=t(this,"inputFocus",7),this.inputBlur=t(this,"inputBlur",7),this.rawElements=[],this.isIdenticalElement=(e,t)=>e===this.triggeredElement||this.getTextContent(e)===this.getTextContent(t),this.getTextContent=e=>{var t;return e instanceof HTMLElement?e.innerText:null!==(t=e.textContent)&&void 0!==t?t:""},this.handleCursorPositionUpdate=()=>{var e,t,r;const s=null===(e=l())||void 0===e?void 0:e.getRangeAt(0);if(null!=s)if(this.hasTriggered){if(this.hasTriggered){const e=this.readTriggerValue(null!==(r=s.commonAncestorContainer.textContent)&&void 0!==r?r:"",s.startOffset);null!=e?(this.triggeredRange=s,this.triggeredElement=s.commonAncestorContainer,this.searchChanged.emit(e.replace(this.triggerCharacter,""))):(this.hasTriggered=!1,this.triggeredRange=void 0,this.triggeredElement=void 0)}}else{const e=this.readTriggerValue(null!==(t=s.commonAncestorContainer.textContent)&&void 0!==t?t:"",s.startOffset);null!=e&&(this.hasTriggered=!0,this.triggeredRange=s,this.triggeredElement=s.commonAncestorContainer,this.searchChanged.emit(e.replace(this.triggerCharacter,"")))}this.cursorPosition=this.getCursorPosition()},this.readTriggerValue=(e,t)=>{const r=e.replace(String.fromCharCode(160)," "),s=r.substring(0,t),i=r.substring(t),a=`${s.includes(this.triggerCharacter)?s.substring(s.lastIndexOf(this.triggerCharacter)):""}${i.substring(0,this.firstIndexOfBreakCharacter(i))}`;return a.includes(this.triggerCharacter)&&!this.includesBreakCharacter(a)?a:void 0},this.includesBreakCharacter=e=>this.breakCharacters.some((t=>e.includes(t))),this.firstIndexOfBreakCharacter=e=>{const t=this.breakCharacters.map((t=>e.indexOf(t))).filter((e=>e>=0));return t.length>0?Math.min(...t):e.length},this.moveCursorToNodeEnd=(e,t=!1)=>{const r=l();if(null!=r){const s=document.createRange();s.selectNodeContents(e),s.collapse(t),r.removeAllRanges(),r.addRange(s)}},this.getContentAsString=()=>null!=this.contentEl?Array.from(this.contentEl.childNodes).reduce(((e,t)=>{var r;return t instanceof HTMLElement&&"true"===t.getAttribute("data-replaced")?`${e}${t.getAttribute("data-original")}`:t instanceof HTMLElement?`${e}${t.innerText}`:`${e}${null!==(r=t.textContent)&&void 0!==r?r:""}`}),"").replace(/[\u200A]/g,"").replace(/[\u00A0]/g," "):"",this.createReplacedElement=(e,t)=>{const r=this.hostEl.querySelector('template[slot="replaced"]');if(null!=r){const s=n(r);return s.bindings.bind(t),s.element.id=t.id,s.element.style.display="inline-block",s.element.contentEditable="false",s.element.tabIndex=-1,s.element.setAttribute("data-replaced","true"),s.element.setAttribute("data-original",e),s.element}throw new Error("Replaced template not defined.")},this.variant="standard",this.disabled=!1,this.triggerCharacter="@",this.breakCharacters=[" ","\n"],this.resultItems=void 0,this.placement="bottom-start",this.value=void 0,this.placeholder=void 0,this.replacements=[],this.cursorPosition={x:0,y:0},this.displayedElements=[],this.hasTriggered=!1,this.handleKeyDown=this.handleKeyDown.bind(this),this.handleKeyUp=this.handleKeyUp.bind(this),this.handleResultClick=this.handleResultClick.bind(this),this.handleClick=this.handleClick.bind(this),this.handleWindowClick=this.handleWindowClick.bind(this),this.handleInput=this.handleInput.bind(this),this.handleBlur=this.handleBlur.bind(this),this.handleFocus=this.handleFocus.bind(this),this.handleCursorPositionUpdate=this.handleCursorPositionUpdate.bind(this),this.updateContent=this.updateContent.bind(this),this.replaceContent=this.replaceContent.bind(this)}componentDidLoad(){this.replaceContent(this.value)}connectedCallback(){window.addEventListener("click",this.handleWindowClick)}disconnectedCallback(){window.removeEventListener("click",this.handleWindowClick)}replaceContent(e,t){if(null!=e&&e!==t){const t=e.match(/[a-z]*:[0-9a-z-]{36}/g),r=this.replacements.reduce(((e,t)=>Object.assign(Object.assign({},e),{[h(t)]:t})),{});let s=e;const i=null!=t?null==t?void 0:t.reduce(((e,t)=>{if(null!=r[t]){const i=h(r[t]),a=s.indexOf(i),n=s.substring(0,a),l=s.substring(a+i.length),o=c(r[t],n);return s=l,[...e,o.before,o.beforeSpace,o.result]}return e}),[]):[];this.rawElements=[...i,o(s)],this.updateContent()}}updateContent(){null!=this.contentEl&&(this.contentEl.innerHTML="",this.displayedElements=this.rawElements.map((e=>{const t=e instanceof HTMLElement?e.innerText:e.textContent,r=this.replacements.find((e=>null==t?void 0:t.includes(e.id)));return null!=t&&null!=r?this.createReplacedElement(t,r):e})),this.displayedElements.forEach((e=>{var t;null===(t=this.contentEl)||void 0===t||t.appendChild("string"==typeof e?o(e):e)})),null!=this.lastReplacedSpace&&this.moveCursorToNodeEnd(this.lastReplacedSpace),this.inputChanged.emit(this.getContentAsString()))}render(){var e;const t=a("wrapper",{standard:"standard"===this.variant,filled:"filled"===this.variant,underlined:"underlined"===this.variant,blank:"blank"===this.variant,disabled:this.disabled});return r(s,null,r("div",{class:t},r("span",{class:"content-input",role:"textbox",contentEditable:"true","aria-multiline":"true","data-placeholder":this.placeholder,ref:e=>this.contentEl=e,onKeyDown:this.handleKeyDown,onKeyUp:this.handleCursorPositionUpdate,onClick:this.handleCursorPositionUpdate,onInput:this.handleInput,onFocus:this.handleFocus,onBlur:this.handleBlur})),r("vertex-result-list",{position:this.cursorPosition,placement:this.placement,open:this.hasTriggered&&null!=this.resultItems&&this.resultItems.length>0,items:null!==(e=this.resultItems)&&void 0!==e?e:[],onEnterPressed:this.handleResultClick,onResultClick:this.handleResultClick},r("slot",{name:"results"})),r("slot",{name:"replaced"}))}handleKeyDown(e){this.hasTriggered&&this.breakCharacters.includes(e.key)&&(this.hasTriggered=!1,this.triggeredRange=void 0,this.triggeredElement=void 0)}handleKeyUp(e){this.handleCursorPositionUpdate(),this.cursorPosition=this.getCursorPosition()}async handleInput(){this.inputChanged.emit(this.getContentAsString())}handleClick(){this.handleCursorPositionUpdate()}handleWindowClick(e){e.target instanceof HTMLElement&&"true"===e.target.getAttribute("data-replaced")&&null!=e.target.nextSibling&&this.moveCursorToNodeEnd(e.target.nextSibling,!0)}handleFocus(e){this.inputFocus.emit(e)}handleBlur(e){this.hasTriggered=!1,this.inputBlur.emit(e)}handleResultClick(e){var t;const r=this.triggeredRange,s=this.triggeredElement,i=s instanceof HTMLElement?s.innerText:null==s?void 0:s.textContent;if(null!=this.contentEl&&null!=r&&null!=s&&null!=i){const a=null!==(t=this.readTriggerValue(i,r.startOffset))&&void 0!==t?t:"",n=i.split(a),l=c(e.detail,n[0],n[1]);this.lastReplacedSpace=l.afterSpace,this.rawElements=Array.from(this.contentEl.childNodes).reduce(((e,t)=>this.isIdenticalElement(t,s)?[...e,...d(l)]:[...e,t]),[]),this.hasTriggered=!1,this.replacements=[...this.replacements.filter((t=>t.id!==e.detail.id)),e.detail],this.resultReplaced.emit(e.detail)}}getCursorPosition(){var e;const t=l();if(null!=t&&t.rangeCount>0){const r=t.getRangeAt(0).getBoundingClientRect(),s=null===(e=this.contentEl)||void 0===e?void 0:e.getBoundingClientRect(),i=r.bottom||(null==s?void 0:s.bottom)||0,a=r.top||(null==s?void 0:s.top)||0;return{x:r.left||(null==s?void 0:s.left)||0,y:this.placement.includes("top")?a:i}}throw new Error("Unable to retrieve window selection.")}get hostEl(){return i(this)}static get watchers(){return{value:["replaceContent"],replacements:["updateContent"]}}};b.style=".wrapper.sc-vertex-search-bar{display:flex;border:1px solid var(--vertex-ui-neutral-600);border-radius:0.5rem}.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}.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)}";export{b as S}