eck-autocomplete
Advanced tools
Comparing version 0.1.3 to 1.0.0
@@ -6,3 +6,3 @@ // build-artifacts/eck-autocomplete-component/eck-autocomplete-component.html?raw | ||
var eck_autocomplete_component_default2 = ` | ||
:host{display:none;position:fixed;box-sizing:border-box;max-height:256px;overflow:auto;background-color:#fff}:host([has-children]){border:1px solid #000}`; | ||
:host{display:none;position:fixed;box-sizing:border-box;max-height:var(--eck-ac-max-height, 256px);overflow:auto;background-color:var(--eck-ac-background-color, #fff)}:host([has-children]){border:var(--eck-ac-border-size, 1px) solid var(--eck-ac-border-color, black);border-radius:var(--eck-ac-border-radius, 0)}`; | ||
@@ -73,3 +73,5 @@ // build-artifacts/utils/baseComponent.ts | ||
connectedCallback() { | ||
const connectToIdRef = document.querySelector(`#${this._connectedToId}`); | ||
const connectToIdRef = document.querySelector( | ||
`#${this._connectedToId}` | ||
); | ||
if (connectToIdRef) { | ||
@@ -86,3 +88,6 @@ this._connectedInputRef = connectToIdRef; | ||
this._connectedInputRef.removeEventListener("blur", this._hideHandler); | ||
this._connectedInputRef.removeEventListener("keydown", this._inputKeydownHandler); | ||
this._connectedInputRef.removeEventListener( | ||
"keydown", | ||
this._inputKeydownHandler | ||
); | ||
} | ||
@@ -101,3 +106,6 @@ setInputRef(element) { | ||
this._connectedInputRef.addEventListener("blur", this._hideHandler); | ||
this._connectedInputRef.addEventListener("keydown", this._inputKeydownHandler); | ||
this._connectedInputRef.addEventListener( | ||
"keydown", | ||
this._inputKeydownHandler | ||
); | ||
} | ||
@@ -127,6 +135,10 @@ _show() { | ||
this.shadowRoot.host.style.width = `${inputWidth}px`; | ||
computePosition(this._connectedInputRef, this.shadowRoot.host, { | ||
middleware: [flip()], | ||
strategy: "fixed" | ||
}).then(({ x, y }) => { | ||
computePosition( | ||
this._connectedInputRef, | ||
this.shadowRoot.host, | ||
{ | ||
middleware: [flip()], | ||
strategy: "fixed" | ||
} | ||
).then(({ x, y }) => { | ||
Object.assign(this.shadowRoot.host.style, { | ||
@@ -157,3 +169,6 @@ left: `${x}px`, | ||
if (direction === "ArrowUp") { | ||
this._highlightOption(elements[elements.length - 1], true); | ||
this._highlightOption( | ||
elements[elements.length - 1], | ||
true | ||
); | ||
this._highlightedOptionRef = elements[elements.length - 1]; | ||
@@ -184,3 +199,6 @@ } else if (direction === "ArrowDown") { | ||
} | ||
this._highlightOption(elements[indexToHighlight], true); | ||
this._highlightOption( | ||
elements[indexToHighlight], | ||
true | ||
); | ||
this._highlightedOptionRef = elements[indexToHighlight]; | ||
@@ -205,3 +223,7 @@ break; | ||
this._positionPanel(); | ||
this._positionerCleanup = autoUpdate(this._connectedInputRef, this.shadowRoot.host, this._positionPanel.bind(this)); | ||
this._positionerCleanup = autoUpdate( | ||
this._connectedInputRef, | ||
this.shadowRoot.host, | ||
this._positionPanel.bind(this) | ||
); | ||
} | ||
@@ -251,3 +273,6 @@ _stopPositioner() { | ||
this._highlightFirstOption(); | ||
this.shadowRoot.host.toggleAttribute("has-children", this._numberOfOptions !== 0); | ||
this.shadowRoot.host.toggleAttribute( | ||
"has-children", | ||
this._numberOfOptions !== 0 | ||
); | ||
} | ||
@@ -254,0 +279,0 @@ _filterForOptions(element) { |
@@ -6,3 +6,3 @@ // build-artifacts/eck-autocomplete-option-component/eck-autocomplete-option-component.html?raw | ||
var eck_autocomplete_option_component_default2 = ` | ||
:host{display:block;box-sizing:border-box;padding:5px;color:#000}:host(:hover),:host([highlighted]){background-color:#b3e5fc;cursor:pointer}`; | ||
:host{display:block;box-sizing:border-box;padding:var(--eck-aco-padding, 5px);color:var(--eck-aco-color, black)}:host(:hover),:host([highlighted]){background-color:var(--eck-aco-background-color, #b3e5fc);cursor:pointer}`; | ||
@@ -50,22 +50,26 @@ // build-artifacts/utils/baseComponent.ts | ||
if (highlight) { | ||
this.shadowRoot.dispatchEvent(new CustomEvent("eck-autocomplete-option-highlighted", { | ||
this.shadowRoot.dispatchEvent( | ||
new CustomEvent("eck-autocomplete-option-highlighted", { | ||
composed: true, | ||
detail: { | ||
value: this.value, | ||
label: this._getLabel(), | ||
_tbhfo: triggeredByHighlightFirstOption | ||
} | ||
}) | ||
); | ||
} | ||
} | ||
fireSelectionEvent() { | ||
this.shadowRoot.dispatchEvent( | ||
new CustomEvent("eck-autocomplete-option-selected", { | ||
composed: true, | ||
bubbles: true, | ||
detail: { | ||
value: this.value, | ||
label: this._getLabel(), | ||
_tbhfo: triggeredByHighlightFirstOption | ||
label: this._getLabel() | ||
} | ||
})); | ||
} | ||
}) | ||
); | ||
} | ||
fireSelectionEvent() { | ||
this.shadowRoot.dispatchEvent(new CustomEvent("eck-autocomplete-option-selected", { | ||
composed: true, | ||
bubbles: true, | ||
detail: { | ||
value: this.value, | ||
label: this._getLabel() | ||
} | ||
})); | ||
} | ||
_getLabel() { | ||
@@ -72,0 +76,0 @@ if (this._label !== void 0) { |
@@ -6,3 +6,3 @@ // build-artifacts/eck-autocomplete-component/eck-autocomplete-component.html?raw | ||
var eck_autocomplete_component_default2 = ` | ||
:host{display:none;position:fixed;box-sizing:border-box;max-height:256px;overflow:auto;background-color:#fff}:host([has-children]){border:1px solid #000}`; | ||
:host{display:none;position:fixed;box-sizing:border-box;max-height:var(--eck-ac-max-height, 256px);overflow:auto;background-color:var(--eck-ac-background-color, #fff)}:host([has-children]){border:var(--eck-ac-border-size, 1px) solid var(--eck-ac-border-color, black);border-radius:var(--eck-ac-border-radius, 0)}`; | ||
@@ -73,3 +73,5 @@ // build-artifacts/utils/baseComponent.ts | ||
connectedCallback() { | ||
const connectToIdRef = document.querySelector(`#${this._connectedToId}`); | ||
const connectToIdRef = document.querySelector( | ||
`#${this._connectedToId}` | ||
); | ||
if (connectToIdRef) { | ||
@@ -86,3 +88,6 @@ this._connectedInputRef = connectToIdRef; | ||
this._connectedInputRef.removeEventListener("blur", this._hideHandler); | ||
this._connectedInputRef.removeEventListener("keydown", this._inputKeydownHandler); | ||
this._connectedInputRef.removeEventListener( | ||
"keydown", | ||
this._inputKeydownHandler | ||
); | ||
} | ||
@@ -101,3 +106,6 @@ setInputRef(element) { | ||
this._connectedInputRef.addEventListener("blur", this._hideHandler); | ||
this._connectedInputRef.addEventListener("keydown", this._inputKeydownHandler); | ||
this._connectedInputRef.addEventListener( | ||
"keydown", | ||
this._inputKeydownHandler | ||
); | ||
} | ||
@@ -127,6 +135,10 @@ _show() { | ||
this.shadowRoot.host.style.width = `${inputWidth}px`; | ||
computePosition(this._connectedInputRef, this.shadowRoot.host, { | ||
middleware: [flip()], | ||
strategy: "fixed" | ||
}).then(({ x, y }) => { | ||
computePosition( | ||
this._connectedInputRef, | ||
this.shadowRoot.host, | ||
{ | ||
middleware: [flip()], | ||
strategy: "fixed" | ||
} | ||
).then(({ x, y }) => { | ||
Object.assign(this.shadowRoot.host.style, { | ||
@@ -157,3 +169,6 @@ left: `${x}px`, | ||
if (direction === "ArrowUp") { | ||
this._highlightOption(elements[elements.length - 1], true); | ||
this._highlightOption( | ||
elements[elements.length - 1], | ||
true | ||
); | ||
this._highlightedOptionRef = elements[elements.length - 1]; | ||
@@ -184,3 +199,6 @@ } else if (direction === "ArrowDown") { | ||
} | ||
this._highlightOption(elements[indexToHighlight], true); | ||
this._highlightOption( | ||
elements[indexToHighlight], | ||
true | ||
); | ||
this._highlightedOptionRef = elements[indexToHighlight]; | ||
@@ -205,3 +223,7 @@ break; | ||
this._positionPanel(); | ||
this._positionerCleanup = autoUpdate(this._connectedInputRef, this.shadowRoot.host, this._positionPanel.bind(this)); | ||
this._positionerCleanup = autoUpdate( | ||
this._connectedInputRef, | ||
this.shadowRoot.host, | ||
this._positionPanel.bind(this) | ||
); | ||
} | ||
@@ -251,3 +273,6 @@ _stopPositioner() { | ||
this._highlightFirstOption(); | ||
this.shadowRoot.host.toggleAttribute("has-children", this._numberOfOptions !== 0); | ||
this.shadowRoot.host.toggleAttribute( | ||
"has-children", | ||
this._numberOfOptions !== 0 | ||
); | ||
} | ||
@@ -264,3 +289,3 @@ _filterForOptions(element) { | ||
var eck_autocomplete_option_component_default2 = ` | ||
:host{display:block;box-sizing:border-box;padding:5px;color:#000}:host(:hover),:host([highlighted]){background-color:#b3e5fc;cursor:pointer}`; | ||
:host{display:block;box-sizing:border-box;padding:var(--eck-aco-padding, 5px);color:var(--eck-aco-color, black)}:host(:hover),:host([highlighted]){background-color:var(--eck-aco-background-color, #b3e5fc);cursor:pointer}`; | ||
@@ -299,22 +324,26 @@ // build-artifacts/eck-autocomplete-option-component/eck-autocomplete-option-component.ts | ||
if (highlight) { | ||
this.shadowRoot.dispatchEvent(new CustomEvent("eck-autocomplete-option-highlighted", { | ||
this.shadowRoot.dispatchEvent( | ||
new CustomEvent("eck-autocomplete-option-highlighted", { | ||
composed: true, | ||
detail: { | ||
value: this.value, | ||
label: this._getLabel(), | ||
_tbhfo: triggeredByHighlightFirstOption | ||
} | ||
}) | ||
); | ||
} | ||
} | ||
fireSelectionEvent() { | ||
this.shadowRoot.dispatchEvent( | ||
new CustomEvent("eck-autocomplete-option-selected", { | ||
composed: true, | ||
bubbles: true, | ||
detail: { | ||
value: this.value, | ||
label: this._getLabel(), | ||
_tbhfo: triggeredByHighlightFirstOption | ||
label: this._getLabel() | ||
} | ||
})); | ||
} | ||
}) | ||
); | ||
} | ||
fireSelectionEvent() { | ||
this.shadowRoot.dispatchEvent(new CustomEvent("eck-autocomplete-option-selected", { | ||
composed: true, | ||
bubbles: true, | ||
detail: { | ||
value: this.value, | ||
label: this._getLabel() | ||
} | ||
})); | ||
} | ||
_getLabel() { | ||
@@ -331,3 +360,6 @@ if (this._label !== void 0) { | ||
if (customElements.get(ECK_AUTOCOMPLETE_OPTION_TAG_NAME) === void 0) { | ||
customElements.define(ECK_AUTOCOMPLETE_OPTION_TAG_NAME, EckAutocompleteOption); | ||
customElements.define( | ||
ECK_AUTOCOMPLETE_OPTION_TAG_NAME, | ||
EckAutocompleteOption | ||
); | ||
} | ||
@@ -334,0 +366,0 @@ if (customElements.get(ECK_AUTOCOMPLETE_TAG_NAME) === void 0) { |
var G="<slot></slot>";var J=` | ||
:host{display:none;position:fixed;box-sizing:border-box;max-height:256px;overflow:auto;background-color:#fff}:host([has-children]){border:1px solid #000}`;var W=class extends HTMLElement{injectCSS(e){let n=document.createElement("template");n.innerHTML=`<style>${e}</style>`,this.shadowRoot.appendChild(n.content.cloneNode(!0))}};var U=t=>t!==null&&t!=="false";function I(t){return t.split("-")[0]}function tt(t){return t.split("-")[1]}function et(t){return["top","bottom"].includes(I(t))?"x":"y"}function nt(t){return t==="y"?"height":"width"}function Q(t,e,n){let{reference:i,floating:s}=t,r=i.x+i.width/2-s.width/2,l=i.y+i.height/2-s.height/2,o=et(e),a=nt(o),f=i[a]/2-s[a]/2,h=o==="x",c;switch(I(e)){case"top":c={x:r,y:i.y-s.height};break;case"bottom":c={x:r,y:i.y+i.height};break;case"right":c={x:i.x+i.width,y:l};break;case"left":c={x:i.x-s.width,y:l};break;default:c={x:i.x,y:i.y}}switch(tt(e)){case"start":c[o]-=f*(n&&h?-1:1);break;case"end":c[o]+=f*(n&&h?-1:1)}return c}var it=async(t,e,n)=>{let{placement:i="bottom",strategy:s="absolute",middleware:r=[],platform:l}=n,o=await(l.isRTL==null?void 0:l.isRTL(e)),a=await l.getElementRects({reference:t,floating:e,strategy:s}),{x:f,y:h}=Q(a,i,o),c=i,u={};for(let m=0;m<r.length;m++){let{name:d,fn:p}=r[m],{x:v,y:w,data:k,reset:g}=await p({x:f,y:h,initialPlacement:i,placement:c,strategy:s,middlewareData:u,rects:a,platform:l,elements:{reference:t,floating:e}});f=v??f,h=w??h,u={...u,[d]:{...u[d],...k}},g&&(typeof g=="object"&&(g.placement&&(c=g.placement),g.rects&&(a=g.rects===!0?await l.getElementRects({reference:t,floating:e,strategy:s}):g.rects),{x:f,y:h}=Q(a,c,o)),m=-1)}return{x:f,y:h,placement:c,strategy:s,middlewareData:u}};function Rt(t){return typeof t!="number"?function(e){return{top:0,right:0,bottom:0,left:0,...e}}(t):{top:t,right:t,bottom:t,left:t}}function H(t){return{...t,top:t.y,left:t.x,right:t.x+t.width,bottom:t.y+t.height}}async function ot(t,e){var n;e===void 0&&(e={});let{x:i,y:s,platform:r,rects:l,elements:o,strategy:a}=t,{boundary:f="clippingAncestors",rootBoundary:h="viewport",elementContext:c="floating",altBoundary:u=!1,padding:m=0}=e,d=Rt(m),p=o[u?c==="floating"?"reference":"floating":c],v=H(await r.getClippingRect({element:(n=await(r.isElement==null?void 0:r.isElement(p)))==null||n?p:p.contextElement||await(r.getDocumentElement==null?void 0:r.getDocumentElement(o.floating)),boundary:f,rootBoundary:h,strategy:a})),w=H(r.convertOffsetParentRelativeRectToViewportRelativeRect?await r.convertOffsetParentRelativeRectToViewportRelativeRect({rect:c==="floating"?{...l.floating,x:i,y:s}:l.reference,offsetParent:await(r.getOffsetParent==null?void 0:r.getOffsetParent(o.floating)),strategy:a}):l[c]);return{top:v.top-w.top+d.top,bottom:w.bottom-v.bottom+d.bottom,left:v.left-w.left+d.left,right:w.right-v.right+d.right}}var At={left:"right",right:"left",bottom:"top",top:"bottom"};function B(t){return t.replace(/left|right|bottom|top/g,e=>At[e])}function Lt(t,e,n){n===void 0&&(n=!1);let i=tt(t),s=et(t),r=nt(s),l=s==="x"?i===(n?"end":"start")?"right":"left":i==="start"?"bottom":"top";return e.reference[r]>e.floating[r]&&(l=B(l)),{main:l,cross:B(l)}}var Tt={start:"end",end:"start"};function Z(t){return t.replace(/start|end/g,e=>Tt[e])}var kt=["top","right","bottom","left"],Bt=kt.reduce((t,e)=>t.concat(e,e+"-start",e+"-end"),[]);var $=function(t){return t===void 0&&(t={}),{name:"flip",options:t,async fn(e){var n;let{placement:i,middlewareData:s,rects:r,initialPlacement:l,platform:o,elements:a}=e,{mainAxis:f=!0,crossAxis:h=!0,fallbackPlacements:c,fallbackStrategy:u="bestFit",flipAlignment:m=!0,...d}=t,p=I(i),v=c||(p===l||!m?[B(l)]:function(x){let T=B(x);return[Z(x),T,Z(T)]}(l)),w=[l,...v],k=await ot(e,d),g=[],D=((n=s.flip)==null?void 0:n.overflows)||[];if(f&&g.push(k[p]),h){let{main:x,cross:T}=Lt(i,r,await(o.isRTL==null?void 0:o.isRTL(a.floating)));g.push(k[x],k[T])}if(D=[...D,{placement:i,overflows:g}],!g.every(x=>x<=0)){var q,_;let x=((q=(_=s.flip)==null?void 0:_.index)!=null?q:0)+1,T=w[x];if(T)return{data:{index:x,overflows:D},reset:{placement:T}};let M="bottom";switch(u){case"bestFit":{var X;let Y=(X=D.map(S=>[S,S.overflows.filter(O=>O>0).reduce((O,bt)=>O+bt,0)]).sort((S,O)=>S[1]-O[1])[0])==null?void 0:X[0].placement;Y&&(M=Y);break}case"initialPlacement":M=l}if(i!==M)return{reset:{placement:M}}}return{}}}};function ft(t){return t&&t.document&&t.location&&t.alert&&t.setInterval}function R(t){if(t==null)return window;if(!ft(t)){let e=t.ownerDocument;return e&&e.defaultView||window}return t}function P(t){return R(t).getComputedStyle(t)}function b(t){return ft(t)?"":t?(t.nodeName||"").toLowerCase():""}function ht(){let t=navigator.userAgentData;return t!=null&&t.brands?t.brands.map(e=>e.brand+"/"+e.version).join(" "):navigator.userAgent}function y(t){return t instanceof R(t).HTMLElement}function L(t){return t instanceof R(t).Element}function j(t){return typeof ShadowRoot>"u"?!1:t instanceof R(t).ShadowRoot||t instanceof ShadowRoot}function K(t){let{overflow:e,overflowX:n,overflowY:i}=P(t);return/auto|scroll|overlay|hidden/.test(e+i+n)}function Ot(t){return["table","td","th"].includes(b(t))}function rt(t){let e=/firefox/i.test(ht()),n=P(t);return n.transform!=="none"||n.perspective!=="none"||n.contain==="paint"||["transform","perspective"].includes(n.willChange)||e&&n.willChange==="filter"||e&&!!n.filter&&n.filter!=="none"}function ut(){return!/^((?!chrome|android).)*safari/i.test(ht())}var st=Math.min,C=Math.max,V=Math.round;function E(t,e,n){var i,s,r,l;e===void 0&&(e=!1),n===void 0&&(n=!1);let o=t.getBoundingClientRect(),a=1,f=1;e&&y(t)&&(a=t.offsetWidth>0&&V(o.width)/t.offsetWidth||1,f=t.offsetHeight>0&&V(o.height)/t.offsetHeight||1);let h=L(t)?R(t):window,c=!ut()&&n,u=(o.left+(c&&(i=(s=h.visualViewport)==null?void 0:s.offsetLeft)!=null?i:0))/a,m=(o.top+(c&&(r=(l=h.visualViewport)==null?void 0:l.offsetTop)!=null?r:0))/f,d=o.width/a,p=o.height/f;return{width:d,height:p,top:m,right:u+d,bottom:m+p,left:u,x:u,y:m}}function A(t){return(e=t,(e instanceof R(e).Node?t.ownerDocument:t.document)||window.document).documentElement;var e}function N(t){return L(t)?{scrollLeft:t.scrollLeft,scrollTop:t.scrollTop}:{scrollLeft:t.pageXOffset,scrollTop:t.pageYOffset}}function dt(t){return E(A(t)).left+N(t).scrollLeft}function Ht(t,e,n){let i=y(e),s=A(e),r=E(t,i&&function(a){let f=E(a);return V(f.width)!==a.offsetWidth||V(f.height)!==a.offsetHeight}(e),n==="fixed"),l={scrollLeft:0,scrollTop:0},o={x:0,y:0};if(i||!i&&n!=="fixed")if((b(e)!=="body"||K(s))&&(l=N(e)),y(e)){let a=E(e,!0);o.x=a.x+e.clientLeft,o.y=a.y+e.clientTop}else s&&(o.x=dt(s));return{x:r.left+l.scrollLeft-o.x,y:r.top+l.scrollTop-o.y,width:r.width,height:r.height}}function pt(t){return b(t)==="html"?t:t.assignedSlot||t.parentNode||(j(t)?t.host:null)||A(t)}function lt(t){return y(t)&&getComputedStyle(t).position!=="fixed"?t.offsetParent:null}function F(t){let e=R(t),n=lt(t);for(;n&&Ot(n)&&getComputedStyle(n).position==="static";)n=lt(n);return n&&(b(n)==="html"||b(n)==="body"&&getComputedStyle(n).position==="static"&&!rt(n))?e:n||function(i){let s=pt(i);for(j(s)&&(s=s.host);y(s)&&!["html","body"].includes(b(s));){if(rt(s))return s;s=s.parentNode}return null}(t)||e}function at(t){if(y(t))return{width:t.offsetWidth,height:t.offsetHeight};let e=E(t);return{width:e.width,height:e.height}}function mt(t){let e=pt(t);return["html","body","#document"].includes(b(e))?t.ownerDocument.body:y(e)&&K(e)?e:mt(e)}function z(t,e){var n;e===void 0&&(e=[]);let i=mt(t),s=i===((n=t.ownerDocument)==null?void 0:n.body),r=R(i),l=s?[r].concat(r.visualViewport||[],K(i)?i:[]):i,o=e.concat(l);return s?o:o.concat(z(l))}function ct(t,e,n){return e==="viewport"?H(function(i,s){let r=R(i),l=A(i),o=r.visualViewport,a=l.clientWidth,f=l.clientHeight,h=0,c=0;if(o){a=o.width,f=o.height;let u=ut();(u||!u&&s==="fixed")&&(h=o.offsetLeft,c=o.offsetTop)}return{width:a,height:f,x:h,y:c}}(t,n)):L(e)?function(i,s){let r=E(i,!1,s==="fixed"),l=r.top+i.clientTop,o=r.left+i.clientLeft;return{top:l,left:o,x:o,y:l,right:o+i.clientWidth,bottom:l+i.clientHeight,width:i.clientWidth,height:i.clientHeight}}(e,n):H(function(i){var s;let r=A(i),l=N(i),o=(s=i.ownerDocument)==null?void 0:s.body,a=C(r.scrollWidth,r.clientWidth,o?o.scrollWidth:0,o?o.clientWidth:0),f=C(r.scrollHeight,r.clientHeight,o?o.scrollHeight:0,o?o.clientHeight:0),h=-l.scrollLeft+dt(i),c=-l.scrollTop;return P(o||r).direction==="rtl"&&(h+=C(r.clientWidth,o?o.clientWidth:0)-a),{width:a,height:f,x:h,y:c}}(A(t)))}function Ct(t){let e=z(t),n=["absolute","fixed"].includes(P(t).position)&&y(t)?F(t):t;return L(n)?e.filter(i=>L(i)&&function(s,r){let l=r.getRootNode==null?void 0:r.getRootNode();if(s.contains(r))return!0;if(l&&j(l)){let o=r;do{if(o&&s===o)return!0;o=o.parentNode||o.host}while(o)}return!1}(i,n)&&b(i)!=="body"):[]}var Pt={getClippingRect:function(t){let{element:e,boundary:n,rootBoundary:i,strategy:s}=t,r=[...n==="clippingAncestors"?Ct(e):[].concat(n),i],l=r[0],o=r.reduce((a,f)=>{let h=ct(e,f,s);return a.top=C(h.top,a.top),a.right=st(h.right,a.right),a.bottom=st(h.bottom,a.bottom),a.left=C(h.left,a.left),a},ct(e,l,s));return{width:o.right-o.left,height:o.bottom-o.top,x:o.left,y:o.top}},convertOffsetParentRelativeRectToViewportRelativeRect:function(t){let{rect:e,offsetParent:n,strategy:i}=t,s=y(n),r=A(n);if(n===r)return e;let l={scrollLeft:0,scrollTop:0},o={x:0,y:0};if((s||!s&&i!=="fixed")&&((b(n)!=="body"||K(r))&&(l=N(n)),y(n))){let a=E(n,!0);o.x=a.x+n.clientLeft,o.y=a.y+n.clientTop}return{...e,x:e.x-l.scrollLeft+o.x,y:e.y-l.scrollTop+o.y}},isElement:L,getDimensions:at,getOffsetParent:F,getDocumentElement:A,getElementRects:t=>{let{reference:e,floating:n,strategy:i}=t;return{reference:Ht(e,F(n),i),floating:{...at(n),x:0,y:0}}},getClientRects:t=>Array.from(t.getClientRects()),isRTL:t=>P(t).direction==="rtl"};function gt(t,e,n,i){i===void 0&&(i={});let{ancestorScroll:s=!0,ancestorResize:r=!0,elementResize:l=!0,animationFrame:o=!1}=i,a=s&&!o,f=r&&!o,h=a||f?[...L(t)?z(t):[],...z(e)]:[];h.forEach(d=>{a&&d.addEventListener("scroll",n,{passive:!0}),f&&d.addEventListener("resize",n)});let c,u=null;l&&(u=new ResizeObserver(n),L(t)&&!o&&u.observe(t),u.observe(e));let m=o?E(t):null;return o&&function d(){let p=E(t);!m||p.x===m.x&&p.y===m.y&&p.width===m.width&&p.height===m.height||n(),m=p,c=requestAnimationFrame(d)}(),l||n(),()=>{var d;h.forEach(p=>{a&&p.removeEventListener("scroll",n),f&&p.removeEventListener("resize",n)}),(d=u)==null||d.disconnect(),u=null,o&&cancelAnimationFrame(c)}}var yt=(t,e,n)=>it(t,e,{platform:Pt,...n});function vt(t){return t.altKey||t.shiftKey||t.ctrlKey||t.metaKey}var xt=document.createElement("template");xt.innerHTML=`<style>${J}</style>${G}`;var ne="eck-autocomplete",wt=class extends W{d;p=!1;m=!0;t;r;s=0;i=!0;e;l;o=null;a=this.c.bind(this);g=this.f.bind(this);v=this.A.bind(this);w=this.L.bind(this);static get observedAttributes(){return["connected-to-id","highlight-first-option","select-highlighted-option"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.appendChild(xt.content.cloneNode(!0)),this.r=this.shadowRoot.querySelector("slot")}attributeChangedCallback(e,n,i){e==="connected-to-id"?this.d=i:e==="highlight-first-option"?this.p=U(i):e==="select-highlighted-option"&&(this.m=U(i))}connectedCallback(){let e=document.querySelector(`#${this.d}`);e&&(this.t=e,this.b())}disconnectedCallback(){this.h(),this.t.removeEventListener("focus",this.a),this.t.removeEventListener("click",this.a),this.t.removeEventListener("input",this.w),this.t.removeEventListener("blur",this.g),this.t.removeEventListener("keydown",this.v)}setInputRef(e){this.t=e,this.b()}b(){this.r.addEventListener("slotchange",()=>{this.T()}),this.t.addEventListener("focus",this.a),this.t.addEventListener("click",this.a),this.t.addEventListener("input",this.w),this.t.addEventListener("blur",this.g),this.t.addEventListener("keydown",this.v)}c(){this.i&&(this.i=!1,this.k(),this.n(this.e,!1),this.e=void 0,this.E(),this.shadowRoot.host.style.display="block")}f(){this.shadowRoot.host.style.display="none",this.i=!0,this.h(),this.o=null}L(){this.o=this.t.value,this.c()}R(){let e=this.t.getBoundingClientRect().width;this.shadowRoot.host.style.width=`${e}px`,yt(this.t,this.shadowRoot.host,{middleware:[$()],strategy:"fixed"}).then(({x:n,y:i})=>{Object.assign(this.shadowRoot.host.style,{left:`${n}px`,top:`${i}px`})})}O(e){this.i||this.e===void 0||this.s===0||(e.preventDefault(),this.e?.fireSelectionEvent())}E(){if(!this.p)return;let e=this.r.assignedElements().filter(this.u);e[0]&&(this.n(e[0],!0,!0),this.e=e[0])}H(e){let n=this.r.assignedElements().filter(this.u);if(this.e===void 0){e==="ArrowUp"?(this.n(n[n.length-1],!0),this.e=n[n.length-1]):e==="ArrowDown"&&(this.n(n[0],!0),this.e=n[0]);return}for(let i=0;i<n.length;i++){let s=n[i];if(s.getAttribute("highlighted")===""){this.n(s,!1);let r=0;e==="ArrowUp"?i>0?r=i-1:r=n.length-1:e==="ArrowDown"&&(i<n.length-1?r=i+1:r=0),this.n(n[r],!0),this.e=n[r];break}}}n(e,n,i=!1){this.o===null&&n&&(this.o=this.t.value),e?.highlight(n,i),n&&e?.scrollIntoView({block:"nearest"})}k(){this.h(),this.R(),this.l=gt(this.t,this.shadowRoot.host,this.R.bind(this))}h(){this.l&&(this.l(),this.l=void 0)}A(e){vt(e)||(e.key==="Enter"?this.O(e):e.key==="Escape"?(e.preventDefault(),this.o!==null&&(this.t.value=this.o),this.f()):(e.key==="ArrowUp"||e.key==="ArrowDown")&&(e.preventDefault(),this.i?this.c():this.H(e.key)))}T(){this.s=0,this.r.assignedElements().filter(this.u).forEach(e=>{this.s++,this.n(e,!1),this.e=void 0,e.addEventListener("eck-autocomplete-option-selected",n=>{this.t.value=n.detail.label,this.f()}),e.addEventListener("eck-autocomplete-option-highlighted",n=>{!this.i&&this.m&&!n.detail.C&&(this.t.value=n.detail.label)})}),this.E(),this.shadowRoot.host.toggleAttribute("has-children",this.s!==0)}u(e){return e.identity==="eck-aco"}};export{ne as ECK_AUTOCOMPLETE_TAG_NAME,wt as EckAutocomplete}; | ||
:host{display:none;position:fixed;box-sizing:border-box;max-height:var(--eck-ac-max-height, 256px);overflow:auto;background-color:var(--eck-ac-background-color, #fff)}:host([has-children]){border:var(--eck-ac-border-size, 1px) solid var(--eck-ac-border-color, black);border-radius:var(--eck-ac-border-radius, 0)}`;var B=class extends HTMLElement{injectCSS(e){let n=document.createElement("template");n.innerHTML=`<style>${e}</style>`,this.shadowRoot.appendChild(n.content.cloneNode(!0))}};var I=t=>t!==null&&t!=="false";function $(t){return t.split("-")[0]}function tt(t){return t.split("-")[1]}function et(t){return["top","bottom"].includes($(t))?"x":"y"}function nt(t){return t==="y"?"height":"width"}function Q(t,e,n){let{reference:i,floating:s}=t,r=i.x+i.width/2-s.width/2,l=i.y+i.height/2-s.height/2,o=et(e),a=nt(o),f=i[a]/2-s[a]/2,h=o==="x",c;switch($(e)){case"top":c={x:r,y:i.y-s.height};break;case"bottom":c={x:r,y:i.y+i.height};break;case"right":c={x:i.x+i.width,y:l};break;case"left":c={x:i.x-s.width,y:l};break;default:c={x:i.x,y:i.y}}switch(tt(e)){case"start":c[o]-=f*(n&&h?-1:1);break;case"end":c[o]+=f*(n&&h?-1:1)}return c}var it=async(t,e,n)=>{let{placement:i="bottom",strategy:s="absolute",middleware:r=[],platform:l}=n,o=await(l.isRTL==null?void 0:l.isRTL(e)),a=await l.getElementRects({reference:t,floating:e,strategy:s}),{x:f,y:h}=Q(a,i,o),c=i,d={},m=0;for(let u=0;u<r.length;u++){let{name:p,fn:A}=r[u],{x:w,y:O,data:P,reset:g}=await A({x:f,y:h,initialPlacement:i,placement:c,strategy:s,middlewareData:d,rects:a,platform:l,elements:{reference:t,floating:e}});f=w??f,h=O??h,d={...d,[p]:{...d[p],...P}},g&&m<=50&&(m++,typeof g=="object"&&(g.placement&&(c=g.placement),g.rects&&(a=g.rects===!0?await l.getElementRects({reference:t,floating:e,strategy:s}):g.rects),{x:f,y:h}=Q(a,c,o)),u=-1)}return{x:f,y:h,placement:c,strategy:s,middlewareData:d}};function Rt(t){return typeof t!="number"?function(e){return{top:0,right:0,bottom:0,left:0,...e}}(t):{top:t,right:t,bottom:t,left:t}}function D(t){return{...t,top:t.y,left:t.x,right:t.x+t.width,bottom:t.y+t.height}}async function ot(t,e){var n;e===void 0&&(e={});let{x:i,y:s,platform:r,rects:l,elements:o,strategy:a}=t,{boundary:f="clippingAncestors",rootBoundary:h="viewport",elementContext:c="floating",altBoundary:d=!1,padding:m=0}=e,u=Rt(m),p=o[d?c==="floating"?"reference":"floating":c],A=D(await r.getClippingRect({element:(n=await(r.isElement==null?void 0:r.isElement(p)))==null||n?p:p.contextElement||await(r.getDocumentElement==null?void 0:r.getDocumentElement(o.floating)),boundary:f,rootBoundary:h,strategy:a})),w=D(r.convertOffsetParentRelativeRectToViewportRelativeRect?await r.convertOffsetParentRelativeRectToViewportRelativeRect({rect:c==="floating"?{...l.floating,x:i,y:s}:l.reference,offsetParent:await(r.getOffsetParent==null?void 0:r.getOffsetParent(o.floating)),strategy:a}):l[c]);return{top:A.top-w.top+u.top,bottom:w.bottom-A.bottom+u.bottom,left:A.left-w.left+u.left,right:w.right-A.right+u.right}}var At={left:"right",right:"left",bottom:"top",top:"bottom"};function N(t){return t.replace(/left|right|bottom|top/g,e=>At[e])}function Lt(t,e,n){n===void 0&&(n=!1);let i=tt(t),s=et(t),r=nt(s),l=s==="x"?i===(n?"end":"start")?"right":"left":i==="start"?"bottom":"top";return e.reference[r]>e.floating[r]&&(l=N(l)),{main:l,cross:N(l)}}var kt={start:"end",end:"start"};function Z(t){return t.replace(/start|end/g,e=>kt[e])}var Tt=["top","right","bottom","left"],Bt=Tt.reduce((t,e)=>t.concat(e,e+"-start",e+"-end"),[]);var F=function(t){return t===void 0&&(t={}),{name:"flip",options:t,async fn(e){var n;let{placement:i,middlewareData:s,rects:r,initialPlacement:l,platform:o,elements:a}=e,{mainAxis:f=!0,crossAxis:h=!0,fallbackPlacements:c,fallbackStrategy:d="bestFit",flipAlignment:m=!0,...u}=t,p=$(i),A=c||(p===l||!m?[N(l)]:function(x){let T=N(x);return[Z(x),T,Z(T)]}(l)),w=[l,...A],O=await ot(e,u),P=[],g=((n=s.flip)==null?void 0:n.overflows)||[];if(f&&P.push(O[p]),h){let{main:x,cross:T}=Lt(i,r,await(o.isRTL==null?void 0:o.isRTL(a.floating)));P.push(O[x],O[T])}if(g=[...g,{placement:i,overflows:P}],!P.every(x=>x<=0)){var q,_;let x=((q=(_=s.flip)==null?void 0:_.index)!=null?q:0)+1,T=w[x];if(T)return{data:{index:x,overflows:g},reset:{placement:T}};let S="bottom";switch(d){case"bestFit":{var X;let Y=(X=g.map(W=>[W,W.overflows.filter(C=>C>0).reduce((C,bt)=>C+bt,0)]).sort((W,C)=>W[1]-C[1])[0])==null?void 0:X[0].placement;Y&&(S=Y);break}case"initialPlacement":S=l}if(i!==S)return{reset:{placement:S}}}return{}}}};function ft(t){return t&&t.document&&t.location&&t.alert&&t.setInterval}function R(t){if(t==null)return window;if(!ft(t)){let e=t.ownerDocument;return e&&e.defaultView||window}return t}function y(t){return R(t).getComputedStyle(t)}function b(t){return ft(t)?"":t?(t.nodeName||"").toLowerCase():""}function ht(){let t=navigator.userAgentData;return t!=null&&t.brands?t.brands.map(e=>e.brand+"/"+e.version).join(" "):navigator.userAgent}function v(t){return t instanceof R(t).HTMLElement}function k(t){return t instanceof R(t).Element}function H(t){return typeof ShadowRoot>"u"?!1:t instanceof R(t).ShadowRoot||t instanceof ShadowRoot}function K(t){let{overflow:e,overflowX:n,overflowY:i}=y(t);return/auto|scroll|overlay|hidden/.test(e+i+n)}function Ot(t){return["table","td","th"].includes(b(t))}function rt(t){let e=/firefox/i.test(ht()),n=y(t);return n.transform!=="none"||n.perspective!=="none"||n.contain==="paint"||["transform","perspective"].includes(n.willChange)||e&&n.willChange==="filter"||e&&!!n.filter&&n.filter!=="none"}function ut(){return!/^((?!chrome|android).)*safari/i.test(ht())}var st=Math.min,M=Math.max,V=Math.round;function E(t,e,n){var i,s,r,l;e===void 0&&(e=!1),n===void 0&&(n=!1);let o=t.getBoundingClientRect(),a=1,f=1;e&&v(t)&&(a=t.offsetWidth>0&&V(o.width)/t.offsetWidth||1,f=t.offsetHeight>0&&V(o.height)/t.offsetHeight||1);let h=k(t)?R(t):window,c=!ut()&&n,d=(o.left+(c&&(i=(s=h.visualViewport)==null?void 0:s.offsetLeft)!=null?i:0))/a,m=(o.top+(c&&(r=(l=h.visualViewport)==null?void 0:l.offsetTop)!=null?r:0))/f,u=o.width/a,p=o.height/f;return{width:u,height:p,top:m,right:d+u,bottom:m+p,left:d,x:d,y:m}}function L(t){return(e=t,(e instanceof R(e).Node?t.ownerDocument:t.document)||window.document).documentElement;var e}function U(t){return k(t)?{scrollLeft:t.scrollLeft,scrollTop:t.scrollTop}:{scrollLeft:t.pageXOffset,scrollTop:t.pageYOffset}}function dt(t){return E(L(t)).left+U(t).scrollLeft}function Pt(t,e,n){let i=v(e),s=L(e),r=E(t,i&&function(a){let f=E(a);return V(f.width)!==a.offsetWidth||V(f.height)!==a.offsetHeight}(e),n==="fixed"),l={scrollLeft:0,scrollTop:0},o={x:0,y:0};if(i||!i&&n!=="fixed")if((b(e)!=="body"||K(s))&&(l=U(e)),v(e)){let a=E(e,!0);o.x=a.x+e.clientLeft,o.y=a.y+e.clientTop}else s&&(o.x=dt(s));return{x:r.left+l.scrollLeft-o.x,y:r.top+l.scrollTop-o.y,width:r.width,height:r.height}}function pt(t){return b(t)==="html"?t:t.assignedSlot||t.parentNode||(H(t)?t.host:null)||L(t)}function lt(t){return v(t)&&y(t).position!=="fixed"?function(e){let{offsetParent:n}=e,i=e,s=!1;for(;i&&i!==n;){let{assignedSlot:r}=i;if(r){let l=r.offsetParent;if(y(r).display==="contents"){let o=r.hasAttribute("style"),a=r.style.display;r.style.display=y(i).display,l=r.offsetParent,r.style.display=a,o||r.removeAttribute("style")}i=r,n!==l&&(n=l,s=!0)}else if(H(i)&&i.host&&s)break;i=H(i)&&i.host||i.parentNode}return n}(t):null}function j(t){let e=R(t),n=lt(t);for(;n&&Ot(n)&&y(n).position==="static";)n=lt(n);return n&&(b(n)==="html"||b(n)==="body"&&y(n).position==="static"&&!rt(n))?e:n||function(i){let s=pt(i);for(H(s)&&(s=s.host);v(s)&&!["html","body"].includes(b(s));){if(rt(s))return s;{let r=s.parentNode;s=H(r)?r.host:r}}return null}(t)||e}function at(t){if(v(t))return{width:t.offsetWidth,height:t.offsetHeight};let e=E(t);return{width:e.width,height:e.height}}function mt(t){let e=pt(t);return["html","body","#document"].includes(b(e))?t.ownerDocument.body:v(e)&&K(e)?e:mt(e)}function z(t,e){var n;e===void 0&&(e=[]);let i=mt(t),s=i===((n=t.ownerDocument)==null?void 0:n.body),r=R(i),l=s?[r].concat(r.visualViewport||[],K(i)?i:[]):i,o=e.concat(l);return s?o:o.concat(z(l))}function ct(t,e,n){return e==="viewport"?D(function(i,s){let r=R(i),l=L(i),o=r.visualViewport,a=l.clientWidth,f=l.clientHeight,h=0,c=0;if(o){a=o.width,f=o.height;let d=ut();(d||!d&&s==="fixed")&&(h=o.offsetLeft,c=o.offsetTop)}return{width:a,height:f,x:h,y:c}}(t,n)):k(e)?function(i,s){let r=E(i,!1,s==="fixed"),l=r.top+i.clientTop,o=r.left+i.clientLeft;return{top:l,left:o,x:o,y:l,right:o+i.clientWidth,bottom:l+i.clientHeight,width:i.clientWidth,height:i.clientHeight}}(e,n):D(function(i){var s;let r=L(i),l=U(i),o=(s=i.ownerDocument)==null?void 0:s.body,a=M(r.scrollWidth,r.clientWidth,o?o.scrollWidth:0,o?o.clientWidth:0),f=M(r.scrollHeight,r.clientHeight,o?o.scrollHeight:0,o?o.clientHeight:0),h=-l.scrollLeft+dt(i),c=-l.scrollTop;return y(o||r).direction==="rtl"&&(h+=M(r.clientWidth,o?o.clientWidth:0)-a),{width:a,height:f,x:h,y:c}}(L(t)))}function Ht(t){let e=z(t),n=["absolute","fixed"].includes(y(t).position)&&v(t)?j(t):t;return k(n)?e.filter(i=>k(i)&&function(s,r){let l=r.getRootNode==null?void 0:r.getRootNode();if(s.contains(r))return!0;if(l&&H(l)){let o=r;do{if(o&&s===o)return!0;o=o.parentNode||o.host}while(o)}return!1}(i,n)&&b(i)!=="body"):[]}var Ct={getClippingRect:function(t){let{element:e,boundary:n,rootBoundary:i,strategy:s}=t,r=[...n==="clippingAncestors"?Ht(e):[].concat(n),i],l=r[0],o=r.reduce((a,f)=>{let h=ct(e,f,s);return a.top=M(h.top,a.top),a.right=st(h.right,a.right),a.bottom=st(h.bottom,a.bottom),a.left=M(h.left,a.left),a},ct(e,l,s));return{width:o.right-o.left,height:o.bottom-o.top,x:o.left,y:o.top}},convertOffsetParentRelativeRectToViewportRelativeRect:function(t){let{rect:e,offsetParent:n,strategy:i}=t,s=v(n),r=L(n);if(n===r)return e;let l={scrollLeft:0,scrollTop:0},o={x:0,y:0};if((s||!s&&i!=="fixed")&&((b(n)!=="body"||K(r))&&(l=U(n)),v(n))){let a=E(n,!0);o.x=a.x+n.clientLeft,o.y=a.y+n.clientTop}return{...e,x:e.x-l.scrollLeft+o.x,y:e.y-l.scrollTop+o.y}},isElement:k,getDimensions:at,getOffsetParent:j,getDocumentElement:L,getElementRects:t=>{let{reference:e,floating:n,strategy:i}=t;return{reference:Pt(e,j(n),i),floating:{...at(n),x:0,y:0}}},getClientRects:t=>Array.from(t.getClientRects()),isRTL:t=>y(t).direction==="rtl"};function gt(t,e,n,i){i===void 0&&(i={});let{ancestorScroll:s=!0,ancestorResize:r=!0,elementResize:l=!0,animationFrame:o=!1}=i,a=s&&!o,f=r&&!o,h=a||f?[...k(t)?z(t):[],...z(e)]:[];h.forEach(u=>{a&&u.addEventListener("scroll",n,{passive:!0}),f&&u.addEventListener("resize",n)});let c,d=null;if(l){let u=!0;d=new ResizeObserver(()=>{u||n(),u=!1}),k(t)&&!o&&d.observe(t),d.observe(e)}let m=o?E(t):null;return o&&function u(){let p=E(t);!m||p.x===m.x&&p.y===m.y&&p.width===m.width&&p.height===m.height||n(),m=p,c=requestAnimationFrame(u)}(),n(),()=>{var u;h.forEach(p=>{a&&p.removeEventListener("scroll",n),f&&p.removeEventListener("resize",n)}),(u=d)==null||u.disconnect(),d=null,o&&cancelAnimationFrame(c)}}var yt=(t,e,n)=>it(t,e,{platform:Ct,...n});function vt(t){return t.altKey||t.shiftKey||t.ctrlKey||t.metaKey}var xt=document.createElement("template");xt.innerHTML=`<style>${J}</style>${G}`;var ne="eck-autocomplete",wt=class extends B{d;p=!1;m=!0;t;r;s=0;i=!0;e;l;o=null;a=this.c.bind(this);g=this.f.bind(this);v=this.A.bind(this);w=this.L.bind(this);static get observedAttributes(){return["connected-to-id","highlight-first-option","select-highlighted-option"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.appendChild(xt.content.cloneNode(!0)),this.r=this.shadowRoot.querySelector("slot")}attributeChangedCallback(e,n,i){e==="connected-to-id"?this.d=i:e==="highlight-first-option"?this.p=I(i):e==="select-highlighted-option"&&(this.m=I(i))}connectedCallback(){let e=document.querySelector(`#${this.d}`);e&&(this.t=e,this.b())}disconnectedCallback(){this.h(),this.t.removeEventListener("focus",this.a),this.t.removeEventListener("click",this.a),this.t.removeEventListener("input",this.w),this.t.removeEventListener("blur",this.g),this.t.removeEventListener("keydown",this.v)}setInputRef(e){this.t=e,this.b()}b(){this.r.addEventListener("slotchange",()=>{this.k()}),this.t.addEventListener("focus",this.a),this.t.addEventListener("click",this.a),this.t.addEventListener("input",this.w),this.t.addEventListener("blur",this.g),this.t.addEventListener("keydown",this.v)}c(){this.i&&(this.i=!1,this.T(),this.n(this.e,!1),this.e=void 0,this.E(),this.shadowRoot.host.style.display="block")}f(){this.shadowRoot.host.style.display="none",this.i=!0,this.h(),this.o=null}L(){this.o=this.t.value,this.c()}R(){let e=this.t.getBoundingClientRect().width;this.shadowRoot.host.style.width=`${e}px`,yt(this.t,this.shadowRoot.host,{middleware:[F()],strategy:"fixed"}).then(({x:n,y:i})=>{Object.assign(this.shadowRoot.host.style,{left:`${n}px`,top:`${i}px`})})}O(e){this.i||this.e===void 0||this.s===0||(e.preventDefault(),this.e?.fireSelectionEvent())}E(){if(!this.p)return;let e=this.r.assignedElements().filter(this.u);e[0]&&(this.n(e[0],!0,!0),this.e=e[0])}P(e){let n=this.r.assignedElements().filter(this.u);if(this.e===void 0){e==="ArrowUp"?(this.n(n[n.length-1],!0),this.e=n[n.length-1]):e==="ArrowDown"&&(this.n(n[0],!0),this.e=n[0]);return}for(let i=0;i<n.length;i++){let s=n[i];if(s.getAttribute("highlighted")===""){this.n(s,!1);let r=0;e==="ArrowUp"?i>0?r=i-1:r=n.length-1:e==="ArrowDown"&&(i<n.length-1?r=i+1:r=0),this.n(n[r],!0),this.e=n[r];break}}}n(e,n,i=!1){this.o===null&&n&&(this.o=this.t.value),e?.highlight(n,i),n&&e?.scrollIntoView({block:"nearest"})}T(){this.h(),this.R(),this.l=gt(this.t,this.shadowRoot.host,this.R.bind(this))}h(){this.l&&(this.l(),this.l=void 0)}A(e){vt(e)||(e.key==="Enter"?this.O(e):e.key==="Escape"?(e.preventDefault(),this.o!==null&&(this.t.value=this.o),this.f()):(e.key==="ArrowUp"||e.key==="ArrowDown")&&(e.preventDefault(),this.i?this.c():this.P(e.key)))}k(){this.s=0,this.r.assignedElements().filter(this.u).forEach(e=>{this.s++,this.n(e,!1),this.e=void 0,e.addEventListener("eck-autocomplete-option-selected",n=>{this.t.value=n.detail.label,this.f()}),e.addEventListener("eck-autocomplete-option-highlighted",n=>{!this.i&&this.m&&!n.detail.H&&(this.t.value=n.detail.label)})}),this.E(),this.shadowRoot.host.toggleAttribute("has-children",this.s!==0)}u(e){return e.identity==="eck-aco"}};export{ne as ECK_AUTOCOMPLETE_TAG_NAME,wt as EckAutocomplete}; | ||
//# sourceMappingURL=eck-autocomplete-component.js.map |
@@ -1,3 +0,3 @@ | ||
var s="<slot></slot>";var i=` | ||
:host{display:block;box-sizing:border-box;padding:5px;color:#000}:host(:hover),:host([highlighted]){background-color:#b3e5fc;cursor:pointer}`;var o=class extends HTMLElement{injectCSS(t){let e=document.createElement("template");e.innerHTML=`<style>${t}</style>`,this.shadowRoot.appendChild(e.content.cloneNode(!0))}};var a=document.createElement("template");a.innerHTML=`<style>${i}</style>${s}`;var b="eck-autocomplete-option",l=class extends o{identity="eck-aco";value;t;static get observedAttributes(){return["label"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.appendChild(a.content.cloneNode(!0))}attributeChangedCallback(t,e,n){t==="label"&&(this.t=n||void 0)}connectedCallback(){this.shadowRoot.host.addEventListener("mousedown",t=>{t.preventDefault()}),this.shadowRoot.host.addEventListener("click",()=>{this.fireSelectionEvent()})}highlight(t,e){this.shadowRoot.host.toggleAttribute("highlighted",t),t&&this.shadowRoot.dispatchEvent(new CustomEvent("eck-autocomplete-option-highlighted",{composed:!0,detail:{value:this.value,label:this.e(),o:e}}))}fireSelectionEvent(){this.shadowRoot.dispatchEvent(new CustomEvent("eck-autocomplete-option-selected",{composed:!0,bubbles:!0,detail:{value:this.value,label:this.e()}}))}e(){return this.t!==void 0?this.t:this.shadowRoot.host.innerHTML}};export{b as ECK_AUTOCOMPLETE_OPTION_TAG_NAME,l as EckAutocompleteOption}; | ||
var l="<slot></slot>";var s=` | ||
:host{display:block;box-sizing:border-box;padding:var(--eck-aco-padding, 5px);color:var(--eck-aco-color, black)}:host(:hover),:host([highlighted]){background-color:var(--eck-aco-background-color, #b3e5fc);cursor:pointer}`;var o=class extends HTMLElement{injectCSS(t){let e=document.createElement("template");e.innerHTML=`<style>${t}</style>`,this.shadowRoot.appendChild(e.content.cloneNode(!0))}};var a=document.createElement("template");a.innerHTML=`<style>${s}</style>${l}`;var b="eck-autocomplete-option",i=class extends o{identity="eck-aco";value;t;static get observedAttributes(){return["label"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.appendChild(a.content.cloneNode(!0))}attributeChangedCallback(t,e,n){t==="label"&&(this.t=n||void 0)}connectedCallback(){this.shadowRoot.host.addEventListener("mousedown",t=>{t.preventDefault()}),this.shadowRoot.host.addEventListener("click",()=>{this.fireSelectionEvent()})}highlight(t,e){this.shadowRoot.host.toggleAttribute("highlighted",t),t&&this.shadowRoot.dispatchEvent(new CustomEvent("eck-autocomplete-option-highlighted",{composed:!0,detail:{value:this.value,label:this.e(),o:e}}))}fireSelectionEvent(){this.shadowRoot.dispatchEvent(new CustomEvent("eck-autocomplete-option-selected",{composed:!0,bubbles:!0,detail:{value:this.value,label:this.e()}}))}e(){return this.t!==void 0?this.t:this.shadowRoot.host.innerHTML}};export{b as ECK_AUTOCOMPLETE_OPTION_TAG_NAME,i as EckAutocompleteOption}; | ||
//# sourceMappingURL=eck-autocomplete-option-component.js.map |
var tt="<slot></slot>";var et=` | ||
:host{display:none;position:fixed;box-sizing:border-box;max-height:256px;overflow:auto;background-color:#fff}:host([has-children]){border:1px solid #000}`;var k=class extends HTMLElement{injectCSS(e){let n=document.createElement("template");n.innerHTML=`<style>${e}</style>`,this.shadowRoot.appendChild(n.content.cloneNode(!0))}};var I=t=>t!==null&&t!=="false";function $(t){return t.split("-")[0]}function it(t){return t.split("-")[1]}function rt(t){return["top","bottom"].includes($(t))?"x":"y"}function st(t){return t==="y"?"height":"width"}function nt(t,e,n){let{reference:o,floating:s}=t,r=o.x+o.width/2-s.width/2,l=o.y+o.height/2-s.height/2,i=rt(e),a=st(i),f=o[a]/2-s[a]/2,h=i==="x",c;switch($(e)){case"top":c={x:r,y:o.y-s.height};break;case"bottom":c={x:r,y:o.y+o.height};break;case"right":c={x:o.x+o.width,y:l};break;case"left":c={x:o.x-s.width,y:l};break;default:c={x:o.x,y:o.y}}switch(it(e)){case"start":c[i]-=f*(n&&h?-1:1);break;case"end":c[i]+=f*(n&&h?-1:1)}return c}var lt=async(t,e,n)=>{let{placement:o="bottom",strategy:s="absolute",middleware:r=[],platform:l}=n,i=await(l.isRTL==null?void 0:l.isRTL(e)),a=await l.getElementRects({reference:t,floating:e,strategy:s}),{x:f,y:h}=nt(a,o,i),c=o,u={};for(let m=0;m<r.length;m++){let{name:d,fn:p}=r[m],{x:y,y:w,data:O,reset:g}=await p({x:f,y:h,initialPlacement:o,placement:c,strategy:s,middlewareData:u,rects:a,platform:l,elements:{reference:t,floating:e}});f=y??f,h=w??h,u={...u,[d]:{...u[d],...O}},g&&(typeof g=="object"&&(g.placement&&(c=g.placement),g.rects&&(a=g.rects===!0?await l.getElementRects({reference:t,floating:e,strategy:s}):g.rects),{x:f,y:h}=nt(a,c,i)),m=-1)}return{x:f,y:h,placement:c,strategy:s,middlewareData:u}};function Ct(t){return typeof t!="number"?function(e){return{top:0,right:0,bottom:0,left:0,...e}}(t):{top:t,right:t,bottom:t,left:t}}function H(t){return{...t,top:t.y,left:t.x,right:t.x+t.width,bottom:t.y+t.height}}async function at(t,e){var n;e===void 0&&(e={});let{x:o,y:s,platform:r,rects:l,elements:i,strategy:a}=t,{boundary:f="clippingAncestors",rootBoundary:h="viewport",elementContext:c="floating",altBoundary:u=!1,padding:m=0}=e,d=Ct(m),p=i[u?c==="floating"?"reference":"floating":c],y=H(await r.getClippingRect({element:(n=await(r.isElement==null?void 0:r.isElement(p)))==null||n?p:p.contextElement||await(r.getDocumentElement==null?void 0:r.getDocumentElement(i.floating)),boundary:f,rootBoundary:h,strategy:a})),w=H(r.convertOffsetParentRelativeRectToViewportRelativeRect?await r.convertOffsetParentRelativeRectToViewportRelativeRect({rect:c==="floating"?{...l.floating,x:o,y:s}:l.reference,offsetParent:await(r.getOffsetParent==null?void 0:r.getOffsetParent(i.floating)),strategy:a}):l[c]);return{top:y.top-w.top+d.top,bottom:w.bottom-y.bottom+d.bottom,left:y.left-w.left+d.left,right:w.right-y.right+d.right}}var Ht={left:"right",right:"left",bottom:"top",top:"bottom"};function N(t){return t.replace(/left|right|bottom|top/g,e=>Ht[e])}function Pt(t,e,n){n===void 0&&(n=!1);let o=it(t),s=rt(t),r=st(s),l=s==="x"?o===(n?"end":"start")?"right":"left":o==="start"?"bottom":"top";return e.reference[r]>e.floating[r]&&(l=N(l)),{main:l,cross:N(l)}}var Mt={start:"end",end:"start"};function ot(t){return t.replace(/start|end/g,e=>Mt[e])}var Dt=["top","right","bottom","left"],It=Dt.reduce((t,e)=>t.concat(e,e+"-start",e+"-end"),[]);var F=function(t){return t===void 0&&(t={}),{name:"flip",options:t,async fn(e){var n;let{placement:o,middlewareData:s,rects:r,initialPlacement:l,platform:i,elements:a}=e,{mainAxis:f=!0,crossAxis:h=!0,fallbackPlacements:c,fallbackStrategy:u="bestFit",flipAlignment:m=!0,...d}=t,p=$(o),y=c||(p===l||!m?[N(l)]:function(x){let T=N(x);return[ot(x),T,ot(T)]}(l)),w=[l,...y],O=await at(e,d),g=[],D=((n=s.flip)==null?void 0:n.overflows)||[];if(f&&g.push(O[p]),h){let{main:x,cross:T}=Pt(o,r,await(i.isRTL==null?void 0:i.isRTL(a.floating)));g.push(O[x],O[T])}if(D=[...D,{placement:o,overflows:g}],!g.every(x=>x<=0)){var Y,J;let x=((Y=(J=s.flip)==null?void 0:J.index)!=null?Y:0)+1,T=w[x];if(T)return{data:{index:x,overflows:D},reset:{placement:T}};let S="bottom";switch(u){case"bestFit":{var Q;let Z=(Q=D.map(W=>[W,W.overflows.filter(C=>C>0).reduce((C,kt)=>C+kt,0)]).sort((W,C)=>W[1]-C[1])[0])==null?void 0:Q[0].placement;Z&&(S=Z);break}case"initialPlacement":S=l}if(o!==S)return{reset:{placement:S}}}return{}}}};function pt(t){return t&&t.document&&t.location&&t.alert&&t.setInterval}function A(t){if(t==null)return window;if(!pt(t)){let e=t.ownerDocument;return e&&e.defaultView||window}return t}function M(t){return A(t).getComputedStyle(t)}function b(t){return pt(t)?"":t?(t.nodeName||"").toLowerCase():""}function mt(){let t=navigator.userAgentData;return t!=null&&t.brands?t.brands.map(e=>e.brand+"/"+e.version).join(" "):navigator.userAgent}function v(t){return t instanceof A(t).HTMLElement}function L(t){return t instanceof A(t).Element}function G(t){return typeof ShadowRoot>"u"?!1:t instanceof A(t).ShadowRoot||t instanceof ShadowRoot}function B(t){let{overflow:e,overflowX:n,overflowY:o}=M(t);return/auto|scroll|overlay|hidden/.test(e+o+n)}function St(t){return["table","td","th"].includes(b(t))}function ct(t){let e=/firefox/i.test(mt()),n=M(t);return n.transform!=="none"||n.perspective!=="none"||n.contain==="paint"||["transform","perspective"].includes(n.willChange)||e&&n.willChange==="filter"||e&&!!n.filter&&n.filter!=="none"}function gt(){return!/^((?!chrome|android).)*safari/i.test(mt())}var ft=Math.min,P=Math.max,_=Math.round;function E(t,e,n){var o,s,r,l;e===void 0&&(e=!1),n===void 0&&(n=!1);let i=t.getBoundingClientRect(),a=1,f=1;e&&v(t)&&(a=t.offsetWidth>0&&_(i.width)/t.offsetWidth||1,f=t.offsetHeight>0&&_(i.height)/t.offsetHeight||1);let h=L(t)?A(t):window,c=!gt()&&n,u=(i.left+(c&&(o=(s=h.visualViewport)==null?void 0:s.offsetLeft)!=null?o:0))/a,m=(i.top+(c&&(r=(l=h.visualViewport)==null?void 0:l.offsetTop)!=null?r:0))/f,d=i.width/a,p=i.height/f;return{width:d,height:p,top:m,right:u+d,bottom:m+p,left:u,x:u,y:m}}function R(t){return(e=t,(e instanceof A(e).Node?t.ownerDocument:t.document)||window.document).documentElement;var e}function z(t){return L(t)?{scrollLeft:t.scrollLeft,scrollTop:t.scrollTop}:{scrollLeft:t.pageXOffset,scrollTop:t.pageYOffset}}function vt(t){return E(R(t)).left+z(t).scrollLeft}function Wt(t,e,n){let o=v(e),s=R(e),r=E(t,o&&function(a){let f=E(a);return _(f.width)!==a.offsetWidth||_(f.height)!==a.offsetHeight}(e),n==="fixed"),l={scrollLeft:0,scrollTop:0},i={x:0,y:0};if(o||!o&&n!=="fixed")if((b(e)!=="body"||B(s))&&(l=z(e)),v(e)){let a=E(e,!0);i.x=a.x+e.clientLeft,i.y=a.y+e.clientTop}else s&&(i.x=vt(s));return{x:r.left+l.scrollLeft-i.x,y:r.top+l.scrollTop-i.y,width:r.width,height:r.height}}function yt(t){return b(t)==="html"?t:t.assignedSlot||t.parentNode||(G(t)?t.host:null)||R(t)}function ht(t){return v(t)&&getComputedStyle(t).position!=="fixed"?t.offsetParent:null}function j(t){let e=A(t),n=ht(t);for(;n&&St(n)&&getComputedStyle(n).position==="static";)n=ht(n);return n&&(b(n)==="html"||b(n)==="body"&&getComputedStyle(n).position==="static"&&!ct(n))?e:n||function(o){let s=yt(o);for(G(s)&&(s=s.host);v(s)&&!["html","body"].includes(b(s));){if(ct(s))return s;s=s.parentNode}return null}(t)||e}function ut(t){if(v(t))return{width:t.offsetWidth,height:t.offsetHeight};let e=E(t);return{width:e.width,height:e.height}}function wt(t){let e=yt(t);return["html","body","#document"].includes(b(e))?t.ownerDocument.body:v(e)&&B(e)?e:wt(e)}function K(t,e){var n;e===void 0&&(e=[]);let o=wt(t),s=o===((n=t.ownerDocument)==null?void 0:n.body),r=A(o),l=s?[r].concat(r.visualViewport||[],B(o)?o:[]):o,i=e.concat(l);return s?i:i.concat(K(l))}function dt(t,e,n){return e==="viewport"?H(function(o,s){let r=A(o),l=R(o),i=r.visualViewport,a=l.clientWidth,f=l.clientHeight,h=0,c=0;if(i){a=i.width,f=i.height;let u=gt();(u||!u&&s==="fixed")&&(h=i.offsetLeft,c=i.offsetTop)}return{width:a,height:f,x:h,y:c}}(t,n)):L(e)?function(o,s){let r=E(o,!1,s==="fixed"),l=r.top+o.clientTop,i=r.left+o.clientLeft;return{top:l,left:i,x:i,y:l,right:i+o.clientWidth,bottom:l+o.clientHeight,width:o.clientWidth,height:o.clientHeight}}(e,n):H(function(o){var s;let r=R(o),l=z(o),i=(s=o.ownerDocument)==null?void 0:s.body,a=P(r.scrollWidth,r.clientWidth,i?i.scrollWidth:0,i?i.clientWidth:0),f=P(r.scrollHeight,r.clientHeight,i?i.scrollHeight:0,i?i.clientHeight:0),h=-l.scrollLeft+vt(o),c=-l.scrollTop;return M(i||r).direction==="rtl"&&(h+=P(r.clientWidth,i?i.clientWidth:0)-a),{width:a,height:f,x:h,y:c}}(R(t)))}function Nt(t){let e=K(t),n=["absolute","fixed"].includes(M(t).position)&&v(t)?j(t):t;return L(n)?e.filter(o=>L(o)&&function(s,r){let l=r.getRootNode==null?void 0:r.getRootNode();if(s.contains(r))return!0;if(l&&G(l)){let i=r;do{if(i&&s===i)return!0;i=i.parentNode||i.host}while(i)}return!1}(o,n)&&b(o)!=="body"):[]}var _t={getClippingRect:function(t){let{element:e,boundary:n,rootBoundary:o,strategy:s}=t,r=[...n==="clippingAncestors"?Nt(e):[].concat(n),o],l=r[0],i=r.reduce((a,f)=>{let h=dt(e,f,s);return a.top=P(h.top,a.top),a.right=ft(h.right,a.right),a.bottom=ft(h.bottom,a.bottom),a.left=P(h.left,a.left),a},dt(e,l,s));return{width:i.right-i.left,height:i.bottom-i.top,x:i.left,y:i.top}},convertOffsetParentRelativeRectToViewportRelativeRect:function(t){let{rect:e,offsetParent:n,strategy:o}=t,s=v(n),r=R(n);if(n===r)return e;let l={scrollLeft:0,scrollTop:0},i={x:0,y:0};if((s||!s&&o!=="fixed")&&((b(n)!=="body"||B(r))&&(l=z(n)),v(n))){let a=E(n,!0);i.x=a.x+n.clientLeft,i.y=a.y+n.clientTop}return{...e,x:e.x-l.scrollLeft+i.x,y:e.y-l.scrollTop+i.y}},isElement:L,getDimensions:ut,getOffsetParent:j,getDocumentElement:R,getElementRects:t=>{let{reference:e,floating:n,strategy:o}=t;return{reference:Wt(e,j(n),o),floating:{...ut(n),x:0,y:0}}},getClientRects:t=>Array.from(t.getClientRects()),isRTL:t=>M(t).direction==="rtl"};function xt(t,e,n,o){o===void 0&&(o={});let{ancestorScroll:s=!0,ancestorResize:r=!0,elementResize:l=!0,animationFrame:i=!1}=o,a=s&&!i,f=r&&!i,h=a||f?[...L(t)?K(t):[],...K(e)]:[];h.forEach(d=>{a&&d.addEventListener("scroll",n,{passive:!0}),f&&d.addEventListener("resize",n)});let c,u=null;l&&(u=new ResizeObserver(n),L(t)&&!i&&u.observe(t),u.observe(e));let m=i?E(t):null;return i&&function d(){let p=E(t);!m||p.x===m.x&&p.y===m.y&&p.width===m.width&&p.height===m.height||n(),m=p,c=requestAnimationFrame(d)}(),l||n(),()=>{var d;h.forEach(p=>{a&&p.removeEventListener("scroll",n),f&&p.removeEventListener("resize",n)}),(d=u)==null||d.disconnect(),u=null,i&&cancelAnimationFrame(c)}}var bt=(t,e,n)=>lt(t,e,{platform:_t,...n});function Et(t){return t.altKey||t.shiftKey||t.ctrlKey||t.metaKey}var At=document.createElement("template");At.innerHTML=`<style>${et}</style>${tt}`;var q="eck-autocomplete",U=class extends k{p;m=!1;g=!0;t;r;s=0;o=!0;e;l;i=null;a=this.c.bind(this);v=this.f.bind(this);w=this.T.bind(this);b=this.k.bind(this);static get observedAttributes(){return["connected-to-id","highlight-first-option","select-highlighted-option"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.appendChild(At.content.cloneNode(!0)),this.r=this.shadowRoot.querySelector("slot")}attributeChangedCallback(e,n,o){e==="connected-to-id"?this.p=o:e==="highlight-first-option"?this.m=I(o):e==="select-highlighted-option"&&(this.g=I(o))}connectedCallback(){let e=document.querySelector(`#${this.p}`);e&&(this.t=e,this.E())}disconnectedCallback(){this.h(),this.t.removeEventListener("focus",this.a),this.t.removeEventListener("click",this.a),this.t.removeEventListener("input",this.b),this.t.removeEventListener("blur",this.v),this.t.removeEventListener("keydown",this.w)}setInputRef(e){this.t=e,this.E()}E(){this.r.addEventListener("slotchange",()=>{this.O()}),this.t.addEventListener("focus",this.a),this.t.addEventListener("click",this.a),this.t.addEventListener("input",this.b),this.t.addEventListener("blur",this.v),this.t.addEventListener("keydown",this.w)}c(){this.o&&(this.o=!1,this.C(),this.n(this.e,!1),this.e=void 0,this.A(),this.shadowRoot.host.style.display="block")}f(){this.shadowRoot.host.style.display="none",this.o=!0,this.h(),this.i=null}k(){this.i=this.t.value,this.c()}R(){let e=this.t.getBoundingClientRect().width;this.shadowRoot.host.style.width=`${e}px`,bt(this.t,this.shadowRoot.host,{middleware:[F()],strategy:"fixed"}).then(({x:n,y:o})=>{Object.assign(this.shadowRoot.host.style,{left:`${n}px`,top:`${o}px`})})}H(e){this.o||this.e===void 0||this.s===0||(e.preventDefault(),this.e?.fireSelectionEvent())}A(){if(!this.m)return;let e=this.r.assignedElements().filter(this.u);e[0]&&(this.n(e[0],!0,!0),this.e=e[0])}P(e){let n=this.r.assignedElements().filter(this.u);if(this.e===void 0){e==="ArrowUp"?(this.n(n[n.length-1],!0),this.e=n[n.length-1]):e==="ArrowDown"&&(this.n(n[0],!0),this.e=n[0]);return}for(let o=0;o<n.length;o++){let s=n[o];if(s.getAttribute("highlighted")===""){this.n(s,!1);let r=0;e==="ArrowUp"?o>0?r=o-1:r=n.length-1:e==="ArrowDown"&&(o<n.length-1?r=o+1:r=0),this.n(n[r],!0),this.e=n[r];break}}}n(e,n,o=!1){this.i===null&&n&&(this.i=this.t.value),e?.highlight(n,o),n&&e?.scrollIntoView({block:"nearest"})}C(){this.h(),this.R(),this.l=xt(this.t,this.shadowRoot.host,this.R.bind(this))}h(){this.l&&(this.l(),this.l=void 0)}T(e){Et(e)||(e.key==="Enter"?this.H(e):e.key==="Escape"?(e.preventDefault(),this.i!==null&&(this.t.value=this.i),this.f()):(e.key==="ArrowUp"||e.key==="ArrowDown")&&(e.preventDefault(),this.o?this.c():this.P(e.key)))}O(){this.s=0,this.r.assignedElements().filter(this.u).forEach(e=>{this.s++,this.n(e,!1),this.e=void 0,e.addEventListener("eck-autocomplete-option-selected",n=>{this.t.value=n.detail.label,this.f()}),e.addEventListener("eck-autocomplete-option-highlighted",n=>{!this.o&&this.g&&!n.detail.M&&(this.t.value=n.detail.label)})}),this.A(),this.shadowRoot.host.toggleAttribute("has-children",this.s!==0)}u(e){return e.identity==="eck-aco"}};var Rt="<slot></slot>";var Lt=` | ||
:host{display:block;box-sizing:border-box;padding:5px;color:#000}:host(:hover),:host([highlighted]){background-color:#b3e5fc;cursor:pointer}`;var Tt=document.createElement("template");Tt.innerHTML=`<style>${Lt}</style>${Rt}`;var X="eck-autocomplete-option",V=class extends k{identity="eck-aco";value;d;static get observedAttributes(){return["label"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.appendChild(Tt.content.cloneNode(!0))}attributeChangedCallback(e,n,o){e==="label"&&(this.d=o||void 0)}connectedCallback(){this.shadowRoot.host.addEventListener("mousedown",e=>{e.preventDefault()}),this.shadowRoot.host.addEventListener("click",()=>{this.fireSelectionEvent()})}highlight(e,n){this.shadowRoot.host.toggleAttribute("highlighted",e),e&&this.shadowRoot.dispatchEvent(new CustomEvent("eck-autocomplete-option-highlighted",{composed:!0,detail:{value:this.value,label:this.L(),M:n}}))}fireSelectionEvent(){this.shadowRoot.dispatchEvent(new CustomEvent("eck-autocomplete-option-selected",{composed:!0,bubbles:!0,detail:{value:this.value,label:this.L()}}))}L(){return this.d!==void 0?this.d:this.shadowRoot.host.innerHTML}};customElements.get(X)===void 0&&customElements.define(X,V);customElements.get(q)===void 0&&customElements.define(q,U); | ||
:host{display:none;position:fixed;box-sizing:border-box;max-height:var(--eck-ac-max-height, 256px);overflow:auto;background-color:var(--eck-ac-background-color, #fff)}:host([has-children]){border:var(--eck-ac-border-size, 1px) solid var(--eck-ac-border-color, black);border-radius:var(--eck-ac-border-radius, 0)}`;var P=class extends HTMLElement{injectCSS(e){let n=document.createElement("template");n.innerHTML=`<style>${e}</style>`,this.shadowRoot.appendChild(n.content.cloneNode(!0))}};var $=t=>t!==null&&t!=="false";function F(t){return t.split("-")[0]}function it(t){return t.split("-")[1]}function rt(t){return["top","bottom"].includes(F(t))?"x":"y"}function st(t){return t==="y"?"height":"width"}function nt(t,e,n){let{reference:o,floating:s}=t,r=o.x+o.width/2-s.width/2,l=o.y+o.height/2-s.height/2,i=rt(e),a=st(i),f=o[a]/2-s[a]/2,h=i==="x",c;switch(F(e)){case"top":c={x:r,y:o.y-s.height};break;case"bottom":c={x:r,y:o.y+o.height};break;case"right":c={x:o.x+o.width,y:l};break;case"left":c={x:o.x-s.width,y:l};break;default:c={x:o.x,y:o.y}}switch(it(e)){case"start":c[i]-=f*(n&&h?-1:1);break;case"end":c[i]+=f*(n&&h?-1:1)}return c}var lt=async(t,e,n)=>{let{placement:o="bottom",strategy:s="absolute",middleware:r=[],platform:l}=n,i=await(l.isRTL==null?void 0:l.isRTL(e)),a=await l.getElementRects({reference:t,floating:e,strategy:s}),{x:f,y:h}=nt(a,o,i),c=o,d={},m=0;for(let u=0;u<r.length;u++){let{name:p,fn:k}=r[u],{x:w,y:O,data:C,reset:g}=await k({x:f,y:h,initialPlacement:o,placement:c,strategy:s,middlewareData:d,rects:a,platform:l,elements:{reference:t,floating:e}});f=w??f,h=O??h,d={...d,[p]:{...d[p],...C}},g&&m<=50&&(m++,typeof g=="object"&&(g.placement&&(c=g.placement),g.rects&&(a=g.rects===!0?await l.getElementRects({reference:t,floating:e,strategy:s}):g.rects),{x:f,y:h}=nt(a,c,i)),u=-1)}return{x:f,y:h,placement:c,strategy:s,middlewareData:d}};function Ct(t){return typeof t!="number"?function(e){return{top:0,right:0,bottom:0,left:0,...e}}(t):{top:t,right:t,bottom:t,left:t}}function D(t){return{...t,top:t.y,left:t.x,right:t.x+t.width,bottom:t.y+t.height}}async function at(t,e){var n;e===void 0&&(e={});let{x:o,y:s,platform:r,rects:l,elements:i,strategy:a}=t,{boundary:f="clippingAncestors",rootBoundary:h="viewport",elementContext:c="floating",altBoundary:d=!1,padding:m=0}=e,u=Ct(m),p=i[d?c==="floating"?"reference":"floating":c],k=D(await r.getClippingRect({element:(n=await(r.isElement==null?void 0:r.isElement(p)))==null||n?p:p.contextElement||await(r.getDocumentElement==null?void 0:r.getDocumentElement(i.floating)),boundary:f,rootBoundary:h,strategy:a})),w=D(r.convertOffsetParentRelativeRectToViewportRelativeRect?await r.convertOffsetParentRelativeRectToViewportRelativeRect({rect:c==="floating"?{...l.floating,x:o,y:s}:l.reference,offsetParent:await(r.getOffsetParent==null?void 0:r.getOffsetParent(i.floating)),strategy:a}):l[c]);return{top:k.top-w.top+u.top,bottom:w.bottom-k.bottom+u.bottom,left:k.left-w.left+u.left,right:w.right-k.right+u.right}}var Pt={left:"right",right:"left",bottom:"top",top:"bottom"};function _(t){return t.replace(/left|right|bottom|top/g,e=>Pt[e])}function Ht(t,e,n){n===void 0&&(n=!1);let o=it(t),s=rt(t),r=st(s),l=s==="x"?o===(n?"end":"start")?"right":"left":o==="start"?"bottom":"top";return e.reference[r]>e.floating[r]&&(l=_(l)),{main:l,cross:_(l)}}var Mt={start:"end",end:"start"};function ot(t){return t.replace(/start|end/g,e=>Mt[e])}var Dt=["top","right","bottom","left"],It=Dt.reduce((t,e)=>t.concat(e,e+"-start",e+"-end"),[]);var j=function(t){return t===void 0&&(t={}),{name:"flip",options:t,async fn(e){var n;let{placement:o,middlewareData:s,rects:r,initialPlacement:l,platform:i,elements:a}=e,{mainAxis:f=!0,crossAxis:h=!0,fallbackPlacements:c,fallbackStrategy:d="bestFit",flipAlignment:m=!0,...u}=t,p=F(o),k=c||(p===l||!m?[_(l)]:function(x){let T=_(x);return[ot(x),T,ot(T)]}(l)),w=[l,...k],O=await at(e,u),C=[],g=((n=s.flip)==null?void 0:n.overflows)||[];if(f&&C.push(O[p]),h){let{main:x,cross:T}=Ht(o,r,await(i.isRTL==null?void 0:i.isRTL(a.floating)));C.push(O[x],O[T])}if(g=[...g,{placement:o,overflows:C}],!C.every(x=>x<=0)){var Y,J;let x=((Y=(J=s.flip)==null?void 0:J.index)!=null?Y:0)+1,T=w[x];if(T)return{data:{index:x,overflows:g},reset:{placement:T}};let N="bottom";switch(d){case"bestFit":{var Q;let Z=(Q=g.map(W=>[W,W.overflows.filter(M=>M>0).reduce((M,Tt)=>M+Tt,0)]).sort((W,M)=>W[1]-M[1])[0])==null?void 0:Q[0].placement;Z&&(N=Z);break}case"initialPlacement":N=l}if(o!==N)return{reset:{placement:N}}}return{}}}};function pt(t){return t&&t.document&&t.location&&t.alert&&t.setInterval}function A(t){if(t==null)return window;if(!pt(t)){let e=t.ownerDocument;return e&&e.defaultView||window}return t}function v(t){return A(t).getComputedStyle(t)}function b(t){return pt(t)?"":t?(t.nodeName||"").toLowerCase():""}function mt(){let t=navigator.userAgentData;return t!=null&&t.brands?t.brands.map(e=>e.brand+"/"+e.version).join(" "):navigator.userAgent}function y(t){return t instanceof A(t).HTMLElement}function L(t){return t instanceof A(t).Element}function H(t){return typeof ShadowRoot>"u"?!1:t instanceof A(t).ShadowRoot||t instanceof ShadowRoot}function z(t){let{overflow:e,overflowX:n,overflowY:o}=v(t);return/auto|scroll|overlay|hidden/.test(e+o+n)}function St(t){return["table","td","th"].includes(b(t))}function ct(t){let e=/firefox/i.test(mt()),n=v(t);return n.transform!=="none"||n.perspective!=="none"||n.contain==="paint"||["transform","perspective"].includes(n.willChange)||e&&n.willChange==="filter"||e&&!!n.filter&&n.filter!=="none"}function gt(){return!/^((?!chrome|android).)*safari/i.test(mt())}var ft=Math.min,S=Math.max,K=Math.round;function E(t,e,n){var o,s,r,l;e===void 0&&(e=!1),n===void 0&&(n=!1);let i=t.getBoundingClientRect(),a=1,f=1;e&&y(t)&&(a=t.offsetWidth>0&&K(i.width)/t.offsetWidth||1,f=t.offsetHeight>0&&K(i.height)/t.offsetHeight||1);let h=L(t)?A(t):window,c=!gt()&&n,d=(i.left+(c&&(o=(s=h.visualViewport)==null?void 0:s.offsetLeft)!=null?o:0))/a,m=(i.top+(c&&(r=(l=h.visualViewport)==null?void 0:l.offsetTop)!=null?r:0))/f,u=i.width/a,p=i.height/f;return{width:u,height:p,top:m,right:d+u,bottom:m+p,left:d,x:d,y:m}}function R(t){return(e=t,(e instanceof A(e).Node?t.ownerDocument:t.document)||window.document).documentElement;var e}function U(t){return L(t)?{scrollLeft:t.scrollLeft,scrollTop:t.scrollTop}:{scrollLeft:t.pageXOffset,scrollTop:t.pageYOffset}}function vt(t){return E(R(t)).left+U(t).scrollLeft}function Nt(t,e,n){let o=y(e),s=R(e),r=E(t,o&&function(a){let f=E(a);return K(f.width)!==a.offsetWidth||K(f.height)!==a.offsetHeight}(e),n==="fixed"),l={scrollLeft:0,scrollTop:0},i={x:0,y:0};if(o||!o&&n!=="fixed")if((b(e)!=="body"||z(s))&&(l=U(e)),y(e)){let a=E(e,!0);i.x=a.x+e.clientLeft,i.y=a.y+e.clientTop}else s&&(i.x=vt(s));return{x:r.left+l.scrollLeft-i.x,y:r.top+l.scrollTop-i.y,width:r.width,height:r.height}}function yt(t){return b(t)==="html"?t:t.assignedSlot||t.parentNode||(H(t)?t.host:null)||R(t)}function ht(t){return y(t)&&v(t).position!=="fixed"?function(e){let{offsetParent:n}=e,o=e,s=!1;for(;o&&o!==n;){let{assignedSlot:r}=o;if(r){let l=r.offsetParent;if(v(r).display==="contents"){let i=r.hasAttribute("style"),a=r.style.display;r.style.display=v(o).display,l=r.offsetParent,r.style.display=a,i||r.removeAttribute("style")}o=r,n!==l&&(n=l,s=!0)}else if(H(o)&&o.host&&s)break;o=H(o)&&o.host||o.parentNode}return n}(t):null}function G(t){let e=A(t),n=ht(t);for(;n&&St(n)&&v(n).position==="static";)n=ht(n);return n&&(b(n)==="html"||b(n)==="body"&&v(n).position==="static"&&!ct(n))?e:n||function(o){let s=yt(o);for(H(s)&&(s=s.host);y(s)&&!["html","body"].includes(b(s));){if(ct(s))return s;{let r=s.parentNode;s=H(r)?r.host:r}}return null}(t)||e}function ut(t){if(y(t))return{width:t.offsetWidth,height:t.offsetHeight};let e=E(t);return{width:e.width,height:e.height}}function wt(t){let e=yt(t);return["html","body","#document"].includes(b(e))?t.ownerDocument.body:y(e)&&z(e)?e:wt(e)}function B(t,e){var n;e===void 0&&(e=[]);let o=wt(t),s=o===((n=t.ownerDocument)==null?void 0:n.body),r=A(o),l=s?[r].concat(r.visualViewport||[],z(o)?o:[]):o,i=e.concat(l);return s?i:i.concat(B(l))}function dt(t,e,n){return e==="viewport"?D(function(o,s){let r=A(o),l=R(o),i=r.visualViewport,a=l.clientWidth,f=l.clientHeight,h=0,c=0;if(i){a=i.width,f=i.height;let d=gt();(d||!d&&s==="fixed")&&(h=i.offsetLeft,c=i.offsetTop)}return{width:a,height:f,x:h,y:c}}(t,n)):L(e)?function(o,s){let r=E(o,!1,s==="fixed"),l=r.top+o.clientTop,i=r.left+o.clientLeft;return{top:l,left:i,x:i,y:l,right:i+o.clientWidth,bottom:l+o.clientHeight,width:o.clientWidth,height:o.clientHeight}}(e,n):D(function(o){var s;let r=R(o),l=U(o),i=(s=o.ownerDocument)==null?void 0:s.body,a=S(r.scrollWidth,r.clientWidth,i?i.scrollWidth:0,i?i.clientWidth:0),f=S(r.scrollHeight,r.clientHeight,i?i.scrollHeight:0,i?i.clientHeight:0),h=-l.scrollLeft+vt(o),c=-l.scrollTop;return v(i||r).direction==="rtl"&&(h+=S(r.clientWidth,i?i.clientWidth:0)-a),{width:a,height:f,x:h,y:c}}(R(t)))}function Wt(t){let e=B(t),n=["absolute","fixed"].includes(v(t).position)&&y(t)?G(t):t;return L(n)?e.filter(o=>L(o)&&function(s,r){let l=r.getRootNode==null?void 0:r.getRootNode();if(s.contains(r))return!0;if(l&&H(l)){let i=r;do{if(i&&s===i)return!0;i=i.parentNode||i.host}while(i)}return!1}(o,n)&&b(o)!=="body"):[]}var _t={getClippingRect:function(t){let{element:e,boundary:n,rootBoundary:o,strategy:s}=t,r=[...n==="clippingAncestors"?Wt(e):[].concat(n),o],l=r[0],i=r.reduce((a,f)=>{let h=dt(e,f,s);return a.top=S(h.top,a.top),a.right=ft(h.right,a.right),a.bottom=ft(h.bottom,a.bottom),a.left=S(h.left,a.left),a},dt(e,l,s));return{width:i.right-i.left,height:i.bottom-i.top,x:i.left,y:i.top}},convertOffsetParentRelativeRectToViewportRelativeRect:function(t){let{rect:e,offsetParent:n,strategy:o}=t,s=y(n),r=R(n);if(n===r)return e;let l={scrollLeft:0,scrollTop:0},i={x:0,y:0};if((s||!s&&o!=="fixed")&&((b(n)!=="body"||z(r))&&(l=U(n)),y(n))){let a=E(n,!0);i.x=a.x+n.clientLeft,i.y=a.y+n.clientTop}return{...e,x:e.x-l.scrollLeft+i.x,y:e.y-l.scrollTop+i.y}},isElement:L,getDimensions:ut,getOffsetParent:G,getDocumentElement:R,getElementRects:t=>{let{reference:e,floating:n,strategy:o}=t;return{reference:Nt(e,G(n),o),floating:{...ut(n),x:0,y:0}}},getClientRects:t=>Array.from(t.getClientRects()),isRTL:t=>v(t).direction==="rtl"};function xt(t,e,n,o){o===void 0&&(o={});let{ancestorScroll:s=!0,ancestorResize:r=!0,elementResize:l=!0,animationFrame:i=!1}=o,a=s&&!i,f=r&&!i,h=a||f?[...L(t)?B(t):[],...B(e)]:[];h.forEach(u=>{a&&u.addEventListener("scroll",n,{passive:!0}),f&&u.addEventListener("resize",n)});let c,d=null;if(l){let u=!0;d=new ResizeObserver(()=>{u||n(),u=!1}),L(t)&&!i&&d.observe(t),d.observe(e)}let m=i?E(t):null;return i&&function u(){let p=E(t);!m||p.x===m.x&&p.y===m.y&&p.width===m.width&&p.height===m.height||n(),m=p,c=requestAnimationFrame(u)}(),n(),()=>{var u;h.forEach(p=>{a&&p.removeEventListener("scroll",n),f&&p.removeEventListener("resize",n)}),(u=d)==null||u.disconnect(),d=null,i&&cancelAnimationFrame(c)}}var bt=(t,e,n)=>lt(t,e,{platform:_t,...n});function Et(t){return t.altKey||t.shiftKey||t.ctrlKey||t.metaKey}var At=document.createElement("template");At.innerHTML=`<style>${et}</style>${tt}`;var q="eck-autocomplete",V=class extends P{p;m=!1;g=!0;t;r;s=0;o=!0;e;l;i=null;a=this.c.bind(this);v=this.f.bind(this);w=this.L.bind(this);b=this.T.bind(this);static get observedAttributes(){return["connected-to-id","highlight-first-option","select-highlighted-option"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.appendChild(At.content.cloneNode(!0)),this.r=this.shadowRoot.querySelector("slot")}attributeChangedCallback(e,n,o){e==="connected-to-id"?this.p=o:e==="highlight-first-option"?this.m=$(o):e==="select-highlighted-option"&&(this.g=$(o))}connectedCallback(){let e=document.querySelector(`#${this.p}`);e&&(this.t=e,this.E())}disconnectedCallback(){this.h(),this.t.removeEventListener("focus",this.a),this.t.removeEventListener("click",this.a),this.t.removeEventListener("input",this.b),this.t.removeEventListener("blur",this.v),this.t.removeEventListener("keydown",this.w)}setInputRef(e){this.t=e,this.E()}E(){this.r.addEventListener("slotchange",()=>{this.O()}),this.t.addEventListener("focus",this.a),this.t.addEventListener("click",this.a),this.t.addEventListener("input",this.b),this.t.addEventListener("blur",this.v),this.t.addEventListener("keydown",this.w)}c(){this.o&&(this.o=!1,this.C(),this.n(this.e,!1),this.e=void 0,this.A(),this.shadowRoot.host.style.display="block")}f(){this.shadowRoot.host.style.display="none",this.o=!0,this.h(),this.i=null}T(){this.i=this.t.value,this.c()}k(){let e=this.t.getBoundingClientRect().width;this.shadowRoot.host.style.width=`${e}px`,bt(this.t,this.shadowRoot.host,{middleware:[j()],strategy:"fixed"}).then(({x:n,y:o})=>{Object.assign(this.shadowRoot.host.style,{left:`${n}px`,top:`${o}px`})})}P(e){this.o||this.e===void 0||this.s===0||(e.preventDefault(),this.e?.fireSelectionEvent())}A(){if(!this.m)return;let e=this.r.assignedElements().filter(this.u);e[0]&&(this.n(e[0],!0,!0),this.e=e[0])}H(e){let n=this.r.assignedElements().filter(this.u);if(this.e===void 0){e==="ArrowUp"?(this.n(n[n.length-1],!0),this.e=n[n.length-1]):e==="ArrowDown"&&(this.n(n[0],!0),this.e=n[0]);return}for(let o=0;o<n.length;o++){let s=n[o];if(s.getAttribute("highlighted")===""){this.n(s,!1);let r=0;e==="ArrowUp"?o>0?r=o-1:r=n.length-1:e==="ArrowDown"&&(o<n.length-1?r=o+1:r=0),this.n(n[r],!0),this.e=n[r];break}}}n(e,n,o=!1){this.i===null&&n&&(this.i=this.t.value),e?.highlight(n,o),n&&e?.scrollIntoView({block:"nearest"})}C(){this.h(),this.k(),this.l=xt(this.t,this.shadowRoot.host,this.k.bind(this))}h(){this.l&&(this.l(),this.l=void 0)}L(e){Et(e)||(e.key==="Enter"?this.P(e):e.key==="Escape"?(e.preventDefault(),this.i!==null&&(this.t.value=this.i),this.f()):(e.key==="ArrowUp"||e.key==="ArrowDown")&&(e.preventDefault(),this.o?this.c():this.H(e.key)))}O(){this.s=0,this.r.assignedElements().filter(this.u).forEach(e=>{this.s++,this.n(e,!1),this.e=void 0,e.addEventListener("eck-autocomplete-option-selected",n=>{this.t.value=n.detail.label,this.f()}),e.addEventListener("eck-autocomplete-option-highlighted",n=>{!this.o&&this.g&&!n.detail.M&&(this.t.value=n.detail.label)})}),this.A(),this.shadowRoot.host.toggleAttribute("has-children",this.s!==0)}u(e){return e.identity==="eck-aco"}};var kt="<slot></slot>";var Rt=` | ||
:host{display:block;box-sizing:border-box;padding:var(--eck-aco-padding, 5px);color:var(--eck-aco-color, black)}:host(:hover),:host([highlighted]){background-color:var(--eck-aco-background-color, #b3e5fc);cursor:pointer}`;var Lt=document.createElement("template");Lt.innerHTML=`<style>${Rt}</style>${kt}`;var X="eck-autocomplete-option",I=class extends P{identity="eck-aco";value;d;static get observedAttributes(){return["label"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.appendChild(Lt.content.cloneNode(!0))}attributeChangedCallback(e,n,o){e==="label"&&(this.d=o||void 0)}connectedCallback(){this.shadowRoot.host.addEventListener("mousedown",e=>{e.preventDefault()}),this.shadowRoot.host.addEventListener("click",()=>{this.fireSelectionEvent()})}highlight(e,n){this.shadowRoot.host.toggleAttribute("highlighted",e),e&&this.shadowRoot.dispatchEvent(new CustomEvent("eck-autocomplete-option-highlighted",{composed:!0,detail:{value:this.value,label:this.R(),M:n}}))}fireSelectionEvent(){this.shadowRoot.dispatchEvent(new CustomEvent("eck-autocomplete-option-selected",{composed:!0,bubbles:!0,detail:{value:this.value,label:this.R()}}))}R(){return this.d!==void 0?this.d:this.shadowRoot.host.innerHTML}};customElements.get(X)===void 0&&customElements.define(X,I);customElements.get(q)===void 0&&customElements.define(q,V); | ||
//# sourceMappingURL=eck-autocomplete.js.map |
{ | ||
"name": "eck-autocomplete", | ||
"version": "0.1.3", | ||
"version": "1.0.0", | ||
"description": "Autocomplete web component. Suggests options for an input.", | ||
@@ -13,3 +13,3 @@ "author": "Leon Eck", | ||
"dependencies": { | ||
"@floating-ui/dom": "0.5.2" | ||
"@floating-ui/dom": "1.0.1" | ||
}, | ||
@@ -16,0 +16,0 @@ "type": "module", |
@@ -20,3 +20,3 @@ <h1 align="center"> | ||
type="module" | ||
src="https://unpkg.com/eck-autocomplete@0.1.3/min/eck-autocomplete.js" | ||
src="https://unpkg.com/eck-autocomplete@1.0.0/min/eck-autocomplete.js" | ||
></script> | ||
@@ -82,3 +82,9 @@ ``` | ||
**TBD** | ||
| Name | Description | Default | | ||
| --------------------------- | ---------------------------------------------- | ------- | | ||
| `--eck-ac-max-height` | max-height of the overlay panel. | `256px` | | ||
| `--eck-ac-background-color` | background-color of the overlay panel. | `#fff` | | ||
| `--eck-ac-border-size` | size of the border around the overlay panel. | `1px` | | ||
| `--eck-ac-border-color` | color of the border around the overlay panel. | `black` | | ||
| `--eck-ac-border-radius` | radius of the border around the overlay panel. | `0` | | ||
@@ -107,3 +113,7 @@ ### `eck-autocomplete-option` | ||
**TBD** | ||
| Name | Description | Default | | ||
| ---------------------------- | ------------------------------------------------- | --------- | | ||
| `--eck-aco-padding` | padding of the option element. | `5px` | | ||
| `--eck-aco-color` | color of the option element. | `black` | | ||
| `--eck-aco-background-color` | background-color of a highlighted option element. | `#b3e5fc` | | ||
@@ -110,0 +120,0 @@ #### Events |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
No v1
QualityPackage is not semver >=1. This means it is not stable and does not support ^ ranges.
Found 1 instance in 1 package
249100
1003
0
140
+ Added@floating-ui/core@1.6.9(transitive)
+ Added@floating-ui/dom@1.0.1(transitive)
+ Added@floating-ui/utils@0.2.9(transitive)
- Removed@floating-ui/core@0.7.3(transitive)
- Removed@floating-ui/dom@0.5.2(transitive)
Updated@floating-ui/dom@1.0.1