@aurodesignsystem-dev/auro-popover 0.0.0-pr125.2 → 0.0.0-pr125.3

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.
package/demo/api.md CHANGED
@@ -13,7 +13,7 @@ The `auro-popover` element attaches to another element and displays on hover.
13
13
  | boundary | boundary | | string \| object | | The element to use as the boundary for the popover. Can be a query selector or an HTML element. |
14
14
  | disabled | disabled | | boolean | | Disables the popover from showing on hover and focus. |
15
15
  | for | for | | string | | Directly associates the popover with a trigger element with the given ID. In most cases, this should not be necessary and set `slot="trigger"` on the element instead. |
16
- | placement | placement | | string | `top` | Position for popover in relation to the element. |
16
+ | placement | placement | | string | `top` | Position for popover in relation to the element {'top' \| 'bottom'}. |
17
17
  | removeSpace | removeSpace | | boolean | | Removes top and bottom space around the appearance of the popover in relation to the trigger. |
18
18
 
19
19
  ### Methods
@@ -2012,49 +2012,49 @@ class AuroPopover extends i {
2012
2012
  // function to define props used within the scope of this component
2013
2013
  static get properties() {
2014
2014
  return {
2015
- /**
2015
+ /**
2016
2016
  * Adds additional top and bottom space around the appearance of the popover in relation to the trigger.
2017
2017
  */
2018
- addSpace: {
2019
- type: Boolean,
2020
- reflect: true
2018
+ addSpace: {
2019
+ type: Boolean,
2020
+ reflect: true
2021
2021
  },
2022
2022
 
2023
- /**
2023
+ /**
2024
2024
  * The element to use as the boundary for the popover. Can be a query selector or an HTML element.
2025
2025
  * @type {string | object}
2026
2026
  */
2027
2027
  boundary: { type: String },
2028
2028
 
2029
- /**
2029
+ /**
2030
2030
  * Disables the popover from showing on hover and focus.
2031
2031
  */
2032
- disabled: {
2032
+ disabled: {
2033
2033
  type: Boolean,
2034
2034
  reflect: true
2035
2035
  },
2036
2036
 
2037
- /**
2037
+ /**
2038
2038
  * Directly associates the popover with a trigger element with the given ID. In most cases, this should not be necessary and set `slot="trigger"` on the element instead.
2039
2039
  */
2040
- for: {
2040
+ for: {
2041
2041
  type: String,
2042
2042
  reflect: true
2043
2043
  },
2044
2044
 
2045
2045
  /**
2046
- * Position for popover in relation to the element.
2046
+ * Position for popover in relation to the element {'top' | 'bottom'}.
2047
2047
  * @type {'top' | 'bottom'}
2048
2048
  * @default 'top'
2049
2049
  */
2050
2050
  placement: { type: String},
2051
2051
 
2052
- /**
2052
+ /**
2053
2053
  * Removes top and bottom space around the appearance of the popover in relation to the trigger.
2054
2054
  */
2055
- removeSpace: {
2056
- type: Boolean,
2057
- reflect: true
2055
+ removeSpace: {
2056
+ type: Boolean,
2057
+ reflect: true
2058
2058
  },
2059
2059
  };
2060
2060
  }
@@ -2090,8 +2090,10 @@ class AuroPopover extends i {
2090
2090
  }
2091
2091
 
2092
2092
  disconnectedCallback() {
2093
- super.disconnectedCallback();
2093
+ // NOTE: Teardown is one-way. This component does not currently support
2094
+ // reinitialization after being removed from the DOM.
2094
2095
 
2096
+ super.disconnectedCallback();
2095
2097
  this.removeEventListener("touchstart", this._onTouchStart);
2096
2098
 
2097
2099
  if (this.trigger) {
@@ -2114,11 +2116,11 @@ class AuroPopover extends i {
2114
2116
 
2115
2117
  // Clean up aria-description set on the trigger in firstUpdated.
2116
2118
  // Prevents a stale description persisting if the trigger element is reused.
2117
- this.trigger.removeAttribute('aria-description');
2119
+ this.trigger.removeAttribute("aria-description");
2118
2120
 
2119
2121
  // Remove tabindex only if the component added it — don't remove what the author set.
2120
2122
  if (this._addedTabIndex) {
2121
- this.trigger.removeAttribute('tabindex');
2123
+ this.trigger.removeAttribute("tabindex");
2122
2124
  }
2123
2125
  }
2124
2126
 
@@ -2139,6 +2141,13 @@ class AuroPopover extends i {
2139
2141
  }
2140
2142
 
2141
2143
  firstUpdated() {
2144
+ /**
2145
+ * NOTE: This component is not currently designed for reinitialization.
2146
+ * All setup in firstUpdated() is assumed to run once per instance lifecycle.
2147
+ * If the element is removed and later reattached, event bindings,
2148
+ * Popper setup, and accessibility wiring will NOT be restored automatically.
2149
+ */
2150
+
2142
2151
  // Add the tag name as an attribute if it is different than the component name
2143
2152
  this.runtimeUtils.handleComponentTagRename(this, "auro-popover");
2144
2153
 
@@ -2240,6 +2249,7 @@ class AuroPopover extends i {
2240
2249
  }
2241
2250
 
2242
2251
  if (key === " " || key === "enter") {
2252
+ event.preventDefault();
2243
2253
  this.toggle();
2244
2254
  }
2245
2255
  };
@@ -1,7 +1,7 @@
1
1
  import{css as e,LitElement as t,html as i}from"lit";class s{registerComponent(e,t){customElements.get(e)||customElements.define(e,class extends t{})}closestElement(e,t=this,i=(t,s=t&&t.closest(e))=>t&&t!==document&&t!==window?s||i(t.getRootNode().host):null){return i(t)}handleComponentTagRename(e,t){const i=t.toLowerCase();e.tagName.toLowerCase()!==i&&e.setAttribute(i,!0)}elementMatch(e,t){const i=t.toLowerCase();return e.tagName.toLowerCase()===i||e.hasAttribute(i)}getSlotText(e,t){const i=e.shadowRoot?.querySelector(`slot[name="${t}"]`);return(i?.assignedNodes({flatten:!0})||[]).map(e=>e.textContent?.trim()).join(" ").trim()||null}}var r="top",o="bottom",n="right",a="left",l="auto",c=[r,o,n,a],p="start",d="end",f="viewport",m="popper",h=c.reduce(function(e,t){return e.concat([t+"-"+p,t+"-"+d])},[]),u=[].concat(c,[l]).reduce(function(e,t){return e.concat([t,t+"-"+p,t+"-"+d])},[]),g=["beforeRead","read","afterRead","beforeMain","main","afterMain","beforeWrite","write","afterWrite"];function v(e){return e?(e.nodeName||"").toLowerCase():null}function y(e){if(null==e)return window;if("[object Window]"!==e.toString()){var t=e.ownerDocument;return t&&t.defaultView||window}return e}function w(e){return e instanceof y(e).Element||e instanceof Element}function b(e){return e instanceof y(e).HTMLElement||e instanceof HTMLElement}function x(e){return"undefined"!=typeof ShadowRoot&&(e instanceof y(e).ShadowRoot||e instanceof ShadowRoot)}var S={name:"applyStyles",enabled:!0,phase:"write",fn:function(e){var t=e.state;Object.keys(t.elements).forEach(function(e){var i=t.styles[e]||{},s=t.attributes[e]||{},r=t.elements[e];b(r)&&v(r)&&(Object.assign(r.style,i),Object.keys(s).forEach(function(e){var t=s[e];!1===t?r.removeAttribute(e):r.setAttribute(e,!0===t?"":t)}))})},effect:function(e){var t=e.state,i={popper:{position:t.options.strategy,left:"0",top:"0",margin:"0"},arrow:{position:"absolute"},reference:{}};return Object.assign(t.elements.popper.style,i.popper),t.styles=i,t.elements.arrow&&Object.assign(t.elements.arrow.style,i.arrow),function(){Object.keys(t.elements).forEach(function(e){var s=t.elements[e],r=t.attributes[e]||{},o=Object.keys(t.styles.hasOwnProperty(e)?t.styles[e]:i[e]).reduce(function(e,t){return e[t]="",e},{});b(s)&&v(s)&&(Object.assign(s.style,o),Object.keys(r).forEach(function(e){s.removeAttribute(e)}))})}},requires:["computeStyles"]};function O(e){return e.split("-")[0]}var _=Math.max,k=Math.min,A=Math.round;function z(){var e=navigator.userAgentData;return null!=e&&e.brands&&Array.isArray(e.brands)?e.brands.map(function(e){return e.brand+"/"+e.version}).join(" "):navigator.userAgent}function E(){return!/^((?!chrome|android).)*safari/i.test(z())}function M(e,t,i){void 0===t&&(t=!1),void 0===i&&(i=!1);var s=e.getBoundingClientRect(),r=1,o=1;t&&b(e)&&(r=e.offsetWidth>0&&A(s.width)/e.offsetWidth||1,o=e.offsetHeight>0&&A(s.height)/e.offsetHeight||1);var n=(w(e)?y(e):window).visualViewport,a=!E()&&i,l=(s.left+(a&&n?n.offsetLeft:0))/r,c=(s.top+(a&&n?n.offsetTop:0))/o,p=s.width/r,d=s.height/o;return{width:p,height:d,top:c,right:l+p,bottom:c+d,left:l,x:l,y:c}}function T(e){var t=M(e),i=e.offsetWidth,s=e.offsetHeight;return Math.abs(t.width-i)<=1&&(i=t.width),Math.abs(t.height-s)<=1&&(s=t.height),{x:e.offsetLeft,y:e.offsetTop,width:i,height:s}}function B(e,t){var i=t.getRootNode&&t.getRootNode();if(e.contains(t))return!0;if(i&&x(i)){var s=t;do{if(s&&e.isSameNode(s))return!0;s=s.parentNode||s.host}while(s)}return!1}function L(e){return y(e).getComputedStyle(e)}function H(e){return["table","td","th"].indexOf(v(e))>=0}function R(e){return((w(e)?e.ownerDocument:e.document)||window.document).documentElement}function C(e){return"html"===v(e)?e:e.assignedSlot||e.parentNode||(x(e)?e.host:null)||R(e)}function j(e){return b(e)&&"fixed"!==L(e).position?e.offsetParent:null}function N(e){for(var t=y(e),i=j(e);i&&H(i)&&"static"===L(i).position;)i=j(i);return i&&("html"===v(i)||"body"===v(i)&&"static"===L(i).position)?t:i||function(e){var t=/firefox/i.test(z());if(/Trident/i.test(z())&&b(e)&&"fixed"===L(e).position)return null;var i=C(e);for(x(i)&&(i=i.host);b(i)&&["html","body"].indexOf(v(i))<0;){var s=L(i);if("none"!==s.transform||"none"!==s.perspective||"paint"===s.contain||-1!==["transform","perspective"].indexOf(s.willChange)||t&&"filter"===s.willChange||t&&s.filter&&"none"!==s.filter)return i;i=i.parentNode}return null}(e)||t}function P(e){return["top","bottom"].indexOf(e)>=0?"x":"y"}function D(e,t,i){return _(e,k(t,i))}function I(e){return Object.assign({},{top:0,right:0,bottom:0,left:0},e)}function F(e,t){return t.reduce(function(t,i){return t[i]=e,t},{})}var U={name:"arrow",enabled:!0,phase:"main",fn:function(e){var t,i=e.state,s=e.name,l=e.options,p=i.elements.arrow,d=i.modifiersData.popperOffsets,f=O(i.placement),m=P(f),h=[a,n].indexOf(f)>=0?"height":"width";if(p&&d){var u=function(e,t){return I("number"!=typeof(e="function"==typeof e?e(Object.assign({},t.rects,{placement:t.placement})):e)?e:F(e,c))}(l.padding,i),g=T(p),v="y"===m?r:a,y="y"===m?o:n,w=i.rects.reference[h]+i.rects.reference[m]-d[m]-i.rects.popper[h],b=d[m]-i.rects.reference[m],x=N(p),S=x?"y"===m?x.clientHeight||0:x.clientWidth||0:0,_=w/2-b/2,k=u[v],A=S-g[h]-u[y],z=S/2-g[h]/2+_,E=D(k,z,A),M=m;i.modifiersData[s]=((t={})[M]=E,t.centerOffset=E-z,t)}},effect:function(e){var t=e.state,i=e.options.element,s=void 0===i?"[data-popper-arrow]":i;null!=s&&("string"!=typeof s||(s=t.elements.popper.querySelector(s)))&&B(t.elements.popper,s)&&(t.elements.arrow=s)},requires:["popperOffsets"],requiresIfExists:["preventOverflow"]};function q(e){return e.split("-")[1]}var W={top:"auto",right:"auto",bottom:"auto",left:"auto"};function X(e){var t,i=e.popper,s=e.popperRect,l=e.placement,c=e.variation,p=e.offsets,f=e.position,m=e.gpuAcceleration,h=e.adaptive,u=e.roundOffsets,g=e.isFixed,v=p.x,w=void 0===v?0:v,b=p.y,x=void 0===b?0:b,S="function"==typeof u?u({x:w,y:x}):{x:w,y:x};w=S.x,x=S.y;var O=p.hasOwnProperty("x"),_=p.hasOwnProperty("y"),k=a,z=r,E=window;if(h){var M=N(i),T="clientHeight",B="clientWidth";if(M===y(i)&&"static"!==L(M=R(i)).position&&"absolute"===f&&(T="scrollHeight",B="scrollWidth"),l===r||(l===a||l===n)&&c===d)z=o,x-=(g&&M===E&&E.visualViewport?E.visualViewport.height:M[T])-s.height,x*=m?1:-1;if(l===a||(l===r||l===o)&&c===d)k=n,w-=(g&&M===E&&E.visualViewport?E.visualViewport.width:M[B])-s.width,w*=m?1:-1}var H,C=Object.assign({position:f},h&&W),j=!0===u?function(e,t){var i=e.x,s=e.y,r=t.devicePixelRatio||1;return{x:A(i*r)/r||0,y:A(s*r)/r||0}}({x:w,y:x},y(i)):{x:w,y:x};return w=j.x,x=j.y,m?Object.assign({},C,((H={})[z]=_?"0":"",H[k]=O?"0":"",H.transform=(E.devicePixelRatio||1)<=1?"translate("+w+"px, "+x+"px)":"translate3d("+w+"px, "+x+"px, 0)",H)):Object.assign({},C,((t={})[z]=_?x+"px":"",t[k]=O?w+"px":"",t.transform="",t))}var V={passive:!0};var G={left:"right",right:"left",bottom:"top",top:"bottom"};function $(e){return e.replace(/left|right|bottom|top/g,function(e){return G[e]})}var K={start:"end",end:"start"};function Y(e){return e.replace(/start|end/g,function(e){return K[e]})}function J(e){var t=y(e);return{scrollLeft:t.pageXOffset,scrollTop:t.pageYOffset}}function Q(e){return M(R(e)).left+J(e).scrollLeft}function Z(e){var t=L(e),i=t.overflow,s=t.overflowX,r=t.overflowY;return/auto|scroll|overlay|hidden/.test(i+r+s)}function ee(e){return["html","body","#document"].indexOf(v(e))>=0?e.ownerDocument.body:b(e)&&Z(e)?e:ee(C(e))}function te(e,t){var i;void 0===t&&(t=[]);var s=ee(e),r=s===(null==(i=e.ownerDocument)?void 0:i.body),o=y(s),n=r?[o].concat(o.visualViewport||[],Z(s)?s:[]):s,a=t.concat(n);return r?a:a.concat(te(C(n)))}function ie(e){return Object.assign({},e,{left:e.x,top:e.y,right:e.x+e.width,bottom:e.y+e.height})}function se(e,t,i){return t===f?ie(function(e,t){var i=y(e),s=R(e),r=i.visualViewport,o=s.clientWidth,n=s.clientHeight,a=0,l=0;if(r){o=r.width,n=r.height;var c=E();(c||!c&&"fixed"===t)&&(a=r.offsetLeft,l=r.offsetTop)}return{width:o,height:n,x:a+Q(e),y:l}}(e,i)):w(t)?function(e,t){var i=M(e,!1,"fixed"===t);return i.top=i.top+e.clientTop,i.left=i.left+e.clientLeft,i.bottom=i.top+e.clientHeight,i.right=i.left+e.clientWidth,i.width=e.clientWidth,i.height=e.clientHeight,i.x=i.left,i.y=i.top,i}(t,i):ie(function(e){var t,i=R(e),s=J(e),r=null==(t=e.ownerDocument)?void 0:t.body,o=_(i.scrollWidth,i.clientWidth,r?r.scrollWidth:0,r?r.clientWidth:0),n=_(i.scrollHeight,i.clientHeight,r?r.scrollHeight:0,r?r.clientHeight:0),a=-s.scrollLeft+Q(e),l=-s.scrollTop;return"rtl"===L(r||i).direction&&(a+=_(i.clientWidth,r?r.clientWidth:0)-o),{width:o,height:n,x:a,y:l}}(R(e)))}function re(e,t,i,s){var r="clippingParents"===t?function(e){var t=te(C(e)),i=["absolute","fixed"].indexOf(L(e).position)>=0&&b(e)?N(e):e;return w(i)?t.filter(function(e){return w(e)&&B(e,i)&&"body"!==v(e)}):[]}(e):[].concat(t),o=[].concat(r,[i]),n=o[0],a=o.reduce(function(t,i){var r=se(e,i,s);return t.top=_(r.top,t.top),t.right=k(r.right,t.right),t.bottom=k(r.bottom,t.bottom),t.left=_(r.left,t.left),t},se(e,n,s));return a.width=a.right-a.left,a.height=a.bottom-a.top,a.x=a.left,a.y=a.top,a}function oe(e){var t,i=e.reference,s=e.element,l=e.placement,c=l?O(l):null,f=l?q(l):null,m=i.x+i.width/2-s.width/2,h=i.y+i.height/2-s.height/2;switch(c){case r:t={x:m,y:i.y-s.height};break;case o:t={x:m,y:i.y+i.height};break;case n:t={x:i.x+i.width,y:h};break;case a:t={x:i.x-s.width,y:h};break;default:t={x:i.x,y:i.y}}var u=c?P(c):null;if(null!=u){var g="y"===u?"height":"width";switch(f){case p:t[u]=t[u]-(i[g]/2-s[g]/2);break;case d:t[u]=t[u]+(i[g]/2-s[g]/2)}}return t}function ne(e,t){void 0===t&&(t={});var i=t,s=i.placement,a=void 0===s?e.placement:s,l=i.strategy,p=void 0===l?e.strategy:l,d=i.boundary,h=void 0===d?"clippingParents":d,u=i.rootBoundary,g=void 0===u?f:u,v=i.elementContext,y=void 0===v?m:v,b=i.altBoundary,x=void 0!==b&&b,S=i.padding,O=void 0===S?0:S,_=I("number"!=typeof O?O:F(O,c)),k=y===m?"reference":m,A=e.rects.popper,z=e.elements[x?k:y],E=re(w(z)?z:z.contextElement||R(e.elements.popper),h,g,p),T=M(e.elements.reference),B=oe({reference:T,element:A,placement:a}),L=ie(Object.assign({},A,B)),H=y===m?L:T,C={top:E.top-H.top+_.top,bottom:H.bottom-E.bottom+_.bottom,left:E.left-H.left+_.left,right:H.right-E.right+_.right},j=e.modifiersData.offset;if(y===m&&j){var N=j[a];Object.keys(C).forEach(function(e){var t=[n,o].indexOf(e)>=0?1:-1,i=[r,o].indexOf(e)>=0?"y":"x";C[e]+=N[i]*t})}return C}function ae(e,t){void 0===t&&(t={});var i=t,s=i.placement,r=i.boundary,o=i.rootBoundary,n=i.padding,a=i.flipVariations,l=i.allowedAutoPlacements,p=void 0===l?u:l,d=q(s),f=d?a?h:h.filter(function(e){return q(e)===d}):c,m=f.filter(function(e){return p.indexOf(e)>=0});0===m.length&&(m=f);var g=m.reduce(function(t,i){return t[i]=ne(e,{placement:i,boundary:r,rootBoundary:o,padding:n})[O(i)],t},{});return Object.keys(g).sort(function(e,t){return g[e]-g[t]})}var le={name:"flip",enabled:!0,phase:"main",fn:function(e){var t=e.state,i=e.options,s=e.name;if(!t.modifiersData[s]._skip){for(var c=i.mainAxis,d=void 0===c||c,f=i.altAxis,m=void 0===f||f,h=i.fallbackPlacements,u=i.padding,g=i.boundary,v=i.rootBoundary,y=i.altBoundary,w=i.flipVariations,b=void 0===w||w,x=i.allowedAutoPlacements,S=t.options.placement,_=O(S),k=h||(_===S||!b?[$(S)]:function(e){if(O(e)===l)return[];var t=$(e);return[Y(e),t,Y(t)]}(S)),A=[S].concat(k).reduce(function(e,i){return e.concat(O(i)===l?ae(t,{placement:i,boundary:g,rootBoundary:v,padding:u,flipVariations:b,allowedAutoPlacements:x}):i)},[]),z=t.rects.reference,E=t.rects.popper,M=new Map,T=!0,B=A[0],L=0;L<A.length;L++){var H=A[L],R=O(H),C=q(H)===p,j=[r,o].indexOf(R)>=0,N=j?"width":"height",P=ne(t,{placement:H,boundary:g,rootBoundary:v,altBoundary:y,padding:u}),D=j?C?n:a:C?o:r;z[N]>E[N]&&(D=$(D));var I=$(D),F=[];if(d&&F.push(P[R]<=0),m&&F.push(P[D]<=0,P[I]<=0),F.every(function(e){return e})){B=H,T=!1;break}M.set(H,F)}if(T)for(var U=function(e){var t=A.find(function(t){var i=M.get(t);if(i)return i.slice(0,e).every(function(e){return e})});if(t)return B=t,"break"},W=b?3:1;W>0;W--){if("break"===U(W))break}t.placement!==B&&(t.modifiersData[s]._skip=!0,t.placement=B,t.reset=!0)}},requiresIfExists:["offset"],data:{_skip:!1}};function ce(e,t,i){return void 0===i&&(i={x:0,y:0}),{top:e.top-t.height-i.y,right:e.right-t.width+i.x,bottom:e.bottom-t.height+i.y,left:e.left-t.width-i.x}}function pe(e){return[r,n,o,a].some(function(t){return e[t]>=0})}var de={name:"offset",enabled:!0,phase:"main",requires:["popperOffsets"],fn:function(e){var t=e.state,i=e.options,s=e.name,o=i.offset,l=void 0===o?[0,0]:o,c=u.reduce(function(e,i){return e[i]=function(e,t,i){var s=O(e),o=[a,r].indexOf(s)>=0?-1:1,l="function"==typeof i?i(Object.assign({},t,{placement:e})):i,c=l[0],p=l[1];return c=c||0,p=(p||0)*o,[a,n].indexOf(s)>=0?{x:p,y:c}:{x:c,y:p}}(i,t.rects,l),e},{}),p=c[t.placement],d=p.x,f=p.y;null!=t.modifiersData.popperOffsets&&(t.modifiersData.popperOffsets.x+=d,t.modifiersData.popperOffsets.y+=f),t.modifiersData[s]=c}};var fe={name:"preventOverflow",enabled:!0,phase:"main",fn:function(e){var t=e.state,i=e.options,s=e.name,l=i.mainAxis,c=void 0===l||l,d=i.altAxis,f=void 0!==d&&d,m=i.boundary,h=i.rootBoundary,u=i.altBoundary,g=i.padding,v=i.tether,y=void 0===v||v,w=i.tetherOffset,b=void 0===w?0:w,x=ne(t,{boundary:m,rootBoundary:h,padding:g,altBoundary:u}),S=O(t.placement),A=q(t.placement),z=!A,E=P(S),M="x"===E?"y":"x",B=t.modifiersData.popperOffsets,L=t.rects.reference,H=t.rects.popper,R="function"==typeof b?b(Object.assign({},t.rects,{placement:t.placement})):b,C="number"==typeof R?{mainAxis:R,altAxis:R}:Object.assign({mainAxis:0,altAxis:0},R),j=t.modifiersData.offset?t.modifiersData.offset[t.placement]:null,I={x:0,y:0};if(B){if(c){var F,U="y"===E?r:a,W="y"===E?o:n,X="y"===E?"height":"width",V=B[E],G=V+x[U],$=V-x[W],K=y?-H[X]/2:0,Y=A===p?L[X]:H[X],J=A===p?-H[X]:-L[X],Q=t.elements.arrow,Z=y&&Q?T(Q):{width:0,height:0},ee=t.modifiersData["arrow#persistent"]?t.modifiersData["arrow#persistent"].padding:{top:0,right:0,bottom:0,left:0},te=ee[U],ie=ee[W],se=D(0,L[X],Z[X]),re=z?L[X]/2-K-se-te-C.mainAxis:Y-se-te-C.mainAxis,oe=z?-L[X]/2+K+se+ie+C.mainAxis:J+se+ie+C.mainAxis,ae=t.elements.arrow&&N(t.elements.arrow),le=ae?"y"===E?ae.clientTop||0:ae.clientLeft||0:0,ce=null!=(F=null==j?void 0:j[E])?F:0,pe=V+oe-ce,de=D(y?k(G,V+re-ce-le):G,V,y?_($,pe):$);B[E]=de,I[E]=de-V}if(f){var fe,me="x"===E?r:a,he="x"===E?o:n,ue=B[M],ge="y"===M?"height":"width",ve=ue+x[me],ye=ue-x[he],we=-1!==[r,a].indexOf(S),be=null!=(fe=null==j?void 0:j[M])?fe:0,xe=we?ve:ue-L[ge]-H[ge]-be+C.altAxis,Se=we?ue+L[ge]+H[ge]-be-C.altAxis:ye,Oe=y&&we?function(e,t,i){var s=D(e,t,i);return s>i?i:s}(xe,ue,Se):D(y?xe:ve,ue,y?Se:ye);B[M]=Oe,I[M]=Oe-ue}t.modifiersData[s]=I}},requiresIfExists:["offset"]};function me(e,t,i){void 0===i&&(i=!1);var s,r,o=b(t),n=b(t)&&function(e){var t=e.getBoundingClientRect(),i=A(t.width)/e.offsetWidth||1,s=A(t.height)/e.offsetHeight||1;return 1!==i||1!==s}(t),a=R(t),l=M(e,n,i),c={scrollLeft:0,scrollTop:0},p={x:0,y:0};return(o||!o&&!i)&&(("body"!==v(t)||Z(a))&&(c=(s=t)!==y(s)&&b(s)?{scrollLeft:(r=s).scrollLeft,scrollTop:r.scrollTop}:J(s)),b(t)?((p=M(t,!0)).x+=t.clientLeft,p.y+=t.clientTop):a&&(p.x=Q(a))),{x:l.left+c.scrollLeft-p.x,y:l.top+c.scrollTop-p.y,width:l.width,height:l.height}}function he(e){var t=new Map,i=new Set,s=[];function r(e){i.add(e.name),[].concat(e.requires||[],e.requiresIfExists||[]).forEach(function(e){if(!i.has(e)){var s=t.get(e);s&&r(s)}}),s.push(e)}return e.forEach(function(e){t.set(e.name,e)}),e.forEach(function(e){i.has(e.name)||r(e)}),s}var ue={placement:"bottom",modifiers:[],strategy:"absolute"};function ge(){for(var e=arguments.length,t=new Array(e),i=0;i<e;i++)t[i]=arguments[i];return!t.some(function(e){return!(e&&"function"==typeof e.getBoundingClientRect)})}function ve(e){void 0===e&&(e={});var t=e,i=t.defaultModifiers,s=void 0===i?[]:i,r=t.defaultOptions,o=void 0===r?ue:r;return function(e,t,i){void 0===i&&(i=o);var r,n,a={placement:"bottom",orderedModifiers:[],options:Object.assign({},ue,o),modifiersData:{},elements:{reference:e,popper:t},attributes:{},styles:{}},l=[],c=!1,p={state:a,setOptions:function(i){var r="function"==typeof i?i(a.options):i;d(),a.options=Object.assign({},o,a.options,r),a.scrollParents={reference:w(e)?te(e):e.contextElement?te(e.contextElement):[],popper:te(t)};var n,c,f=function(e){var t=he(e);return g.reduce(function(e,i){return e.concat(t.filter(function(e){return e.phase===i}))},[])}((n=[].concat(s,a.options.modifiers),c=n.reduce(function(e,t){var i=e[t.name];return e[t.name]=i?Object.assign({},i,t,{options:Object.assign({},i.options,t.options),data:Object.assign({},i.data,t.data)}):t,e},{}),Object.keys(c).map(function(e){return c[e]})));return a.orderedModifiers=f.filter(function(e){return e.enabled}),a.orderedModifiers.forEach(function(e){var t=e.name,i=e.options,s=void 0===i?{}:i,r=e.effect;if("function"==typeof r){var o=r({state:a,name:t,instance:p,options:s}),n=function(){};l.push(o||n)}}),p.update()},forceUpdate:function(){if(!c){var e=a.elements,t=e.reference,i=e.popper;if(ge(t,i)){a.rects={reference:me(t,N(i),"fixed"===a.options.strategy),popper:T(i)},a.reset=!1,a.placement=a.options.placement,a.orderedModifiers.forEach(function(e){return a.modifiersData[e.name]=Object.assign({},e.data)});for(var s=0;s<a.orderedModifiers.length;s++)if(!0!==a.reset){var r=a.orderedModifiers[s],o=r.fn,n=r.options,l=void 0===n?{}:n,d=r.name;"function"==typeof o&&(a=o({state:a,options:l,name:d,instance:p})||a)}else a.reset=!1,s=-1}}},update:(r=function(){return new Promise(function(e){p.forceUpdate(),e(a)})},function(){return n||(n=new Promise(function(e){Promise.resolve().then(function(){n=void 0,e(r())})})),n}),destroy:function(){d(),c=!0}};if(!ge(e,t))return p;function d(){l.forEach(function(e){return e()}),l=[]}return p.setOptions(i).then(function(e){!c&&i.onFirstUpdate&&i.onFirstUpdate(e)}),p}}var ye=ve({defaultModifiers:[{name:"eventListeners",enabled:!0,phase:"write",fn:function(){},effect:function(e){var t=e.state,i=e.instance,s=e.options,r=s.scroll,o=void 0===r||r,n=s.resize,a=void 0===n||n,l=y(t.elements.popper),c=[].concat(t.scrollParents.reference,t.scrollParents.popper);return o&&c.forEach(function(e){e.addEventListener("scroll",i.update,V)}),a&&l.addEventListener("resize",i.update,V),function(){o&&c.forEach(function(e){e.removeEventListener("scroll",i.update,V)}),a&&l.removeEventListener("resize",i.update,V)}},data:{}},{name:"popperOffsets",enabled:!0,phase:"read",fn:function(e){var t=e.state,i=e.name;t.modifiersData[i]=oe({reference:t.rects.reference,element:t.rects.popper,placement:t.placement})},data:{}},{name:"computeStyles",enabled:!0,phase:"beforeWrite",fn:function(e){var t=e.state,i=e.options,s=i.gpuAcceleration,r=void 0===s||s,o=i.adaptive,n=void 0===o||o,a=i.roundOffsets,l=void 0===a||a,c={placement:O(t.placement),variation:q(t.placement),popper:t.elements.popper,popperRect:t.rects.popper,gpuAcceleration:r,isFixed:"fixed"===t.options.strategy};null!=t.modifiersData.popperOffsets&&(t.styles.popper=Object.assign({},t.styles.popper,X(Object.assign({},c,{offsets:t.modifiersData.popperOffsets,position:t.options.strategy,adaptive:n,roundOffsets:l})))),null!=t.modifiersData.arrow&&(t.styles.arrow=Object.assign({},t.styles.arrow,X(Object.assign({},c,{offsets:t.modifiersData.arrow,position:"absolute",adaptive:!1,roundOffsets:l})))),t.attributes.popper=Object.assign({},t.attributes.popper,{"data-popper-placement":t.placement})},data:{}},S,de,le,fe,U,{name:"hide",enabled:!0,phase:"main",requiresIfExists:["preventOverflow"],fn:function(e){var t=e.state,i=e.name,s=t.rects.reference,r=t.rects.popper,o=t.modifiersData.preventOverflow,n=ne(t,{elementContext:"reference"}),a=ne(t,{altBoundary:!0}),l=ce(n,s),c=ce(a,r,o),p=pe(l),d=pe(c);t.modifiersData[i]={referenceClippingOffsets:l,popperEscapeOffsets:c,isReferenceHidden:p,hasPopperEscaped:d},t.attributes.popper=Object.assign({},t.attributes.popper,{"data-popper-reference-hidden":p,"data-popper-escaped":d})}}]});class we{constructor(e,t,i,s){this.anchor=e,this.popover=t,this.boundaryElement=this.setBoundary(s),this.options={placement:i,visibleClass:"data-show"},this.popover.classList.remove(this.options.visibleClass)}setBoundary(e){return"string"==typeof e?document.querySelector(e)||document.body:e||document.body}show(){this.popper&&this.popper.destroy(),this.popper=ye(this.anchor,this.popover,{tooltip:this.anchor,placement:this.options.placement,modifiers:[{name:"offset",options:{offset:[0,18]}},{name:"preventOverflow",options:{mainAxis:!0,boundary:this.boundaryElement,rootBoundary:"document",padding:16}}]})}triggerUpdate(){this.popper.update()}hide(){this.popover.classList.remove(this.options.visibleClass)}}var be=e`::slotted(*):not([onDark]),::slotted(*):not([appearance=inverse]){color:var(--ds-auro-popover-text-color)}.popover{background-color:var(--ds-auro-popover-container-color);box-shadow:var(--ds-auro-popover-boxshadow-color)}.arrow:before{background-color:var(--ds-auro-popover-container-color);box-shadow:2px 2px 1px 0 var(--ds-auro-popover-boxshadow-color)}
2
2
  `,xe=e`.body-default{font-size:var(--wcss-body-default-font-size, 1rem);line-height:var(--wcss-body-default-line-height, 1.5rem)}.body-default,.body-lg{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-lg{font-size:var(--wcss-body-lg-font-size, 1.125rem);line-height:var(--wcss-body-lg-line-height, 1.625rem)}.body-sm{font-size:var(--wcss-body-sm-font-size, .875rem);line-height:var(--wcss-body-sm-line-height, 1.25rem)}.body-sm,.body-xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-xs{font-size:var(--wcss-body-xs-font-size, .75rem);line-height:var(--wcss-body-xs-line-height, 1rem)}.body-2xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:var(--wcss-body-2xs-font-size, .625rem);font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0);line-height:var(--wcss-body-2xs-line-height, .875rem)}.display-2xl{font-family:var(--wcss-display-2xl-family, "AS Circular"),var(--wcss-display-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-2xl-font-size, clamp(3.5rem, 6vw, 5.375rem));font-weight:var(--wcss-display-2xl-weight, 300);letter-spacing:var(--wcss-display-2xl-letter-spacing, 0);line-height:var(--wcss-display-2xl-line-height, 1.3)}.display-xl{font-family:var(--wcss-display-xl-family, "AS Circular"),var(--wcss-display-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xl-font-size, clamp(3rem, 5.3333333333vw, 4.5rem));font-weight:var(--wcss-display-xl-weight, 300);letter-spacing:var(--wcss-display-xl-letter-spacing, 0);line-height:var(--wcss-display-xl-line-height, 1.3)}.display-lg{font-family:var(--wcss-display-lg-family, "AS Circular"),var(--wcss-display-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-lg-font-size, clamp(2.75rem, 4.6666666667vw, 4rem));font-weight:var(--wcss-display-lg-weight, 300);letter-spacing:var(--wcss-display-lg-letter-spacing, 0);line-height:var(--wcss-display-lg-line-height, 1.3)}.display-md{font-family:var(--wcss-display-md-family, "AS Circular"),var(--wcss-display-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-md-font-size, clamp(2.5rem, 4vw, 3.5rem));font-weight:var(--wcss-display-md-weight, 300);letter-spacing:var(--wcss-display-md-letter-spacing, 0);line-height:var(--wcss-display-md-line-height, 1.3)}.display-sm{font-family:var(--wcss-display-sm-family, "AS Circular"),var(--wcss-display-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-sm-font-size, clamp(2rem, 3.6666666667vw, 3rem));font-weight:var(--wcss-display-sm-weight, 300);letter-spacing:var(--wcss-display-sm-letter-spacing, 0);line-height:var(--wcss-display-sm-line-height, 1.3)}.display-xs{font-family:var(--wcss-display-xs-family, "AS Circular"),var(--wcss-display-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xs-font-size, clamp(1.75rem, 3vw, 2.375rem));font-weight:var(--wcss-display-xs-weight, 300);letter-spacing:var(--wcss-display-xs-letter-spacing, 0);line-height:var(--wcss-display-xs-line-height, 1.3)}.heading-xl{font-family:var(--wcss-heading-xl-family, "AS Circular"),var(--wcss-heading-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xl-font-size, clamp(2rem, 3vw, 2.5rem));font-weight:var(--wcss-heading-xl-weight, 300);letter-spacing:var(--wcss-heading-xl-letter-spacing, 0);line-height:var(--wcss-heading-xl-line-height, 1.3)}.heading-lg{font-family:var(--wcss-heading-lg-family, "AS Circular"),var(--wcss-heading-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-lg-font-size, clamp(1.75rem, 2.6666666667vw, 2.25rem));font-weight:var(--wcss-heading-lg-weight, 300);letter-spacing:var(--wcss-heading-lg-letter-spacing, 0);line-height:var(--wcss-heading-lg-line-height, 1.3)}.heading-md{font-family:var(--wcss-heading-md-family, "AS Circular"),var(--wcss-heading-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-md-font-size, clamp(1.625rem, 2.3333333333vw, 1.75rem));font-weight:var(--wcss-heading-md-weight, 300);letter-spacing:var(--wcss-heading-md-letter-spacing, 0);line-height:var(--wcss-heading-md-line-height, 1.3)}.heading-sm{font-family:var(--wcss-heading-sm-family, "AS Circular"),var(--wcss-heading-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-sm-font-size, clamp(1.375rem, 2vw, 1.5rem));font-weight:var(--wcss-heading-sm-weight, 300);letter-spacing:var(--wcss-heading-sm-letter-spacing, 0);line-height:var(--wcss-heading-sm-line-height, 1.3)}.heading-xs{font-family:var(--wcss-heading-xs-family, "AS Circular"),var(--wcss-heading-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xs-font-size, clamp(1.25rem, 1.6666666667vw, 1.25rem));font-weight:var(--wcss-heading-xs-weight, 450);letter-spacing:var(--wcss-heading-xs-letter-spacing, 0);line-height:var(--wcss-heading-xs-line-height, 1.3)}.heading-2xs{font-family:var(--wcss-heading-2xs-family, "AS Circular"),var(--wcss-heading-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-2xs-font-size, clamp(1.125rem, 1.5vw, 1.125rem));font-weight:var(--wcss-heading-2xs-weight, 450);letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0);line-height:var(--wcss-heading-2xs-line-height, 1.3)}.accent-2xl{font-family:var(--wcss-accent-2xl-family, "Good OT"),var(--wcss-accent-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xl-font-size, clamp(2rem, 3.1666666667vw, 2.375rem));font-weight:var(--wcss-accent-2xl-weight, 450);letter-spacing:var(--wcss-accent-2xl-letter-spacing, .05em);line-height:var(--wcss-accent-2xl-line-height, 1)}.accent-2xl,.accent-xl{text-transform:uppercase}.accent-xl{font-family:var(--wcss-accent-xl-family, "Good OT"),var(--wcss-accent-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xl-font-size, clamp(1.625rem, 2.3333333333vw, 2rem));font-weight:var(--wcss-accent-xl-weight, 450);letter-spacing:var(--wcss-accent-xl-letter-spacing, .05em);line-height:var(--wcss-accent-xl-line-height, 1.3)}.accent-lg{font-family:var(--wcss-accent-lg-family, "Good OT"),var(--wcss-accent-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-lg-font-size, clamp(1.5rem, 2.1666666667vw, 1.75rem));font-weight:var(--wcss-accent-lg-weight, 450);letter-spacing:var(--wcss-accent-lg-letter-spacing, .05em);line-height:var(--wcss-accent-lg-line-height, 1.3)}.accent-lg,.accent-md{text-transform:uppercase}.accent-md{font-family:var(--wcss-accent-md-family, "Good OT"),var(--wcss-accent-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-md-font-size, clamp(1.375rem, 1.8333333333vw, 1.5rem));font-weight:var(--wcss-accent-md-weight, 500);letter-spacing:var(--wcss-accent-md-letter-spacing, .05em);line-height:var(--wcss-accent-md-line-height, 1.3)}.accent-sm{font-family:var(--wcss-accent-sm-family, "Good OT"),var(--wcss-accent-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-sm-font-size, clamp(1.125rem, 1.5vw, 1.25rem));font-weight:var(--wcss-accent-sm-weight, 500);letter-spacing:var(--wcss-accent-sm-letter-spacing, .05em);line-height:var(--wcss-accent-sm-line-height, 1.3)}.accent-sm,.accent-xs{text-transform:uppercase}.accent-xs{font-family:var(--wcss-accent-xs-family, "Good OT"),var(--wcss-accent-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xs-font-size, clamp(1rem, 1.3333333333vw, 1rem));font-weight:var(--wcss-accent-xs-weight, 500);letter-spacing:var(--wcss-accent-xs-letter-spacing, .1em);line-height:var(--wcss-accent-xs-line-height, 1.3)}.accent-2xs{font-family:var(--wcss-accent-2xs-family, "Good OT"),var(--wcss-accent-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xs-font-size, clamp(.875rem, 1.1666666667vw, .875rem));font-weight:var(--wcss-accent-2xs-weight, 450);letter-spacing:var(--wcss-accent-2xs-letter-spacing, .1em);line-height:var(--wcss-accent-2xs-line-height, 1.3);text-transform:uppercase}:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host(:not([data-show])) .popover,:host([disabled]) .popover,:host([addSpace]) :host(:not([data-show])) .popover{display:none}.util_displayHiddenVisually{position:absolute;overflow:hidden;clip:rect(1px,1px,1px,1px);width:1px;height:1px;padding:0;border:0}.util_insetNone{padding:0}.util_insetXxxs{padding:.125rem}.util_insetXxxs--stretch{padding:.25rem .125rem}.util_insetXxxs--squish{padding:0 .125rem}.util_insetXxs{padding:.25rem}.util_insetXxs--stretch{padding:.375rem .25rem}.util_insetXxs--squish{padding:.125rem .25rem}.util_insetXs{padding:.5rem}.util_insetXs--stretch{padding:.75rem .5rem}.util_insetXs--squish{padding:.25rem .5rem}.util_insetSm{padding:.75rem}.util_insetSm--stretch{padding:1.125rem .75rem}.util_insetSm--squish{padding:.375rem .75rem}.util_insetMd{padding:1rem}.util_insetMd--stretch{padding:1.5rem 1rem}.util_insetMd--squish{padding:.5rem 1rem}.util_insetLg{padding:1.5rem}.util_insetLg--stretch{padding:2.25rem 1.5rem}.util_insetLg--squish{padding:.75rem 1.5rem}.util_insetXl{padding:2rem}.util_insetXl--stretch{padding:3rem 2rem}.util_insetXl--squish{padding:1rem 2rem}.util_insetXxl{padding:3rem}.util_insetXxl--stretch{padding:4.5rem 3rem}.util_insetXxl--squish{padding:1.5rem 3rem}.util_insetXxxl{padding:4rem}.util_insetXxxl--stretch{padding:6rem 4rem}.util_insetXxxl--squish{padding:2rem 4rem}::slotted(*){white-space:normal}::slotted(*:hover){cursor:pointer}[data-trigger-placement]::slotted(*:hover){position:relative}[data-trigger-placement]::slotted(*:hover):before{position:absolute;left:0;display:block;width:100%;height:calc(var(--ds-size-200, 1rem) + var(--ds-size-50, .25rem));content:""}[data-trigger-placement^=top]::slotted(*:hover):before{top:calc(-1 * (var(--ds-size-200, 1rem) + var(--ds-size-50, .25rem)))}[data-trigger-placement^=bottom]::slotted(*:hover):before{bottom:calc(-1 * (var(--ds-size-200, 1rem) + var(--ds-size-50, .25rem)))}:host([data-show]) .popover{z-index:var(--ds-depth-tooltip, 400)}:host([removeSpace]) .popover{margin:calc(-1 * (var(--ds-size-50, .25rem) + 1px)) 0!important}:host([addSpace]) .popover{margin:var(--ds-size-200, 1rem) 0!important}:host([addSpace]) [data-trigger-placement]::slotted(*:hover):before{height:var(--ds-size-500, 2.5rem)}:host([addSpace]) [data-trigger-placement^=top]::slotted(*:hover):before{top:calc(-1 * var(--ds-size-500, 2.5rem))}:host([addSpace]) [data-trigger-placement^=bottom]::slotted(*:hover):before{bottom:calc(-1 * var(--ds-size-500, 2.5rem))}.popover{display:inline-block;max-width:calc(100% - var(--ds-size-400, 2rem));border-radius:var(--ds-border-radius, .375rem)}@media screen and (min-width: 576px){.popover{max-width:50%}}@media screen and (min-width: 768px){.popover{max-width:40%}}@media screen and (min-width: 1024px){.popover{max-width:27rem}}[data-popper-placement^=top]>.arrow{bottom:calc(-1 * (var(--ds-size-100, .5rem) + var(--ds-size-25, .125rem)))}[data-popper-placement^=top]>.arrow:before{top:calc(-1 * var(--ds-size-200, 1rem));left:calc(-1 * var(--ds-size-75, .375rem));transform:rotate(45deg)}[data-popper-placement^=bottom]>.arrow{top:calc(-1 * (var(--ds-size-100, .5rem) + var(--ds-size-25, .125rem)))}[data-popper-placement^=bottom]>.arrow:before{top:var(--ds-size-50, .25rem);right:calc(-1 * var(--ds-size-200, 1rem));transform:rotate(-135deg)}.arrow{position:relative;margin-top:-var(--ds-size-100,.5rem)}.arrow:before{position:absolute;width:var(--ds-size-150, .75rem);height:var(--ds-size-150, .75rem);content:""}
3
3
  `,Se=e`:host{--ds-auro-popover-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, .15));--ds-auro-popover-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-popover-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}
4
- `;class Oe extends t{constructor(){super(),this.placement="top",this._onTouchStart=null,this._onTriggerMouseEnter=null,this._onTriggerMouseLeave=null,this._onTriggerFocus=null,this._onTriggerBlur=null,this._onTriggerKeydown=null,this._onHidePopover=null,this._onBodyMouseover=null,this._addedTabIndex=!1}_initializeDefaults(){this.isPopoverVisible=!1,this.runtimeUtils=new s}static get properties(){return{addSpace:{type:Boolean,reflect:!0},boundary:{type:String},disabled:{type:Boolean,reflect:!0},for:{type:String,reflect:!0},placement:{type:String},removeSpace:{type:Boolean,reflect:!0}}}static get styles(){return[e`${xe}`,e`${be}`,e`${Se}`]}static register(e="auro-popover"){s.prototype.registerComponent(e,Oe)}connectedCallback(){super.connectedCallback(),this._initializeDefaults(),this._onTouchStart||(this._onTouchStart=()=>{this.toggle()}),this.addEventListener("touchstart",this._onTouchStart)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("touchstart",this._onTouchStart),this.trigger&&(this._onTriggerMouseEnter&&this._eventTarget.removeEventListener("mouseenter",this._onTriggerMouseEnter),this._onTriggerMouseLeave&&this._eventTarget.removeEventListener("mouseleave",this._onTriggerMouseLeave),this._onTriggerFocus&&this.trigger.removeEventListener("focus",this._onTriggerFocus),this._onTriggerBlur&&this.trigger.removeEventListener("blur",this._onTriggerBlur),this._onTriggerKeydown&&this.trigger.removeEventListener("keydown",this._onTriggerKeydown),this.trigger.removeAttribute("aria-description"),this._addedTabIndex&&this.trigger.removeAttribute("tabindex")),this._onHidePopover&&this.removeEventListener("hidePopover",this._onHidePopover),this._onBodyMouseover&&document.body.removeEventListener("mouseover",this._onBodyMouseover),this.popper?.popper&&"function"==typeof this.popper.popper.destroy&&(this.popper.popper.destroy(),this.popper.popper=null)}firstUpdated(){if(this.runtimeUtils.handleComponentTagRename(this,"auro-popover"),this.for&&(this.trigger=document.querySelector(`#${this.for}`)||this.getRootNode().querySelector(`#${this.for}`)),this.trigger||([this.trigger]=this.shadowRoot.querySelector('slot[name="trigger"]').assignedElements()),!this.trigger)return;const e=this.trigger.tabIndex>=0,t=!!this.trigger.shadowRoot&&Boolean(this.trigger.shadowRoot.querySelector('button, a[href], input:not([disabled]), select, textarea, [tabindex]:not([tabindex="-1"])'));e||t||this.trigger.hasAttribute("tabindex")||(this.trigger.setAttribute("tabindex","0"),this._addedTabIndex=!0);const i=this.shadowRoot.querySelector("slot:not([name])"),s=()=>i.assignedNodes({flatten:!0}).map(e=>e.textContent).join("").trim();this.trigger.setAttribute("aria-description",s()),i.addEventListener("slotchange",()=>{this.trigger?.setAttribute("aria-description",s())}),this.auroPopover=this.shadowRoot.querySelector("#popover"),this.popper=new we(this.trigger,this.auroPopover,this.placement,this.boundary),this._onBodyMouseover=e=>this.handleMouseoverEvent(e),this._onTriggerMouseEnter=()=>{this.toggleShow()},this._onTriggerMouseLeave=()=>{this.toggleHide()},this._onTriggerFocus=()=>{this.toggleShow()},this._onTriggerBlur=()=>{this.toggleHide()},this._onTriggerKeydown=e=>{const t=e.key.toLowerCase();this.isPopoverVisible&&("tab"!==t&&"escape"!==t||this.toggleHide())," "!==t&&"enter"!==t||this.toggle()},this._onHidePopover=()=>{this.toggleHide()},this._eventTarget="AURO-POPOVER"===this.trigger.parentElement.nodeName?this:this.trigger,this._eventTarget.addEventListener("mouseenter",this._onTriggerMouseEnter),this._eventTarget.addEventListener("mouseleave",this._onTriggerMouseLeave),this.trigger.addEventListener("keydown",this._onTriggerKeydown),this.trigger.addEventListener("focus",this._onTriggerFocus),this.trigger.addEventListener("blur",this._onTriggerBlur),this.addEventListener("hidePopover",this._onHidePopover)}toggle(){this.popper&&(this.isPopoverVisible?this.toggleHide():this.toggleShow())}toggleHide(){this.isPopoverVisible=!1,this.removeAttribute("data-show"),document.body.removeEventListener("mouseover",this._onBodyMouseover),this.popper&&this.popper.hide()}toggleShow(){this.popper&&(this.popper.show(),this.isPopoverVisible=!0,this.setAttribute("data-show",!0),document.body.addEventListener("mouseover",this._onBodyMouseover))}handleMouseoverEvent(e){this.isPopoverVisible&&!e.composedPath().includes(this)&&this.toggleHide()}updated(e){e.has("boundary")&&this.popper&&(this.popper.boundaryElement=this.boundary)}render(){return i`
4
+ `;class Oe extends t{constructor(){super(),this.placement="top",this._onTouchStart=null,this._onTriggerMouseEnter=null,this._onTriggerMouseLeave=null,this._onTriggerFocus=null,this._onTriggerBlur=null,this._onTriggerKeydown=null,this._onHidePopover=null,this._onBodyMouseover=null,this._addedTabIndex=!1}_initializeDefaults(){this.isPopoverVisible=!1,this.runtimeUtils=new s}static get properties(){return{addSpace:{type:Boolean,reflect:!0},boundary:{type:String},disabled:{type:Boolean,reflect:!0},for:{type:String,reflect:!0},placement:{type:String},removeSpace:{type:Boolean,reflect:!0}}}static get styles(){return[e`${xe}`,e`${be}`,e`${Se}`]}static register(e="auro-popover"){s.prototype.registerComponent(e,Oe)}connectedCallback(){super.connectedCallback(),this._initializeDefaults(),this._onTouchStart||(this._onTouchStart=()=>{this.toggle()}),this.addEventListener("touchstart",this._onTouchStart)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("touchstart",this._onTouchStart),this.trigger&&(this._onTriggerMouseEnter&&this._eventTarget.removeEventListener("mouseenter",this._onTriggerMouseEnter),this._onTriggerMouseLeave&&this._eventTarget.removeEventListener("mouseleave",this._onTriggerMouseLeave),this._onTriggerFocus&&this.trigger.removeEventListener("focus",this._onTriggerFocus),this._onTriggerBlur&&this.trigger.removeEventListener("blur",this._onTriggerBlur),this._onTriggerKeydown&&this.trigger.removeEventListener("keydown",this._onTriggerKeydown),this.trigger.removeAttribute("aria-description"),this._addedTabIndex&&this.trigger.removeAttribute("tabindex")),this._onHidePopover&&this.removeEventListener("hidePopover",this._onHidePopover),this._onBodyMouseover&&document.body.removeEventListener("mouseover",this._onBodyMouseover),this.popper?.popper&&"function"==typeof this.popper.popper.destroy&&(this.popper.popper.destroy(),this.popper.popper=null)}firstUpdated(){if(this.runtimeUtils.handleComponentTagRename(this,"auro-popover"),this.for&&(this.trigger=document.querySelector(`#${this.for}`)||this.getRootNode().querySelector(`#${this.for}`)),this.trigger||([this.trigger]=this.shadowRoot.querySelector('slot[name="trigger"]').assignedElements()),!this.trigger)return;const e=this.trigger.tabIndex>=0,t=!!this.trigger.shadowRoot&&Boolean(this.trigger.shadowRoot.querySelector('button, a[href], input:not([disabled]), select, textarea, [tabindex]:not([tabindex="-1"])'));e||t||this.trigger.hasAttribute("tabindex")||(this.trigger.setAttribute("tabindex","0"),this._addedTabIndex=!0);const i=this.shadowRoot.querySelector("slot:not([name])"),s=()=>i.assignedNodes({flatten:!0}).map(e=>e.textContent).join("").trim();this.trigger.setAttribute("aria-description",s()),i.addEventListener("slotchange",()=>{this.trigger?.setAttribute("aria-description",s())}),this.auroPopover=this.shadowRoot.querySelector("#popover"),this.popper=new we(this.trigger,this.auroPopover,this.placement,this.boundary),this._onBodyMouseover=e=>this.handleMouseoverEvent(e),this._onTriggerMouseEnter=()=>{this.toggleShow()},this._onTriggerMouseLeave=()=>{this.toggleHide()},this._onTriggerFocus=()=>{this.toggleShow()},this._onTriggerBlur=()=>{this.toggleHide()},this._onTriggerKeydown=e=>{const t=e.key.toLowerCase();this.isPopoverVisible&&("tab"!==t&&"escape"!==t||this.toggleHide())," "!==t&&"enter"!==t||(e.preventDefault(),this.toggle())},this._onHidePopover=()=>{this.toggleHide()},this._eventTarget="AURO-POPOVER"===this.trigger.parentElement.nodeName?this:this.trigger,this._eventTarget.addEventListener("mouseenter",this._onTriggerMouseEnter),this._eventTarget.addEventListener("mouseleave",this._onTriggerMouseLeave),this.trigger.addEventListener("keydown",this._onTriggerKeydown),this.trigger.addEventListener("focus",this._onTriggerFocus),this.trigger.addEventListener("blur",this._onTriggerBlur),this.addEventListener("hidePopover",this._onHidePopover)}toggle(){this.popper&&(this.isPopoverVisible?this.toggleHide():this.toggleShow())}toggleHide(){this.isPopoverVisible=!1,this.removeAttribute("data-show"),document.body.removeEventListener("mouseover",this._onBodyMouseover),this.popper&&this.popper.hide()}toggleShow(){this.popper&&(this.popper.show(),this.isPopoverVisible=!0,this.setAttribute("data-show",!0),document.body.addEventListener("mouseover",this._onBodyMouseover))}handleMouseoverEvent(e){this.isPopoverVisible&&!e.composedPath().includes(this)&&this.toggleHide()}updated(e){e.has("boundary")&&this.popper&&(this.popper.boundaryElement=this.boundary)}render(){return i`
5
5
  <div id="popover" class="popover util_insetLg body-default" part="popover">
6
6
  <div id="arrow" class="arrow" data-popper-arrow></div>
7
7
  <span role="tooltip"><slot></slot></span>
package/dist/index.d.ts CHANGED
@@ -89,7 +89,7 @@ export type AuroPopoverProps = {
89
89
  "disabled"?: AuroPopover['disabled'];
90
90
  /** Directly associates the popover with a trigger element with the given ID. In most cases, this should not be necessary and set `slot="trigger"` on the element instead. */
91
91
  "for"?: AuroPopover['for'];
92
- /** Position for popover in relation to the element. */
92
+ /** Position for popover in relation to the element {'top' | 'bottom'}. */
93
93
  "placement"?: AuroPopover['placement'];
94
94
  /** Removes top and bottom space around the appearance of the popover in relation to the trigger. */
95
95
  "removeSpace"?: AuroPopover['removeSpace'];
@@ -129,7 +129,7 @@ export type AuroPopoverProps = {
129
129
  * - `boundary`: The element to use as the boundary for the popover. Can be a query selector or an HTML element.
130
130
  * - `disabled`: Disables the popover from showing on hover and focus.
131
131
  * - `for`: Directly associates the popover with a trigger element with the given ID. In most cases, this should not be necessary and set `slot="trigger"` on the element instead.
132
- * - `placement`: Position for popover in relation to the element.
132
+ * - `placement`: Position for popover in relation to the element {'top' | 'bottom'}.
133
133
  * - `removeSpace`: Removes top and bottom space around the appearance of the popover in relation to the trigger.
134
134
  * - `_addedTabIndex`: undefined (property only)
135
135
  * - `_onBodyMouseover`: undefined (property only)
package/dist/index.js CHANGED
@@ -1 +1 @@
1
- export{A as AuroPopover}from"./auro-popover-Cfr8dUmf.js";import"lit";
1
+ export{A as AuroPopover}from"./auro-popover-CoBEOioP.js";import"lit";
@@ -1 +1 @@
1
- import{A as r}from"./auro-popover-Cfr8dUmf.js";import"lit";r.register();
1
+ import{A as r}from"./auro-popover-CoBEOioP.js";import"lit";r.register();
package/package.json CHANGED
@@ -7,7 +7,7 @@
7
7
  "================================================================================"
8
8
  ],
9
9
  "name": "@aurodesignsystem-dev/auro-popover",
10
- "version": "0.0.0-pr125.2",
10
+ "version": "0.0.0-pr125.3",
11
11
  "description": "auro-popover HTML custom element",
12
12
  "repository": {
13
13
  "type": "git",