@aurodesignsystem-dev/auro-popover 0.0.0-pr117.1 → 0.0.0-pr119.1

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.
@@ -66,6 +66,19 @@ class AuroLibraryRuntimeUtils {
66
66
 
67
67
  return elemTag === tag || elem.hasAttribute(tag);
68
68
  }
69
+
70
+ /**
71
+ * Gets the text content of a named slot.
72
+ * @returns {String}
73
+ * @private
74
+ */
75
+ getSlotText(elem, name) {
76
+ const slot = elem.shadowRoot?.querySelector(`slot[name="${name}"]`);
77
+ const nodes = slot?.assignedNodes({ flatten: true }) || [];
78
+ const text = nodes.map(n => n.textContent?.trim()).join(' ').trim();
79
+
80
+ return text || null;
81
+ }
69
82
  }
70
83
 
71
84
  /**
@@ -1957,19 +1970,14 @@ var styleCss = i$3`.body-default{font-size:var(--wcss-body-default-font-size, 1r
1957
1970
  var tokensCss = i$3`: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)}
1958
1971
  `;
1959
1972
 
1960
- // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
1973
+ // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
1961
1974
  // See LICENSE in the project root for license information.
1962
1975
 
1963
1976
 
1964
1977
  /**
1965
- * Popover attaches to an element and displays on hover/blur.
1978
+ * The `auro-popover` element attaches to another element and displays on hover.
1979
+ * @customElement auro-popover
1966
1980
  *
1967
- * @attr {boolean} addSpace - If true, will add additional top and bottom space around the appearance of the popover in relation to the trigger
1968
- * @attr {boolean} disabled - If true, will disable the popover from showing on hover and focus
1969
- * @attr {String} for - Directly associate 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.
1970
- * @attr {String} placement - Expects top/bottom - position for popover in relation to the element
1971
- * @attr {boolean} removeSpace - If true, will remove top and bottom space around the appearance of the popover in relation to the trigger
1972
- * @attr {String | Object} boundary - The element to use as the boundary for the popover. Can be a query selector or an HTML element.
1973
1981
  * @slot - Default unnamed slot for the use of popover content
1974
1982
  * @slot trigger - The element in this slot triggers hiding and showing the popover.
1975
1983
  */
@@ -1985,7 +1993,8 @@ class AuroPopover extends i {
1985
1993
  * @private
1986
1994
  * @returns {void}
1987
1995
  */
1988
- privateDefaults() {
1996
+ _initializeDefaults() {
1997
+ // this.placement = "top";
1989
1998
  this.isPopoverVisible = false;
1990
1999
  this.id = `popover-${(Math.random() + 1).toString(36).substring(7)}`;
1991
2000
  this.runtimeUtils = new AuroLibraryRuntimeUtils();
@@ -1994,10 +2003,50 @@ class AuroPopover extends i {
1994
2003
  // function to define props used within the scope of this component
1995
2004
  static get properties() {
1996
2005
  return {
1997
- placement: { type: String },
1998
- for: { type: String },
1999
- disabled: { type: Boolean },
2006
+ /**
2007
+ * Adds additional top and bottom space around the appearance of the popover in relation to the trigger.
2008
+ */
2009
+ addSpace: {
2010
+ type: Boolean,
2011
+ reflect: true
2012
+ },
2013
+
2014
+ /**
2015
+ * The element to use as the boundary for the popover. Can be a query selector or an HTML element.
2016
+ * @type {string | object}
2017
+ */
2000
2018
  boundary: { type: String },
2019
+
2020
+ /**
2021
+ * Disables the popover from showing on hover and focus.
2022
+ */
2023
+ disabled: {
2024
+ type: Boolean,
2025
+ reflect: true
2026
+ },
2027
+
2028
+ /**
2029
+ * 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.
2030
+ */
2031
+ for: {
2032
+ type: String,
2033
+ reflect: true
2034
+ },
2035
+
2036
+ /**
2037
+ * Position for popover in relation to the element.
2038
+ * @type {'top' | 'bottom'}
2039
+ * @default 'top'
2040
+ */
2041
+ placement: { type: String},
2042
+
2043
+ /**
2044
+ * Removes top and bottom space around the appearance of the popover in relation to the trigger.
2045
+ */
2046
+ removeSpace: {
2047
+ type: Boolean,
2048
+ reflect: true
2049
+ },
2001
2050
  };
2002
2051
  }
2003
2052
 
@@ -2007,7 +2056,7 @@ class AuroPopover extends i {
2007
2056
 
2008
2057
  /**
2009
2058
  * This will register this element with the browser.
2010
- * @param {string} [name="auro-popover"] - The name of element that you want to register to.
2059
+ * @param {string} [name="auro-popover"] - The name of the element that you want to register.
2011
2060
  *
2012
2061
  * @example
2013
2062
  * AuroPopover.register("custom-popover") // this will register this element to <custom-popover/>
@@ -2020,7 +2069,7 @@ class AuroPopover extends i {
2020
2069
  connectedCallback() {
2021
2070
  super.connectedCallback();
2022
2071
 
2023
- this.privateDefaults();
2072
+ this._initializeDefaults();
2024
2073
 
2025
2074
  // adds toggle function to root element based on touch
2026
2075
  this.addEventListener("touchstart", function () {
package/demo/index.html CHANGED
@@ -51,7 +51,7 @@
51
51
  <script type="module" data-demo-script="true" src="./index.min.js"></script>
52
52
 
53
53
  <!-- If additional elements are needed for the demo, add them here. -->
54
- <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-accordion@latest/dist/auro-accordion__bundled.js" type="module"></script>
55
- <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-button@latest/dist/auro-button__bundled.js" type="module"></script>
54
+ <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-accordion@latest/+esm" type="module"></script>
55
+ <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-button@latest/+esm" type="module"></script>
56
56
  </body>
57
57
  </html>
package/demo/index.md CHANGED
@@ -1,22 +1,20 @@
1
1
  <!--
2
- The index.md file is a compiled document. No edits should be made directly to this file.
3
- README.md is created by running `npm run build:docs`.
4
- This file is generated based on a template fetched from `./docs/partials/index.md`
2
+ THIS PAGE'S CONTENT SHOULD BE KEPT MINIMAL.
3
+ ONLY ADD EXAMPLES THAT ARE TRULY NECESSARY FOR THE INDEX PAGE — THE BASIC EXAMPLE IS USUALLY ENOUGH.
4
+ ALL OTHER EXAMPLES SHOULD GO IN THE API DOCUMENTATION.
5
5
  -->
6
6
 
7
- # Popover
8
-
9
- <!-- AURO-GENERATED-CONTENT:START (FILE:src=../docs/partials/description.md) -->
10
- <!-- The below content is automatically added from ../docs/partials/description.md -->
11
- The Auro Design System fully supports `top` and `bottom` placed popovers. The following examples illustrate common popover uses followed up by code examples.
12
-
13
- See for more information as how to install and full API for the `<auro-popover>` element.
7
+ # Popover
8
+
9
+ <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../docs/partials/description.md) -->
10
+ <!-- The below content is automatically added from ./../docs/partials/description.md -->
11
+ The `<auro-popover>` element attaches to another element and displays on hover. It uses the [Popper.js](https://popper.js.org/) library to position itself relative to the trigger element and supports placement options such as `top` and `bottom`.
14
12
  <!-- AURO-GENERATED-CONTENT:END -->
15
13
 
16
- ## auro-popover use cases
17
-
18
- <!-- AURO-GENERATED-CONTENT:START (FILE:src=../docs/partials/useCases.md) -->
19
- <!-- The below content is automatically added from ../docs/partials/useCases.md -->
14
+ ## Use Cases
15
+
16
+ <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../docs/partials/useCases.md) -->
17
+ <!-- The below content is automatically added from ./../docs/partials/useCases.md -->
20
18
  The `auro-popover` element should be used in situations where users may:
21
19
 
22
20
  * interact with an element to get clarification on content offering
@@ -24,88 +22,33 @@ The `auro-popover` element should be used in situations where users may:
24
22
  * when helper text is required
25
23
  <!-- AURO-GENERATED-CONTENT:END -->
26
24
 
25
+ ## Developer Notes
26
+
27
+ The default trigger for a popover is a `hover` event. Mobile devices do not support `hover` events directly, so the `hover` event is replaced with a `touchstart` event to produce the popover. This is to ensure reliability of the action versus a dependency on a secondary interruption of the `hover` event on mobile devices.
28
+
27
29
  ## Example(s)
28
30
 
31
+ ### Basic
32
+
29
33
  <div class="exampleWrapper">
30
- <!-- AURO-GENERATED-CONTENT:START (FILE:src=../apiExamples/basic.html) -->
31
- <!-- The below content is automatically added from ../apiExamples/basic.html -->
32
- <!-- The slot=trigger attribute is bound directly to the auro-button element -->
34
+ <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/basic.html) -->
35
+ <!-- The below content is automatically added from ./../apiExamples/basic.html -->
33
36
  <auro-popover>
34
37
  Top popover content!
35
38
  <auro-button slot="trigger">Popover Test</auro-button>
36
- </auro-popover>
37
- <!-- Using the placement=bottom attribute -->
38
- <auro-popover placement="bottom">
39
- Popover content!
40
- <auro-button secondary slot="trigger">Popover Test</auro-button>
41
39
  </auro-popover>
42
40
  <!-- AURO-GENERATED-CONTENT:END -->
43
41
  </div>
44
42
  <auro-accordion alignRight>
45
43
  <span slot="trigger">See code</span>
46
- <!-- AURO-GENERATED-CONTENT:START (CODE:src=../apiExamples/basic.html) -->
47
- <!-- The below code snippet is automatically added from ../apiExamples/basic.html -->
44
+ <!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/basic.html) -->
45
+ <!-- The below code snippet is automatically added from ./../apiExamples/basic.html -->
48
46
 
49
47
  ```html
50
- <!-- The slot=trigger attribute is bound directly to the auro-button element -->
51
48
  <auro-popover>
52
49
  Top popover content!
53
50
  <auro-button slot="trigger">Popover Test</auro-button>
54
51
  </auro-popover>
55
- <!-- Using the placement=bottom attribute -->
56
- <auro-popover placement="bottom">
57
- Popover content!
58
- <auro-button secondary slot="trigger">Popover Test</auro-button>
59
- </auro-popover>
60
- ```
61
- <!-- AURO-GENERATED-CONTENT:END -->
62
- </auro-accordion>
63
-
64
- ## Recommended Use and Version Control
65
-
66
- There are two important parts of every Auro component. The <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes">class</a> and the custom element. The class is exported and then used as part of defining the Web Component. When importing this component as described in the <a href="#install">install</a> section, the class is imported and the `auro-popover` custom element is defined automatically.
67
-
68
- To protect from versioning conflicts with other instances of the component being loaded, it is recommended to use our `AuroPopover.register(name)` method and pass in a unique name.
69
-
70
- ```js
71
- import { AuroPopover } from '@aurodesignsystem/auro-popover/class';
72
-
73
- AuroPopover.register('custom-popover');
74
- ```
75
-
76
- This will create a new custom element that you can use in your HTML that will function identically to the `auro-popover` element.
77
-
78
- <div class="exampleWrapper">
79
- <!-- AURO-GENERATED-CONTENT:START (FILE:src=../apiExamples/custom.html) -->
80
- <!-- The below content is automatically added from ../apiExamples/custom.html -->
81
- <!-- The slot=trigger attribute is bound directly to the auro-button element -->
82
- <custom-popover>
83
- Top popover content!
84
- <auro-button slot="trigger">Popover Test</auro-button>
85
- </custom-popover>
86
- <!-- Using the placement=bottom attribute -->
87
- <custom-popover placement="bottom">
88
- Popover content!
89
- <auro-button secondary slot="trigger">Popover Test</auro-button>
90
- </custom-popover>
91
- <!-- AURO-GENERATED-CONTENT:END -->
92
- </div>
93
- <auro-accordion alignRight>
94
- <span slot="trigger">See code</span>
95
- <!-- AURO-GENERATED-CONTENT:START (CODE:src=../apiExamples/custom.html) -->
96
- <!-- The below code snippet is automatically added from ../apiExamples/custom.html -->
97
-
98
- ```html
99
- <!-- The slot=trigger attribute is bound directly to the auro-button element -->
100
- <custom-popover>
101
- Top popover content!
102
- <auro-button slot="trigger">Popover Test</auro-button>
103
- </custom-popover>
104
- <!-- Using the placement=bottom attribute -->
105
- <custom-popover placement="bottom">
106
- Popover content!
107
- <auro-button secondary slot="trigger">Popover Test</auro-button>
108
- </custom-popover>
109
52
  ```
110
53
  <!-- AURO-GENERATED-CONTENT:END -->
111
54
  </auro-accordion>
@@ -0,0 +1,13 @@
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",a="bottom",n="right",o="left",l="auto",c=[r,a,n,o],p="start",d="end",f="viewport",m="popper",u=c.reduce(function(e,t){return e.concat([t+"-"+p,t+"-"+d])},[]),h=[].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]||{},a=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,a),Object.keys(r).forEach(function(e){s.removeAttribute(e)}))})}},requires:["computeStyles"]};function O(e){return e.split("-")[0]}var k=Math.max,z=Math.min,A=Math.round;function E(){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 H(){return!/^((?!chrome|android).)*safari/i.test(E())}function M(e,t,i){void 0===t&&(t=!1),void 0===i&&(i=!1);var s=e.getBoundingClientRect(),r=1,a=1;t&&b(e)&&(r=e.offsetWidth>0&&A(s.width)/e.offsetWidth||1,a=e.offsetHeight>0&&A(s.height)/e.offsetHeight||1);var n=(w(e)?y(e):window).visualViewport,o=!H()&&i,l=(s.left+(o&&n?n.offsetLeft:0))/r,c=(s.top+(o&&n?n.offsetTop:0))/a,p=s.width/r,d=s.height/a;return{width:p,height:d,top:c,right:l+p,bottom:c+d,left:l,x:l,y:c}}function B(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 R(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 C(e){return y(e).getComputedStyle(e)}function L(e){return["table","td","th"].indexOf(v(e))>=0}function _(e){return((w(e)?e.ownerDocument:e.document)||window.document).documentElement}function j(e){return"html"===v(e)?e:e.assignedSlot||e.parentNode||(x(e)?e.host:null)||_(e)}function N(e){return b(e)&&"fixed"!==C(e).position?e.offsetParent:null}function D(e){for(var t=y(e),i=N(e);i&&L(i)&&"static"===C(i).position;)i=N(i);return i&&("html"===v(i)||"body"===v(i)&&"static"===C(i).position)?t:i||function(e){var t=/firefox/i.test(E());if(/Trident/i.test(E())&&b(e)&&"fixed"===C(e).position)return null;var i=j(e);for(x(i)&&(i=i.host);b(i)&&["html","body"].indexOf(v(i))<0;){var s=C(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 U(e,t,i){return k(e,z(t,i))}function I(e){return Object.assign({},{top:0,right:0,bottom:0,left:0},e)}function q(e,t){return t.reduce(function(t,i){return t[i]=e,t},{})}var F={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),u=[o,n].indexOf(f)>=0?"height":"width";if(p&&d){var h=function(e,t){return I("number"!=typeof(e="function"==typeof e?e(Object.assign({},t.rects,{placement:t.placement})):e)?e:q(e,c))}(l.padding,i),g=B(p),v="y"===m?r:o,y="y"===m?a:n,w=i.rects.reference[u]+i.rects.reference[m]-d[m]-i.rects.popper[u],b=d[m]-i.rects.reference[m],x=D(p),S=x?"y"===m?x.clientHeight||0:x.clientWidth||0:0,k=w/2-b/2,z=h[v],A=S-g[u]-h[y],E=S/2-g[u]/2+k,H=U(z,E,A),M=m;i.modifiersData[s]=((t={})[M]=H,t.centerOffset=H-E,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)))&&R(t.elements.popper,s)&&(t.elements.arrow=s)},requires:["popperOffsets"],requiresIfExists:["preventOverflow"]};function T(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,u=e.adaptive,h=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 h?h({x:w,y:x}):{x:w,y:x};w=S.x,x=S.y;var O=p.hasOwnProperty("x"),k=p.hasOwnProperty("y"),z=o,E=r,H=window;if(u){var M=D(i),B="clientHeight",R="clientWidth";if(M===y(i)&&"static"!==C(M=_(i)).position&&"absolute"===f&&(B="scrollHeight",R="scrollWidth"),l===r||(l===o||l===n)&&c===d)E=a,x-=(g&&M===H&&H.visualViewport?H.visualViewport.height:M[B])-s.height,x*=m?1:-1;if(l===o||(l===r||l===a)&&c===d)z=n,w-=(g&&M===H&&H.visualViewport?H.visualViewport.width:M[R])-s.width,w*=m?1:-1}var L,j=Object.assign({position:f},u&&W),N=!0===h?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=N.x,x=N.y,m?Object.assign({},j,((L={})[E]=k?"0":"",L[z]=O?"0":"",L.transform=(H.devicePixelRatio||1)<=1?"translate("+w+"px, "+x+"px)":"translate3d("+w+"px, "+x+"px, 0)",L)):Object.assign({},j,((t={})[E]=k?x+"px":"",t[z]=O?w+"px":"",t.transform="",t))}var V={passive:!0};var $={left:"right",right:"left",bottom:"top",top:"bottom"};function G(e){return e.replace(/left|right|bottom|top/g,function(e){return $[e]})}var Y={start:"end",end:"start"};function J(e){return e.replace(/start|end/g,function(e){return Y[e]})}function K(e){var t=y(e);return{scrollLeft:t.pageXOffset,scrollTop:t.pageYOffset}}function Q(e){return M(_(e)).left+K(e).scrollLeft}function Z(e){var t=C(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(j(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),a=y(s),n=r?[a].concat(a.visualViewport||[],Z(s)?s:[]):s,o=t.concat(n);return r?o:o.concat(te(j(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=_(e),r=i.visualViewport,a=s.clientWidth,n=s.clientHeight,o=0,l=0;if(r){a=r.width,n=r.height;var c=H();(c||!c&&"fixed"===t)&&(o=r.offsetLeft,l=r.offsetTop)}return{width:a,height:n,x:o+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=_(e),s=K(e),r=null==(t=e.ownerDocument)?void 0:t.body,a=k(i.scrollWidth,i.clientWidth,r?r.scrollWidth:0,r?r.clientWidth:0),n=k(i.scrollHeight,i.clientHeight,r?r.scrollHeight:0,r?r.clientHeight:0),o=-s.scrollLeft+Q(e),l=-s.scrollTop;return"rtl"===C(r||i).direction&&(o+=k(i.clientWidth,r?r.clientWidth:0)-a),{width:a,height:n,x:o,y:l}}(_(e)))}function re(e,t,i,s){var r="clippingParents"===t?function(e){var t=te(j(e)),i=["absolute","fixed"].indexOf(C(e).position)>=0&&b(e)?D(e):e;return w(i)?t.filter(function(e){return w(e)&&R(e,i)&&"body"!==v(e)}):[]}(e):[].concat(t),a=[].concat(r,[i]),n=a[0],o=a.reduce(function(t,i){var r=se(e,i,s);return t.top=k(r.top,t.top),t.right=z(r.right,t.right),t.bottom=z(r.bottom,t.bottom),t.left=k(r.left,t.left),t},se(e,n,s));return o.width=o.right-o.left,o.height=o.bottom-o.top,o.x=o.left,o.y=o.top,o}function ae(e){var t,i=e.reference,s=e.element,l=e.placement,c=l?O(l):null,f=l?T(l):null,m=i.x+i.width/2-s.width/2,u=i.y+i.height/2-s.height/2;switch(c){case r:t={x:m,y:i.y-s.height};break;case a:t={x:m,y:i.y+i.height};break;case n:t={x:i.x+i.width,y:u};break;case o:t={x:i.x-s.width,y:u};break;default:t={x:i.x,y:i.y}}var h=c?P(c):null;if(null!=h){var g="y"===h?"height":"width";switch(f){case p:t[h]=t[h]-(i[g]/2-s[g]/2);break;case d:t[h]=t[h]+(i[g]/2-s[g]/2)}}return t}function ne(e,t){void 0===t&&(t={});var i=t,s=i.placement,o=void 0===s?e.placement:s,l=i.strategy,p=void 0===l?e.strategy:l,d=i.boundary,u=void 0===d?"clippingParents":d,h=i.rootBoundary,g=void 0===h?f:h,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,k=I("number"!=typeof O?O:q(O,c)),z=y===m?"reference":m,A=e.rects.popper,E=e.elements[x?z:y],H=re(w(E)?E:E.contextElement||_(e.elements.popper),u,g,p),B=M(e.elements.reference),R=ae({reference:B,element:A,placement:o}),C=ie(Object.assign({},A,R)),L=y===m?C:B,j={top:H.top-L.top+k.top,bottom:L.bottom-H.bottom+k.bottom,left:H.left-L.left+k.left,right:L.right-H.right+k.right},N=e.modifiersData.offset;if(y===m&&N){var D=N[o];Object.keys(j).forEach(function(e){var t=[n,a].indexOf(e)>=0?1:-1,i=[r,a].indexOf(e)>=0?"y":"x";j[e]+=D[i]*t})}return j}function oe(e,t){void 0===t&&(t={});var i=t,s=i.placement,r=i.boundary,a=i.rootBoundary,n=i.padding,o=i.flipVariations,l=i.allowedAutoPlacements,p=void 0===l?h:l,d=T(s),f=d?o?u:u.filter(function(e){return T(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:a,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,u=i.fallbackPlacements,h=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,k=O(S),z=u||(k===S||!b?[G(S)]:function(e){if(O(e)===l)return[];var t=G(e);return[J(e),t,J(t)]}(S)),A=[S].concat(z).reduce(function(e,i){return e.concat(O(i)===l?oe(t,{placement:i,boundary:g,rootBoundary:v,padding:h,flipVariations:b,allowedAutoPlacements:x}):i)},[]),E=t.rects.reference,H=t.rects.popper,M=new Map,B=!0,R=A[0],C=0;C<A.length;C++){var L=A[C],_=O(L),j=T(L)===p,N=[r,a].indexOf(_)>=0,D=N?"width":"height",P=ne(t,{placement:L,boundary:g,rootBoundary:v,altBoundary:y,padding:h}),U=N?j?n:o:j?a:r;E[D]>H[D]&&(U=G(U));var I=G(U),q=[];if(d&&q.push(P[_]<=0),m&&q.push(P[U]<=0,P[I]<=0),q.every(function(e){return e})){R=L,B=!1;break}M.set(L,q)}if(B)for(var F=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 R=t,"break"},W=b?3:1;W>0;W--){if("break"===F(W))break}t.placement!==R&&(t.modifiersData[s]._skip=!0,t.placement=R,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,a,o].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,a=i.offset,l=void 0===a?[0,0]:a,c=h.reduce(function(e,i){return e[i]=function(e,t,i){var s=O(e),a=[o,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)*a,[o,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,u=i.rootBoundary,h=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:u,padding:g,altBoundary:h}),S=O(t.placement),A=T(t.placement),E=!A,H=P(S),M="x"===H?"y":"x",R=t.modifiersData.popperOffsets,C=t.rects.reference,L=t.rects.popper,_="function"==typeof b?b(Object.assign({},t.rects,{placement:t.placement})):b,j="number"==typeof _?{mainAxis:_,altAxis:_}:Object.assign({mainAxis:0,altAxis:0},_),N=t.modifiersData.offset?t.modifiersData.offset[t.placement]:null,I={x:0,y:0};if(R){if(c){var q,F="y"===H?r:o,W="y"===H?a:n,X="y"===H?"height":"width",V=R[H],$=V+x[F],G=V-x[W],Y=y?-L[X]/2:0,J=A===p?C[X]:L[X],K=A===p?-L[X]:-C[X],Q=t.elements.arrow,Z=y&&Q?B(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[F],ie=ee[W],se=U(0,C[X],Z[X]),re=E?C[X]/2-Y-se-te-j.mainAxis:J-se-te-j.mainAxis,ae=E?-C[X]/2+Y+se+ie+j.mainAxis:K+se+ie+j.mainAxis,oe=t.elements.arrow&&D(t.elements.arrow),le=oe?"y"===H?oe.clientTop||0:oe.clientLeft||0:0,ce=null!=(q=null==N?void 0:N[H])?q:0,pe=V+ae-ce,de=U(y?z($,V+re-ce-le):$,V,y?k(G,pe):G);R[H]=de,I[H]=de-V}if(f){var fe,me="x"===H?r:o,ue="x"===H?a:n,he=R[M],ge="y"===M?"height":"width",ve=he+x[me],ye=he-x[ue],we=-1!==[r,o].indexOf(S),be=null!=(fe=null==N?void 0:N[M])?fe:0,xe=we?ve:he-C[ge]-L[ge]-be+j.altAxis,Se=we?he+C[ge]+L[ge]-be-j.altAxis:ye,Oe=y&&we?function(e,t,i){var s=U(e,t,i);return s>i?i:s}(xe,he,Se):U(y?xe:ve,he,y?Se:ye);R[M]=Oe,I[M]=Oe-he}t.modifiersData[s]=I}},requiresIfExists:["offset"]};function me(e,t,i){void 0===i&&(i=!1);var s,r,a=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),o=_(t),l=M(e,n,i),c={scrollLeft:0,scrollTop:0},p={x:0,y:0};return(a||!a&&!i)&&(("body"!==v(t)||Z(o))&&(c=(s=t)!==y(s)&&b(s)?{scrollLeft:(r=s).scrollLeft,scrollTop:r.scrollTop}:K(s)),b(t)?((p=M(t,!0)).x+=t.clientLeft,p.y+=t.clientTop):o&&(p.x=Q(o))),{x:l.left+c.scrollLeft-p.x,y:l.top+c.scrollTop-p.y,width:l.width,height:l.height}}function ue(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 he={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,a=void 0===r?he:r;return function(e,t,i){void 0===i&&(i=a);var r,n,o={placement:"bottom",orderedModifiers:[],options:Object.assign({},he,a),modifiersData:{},elements:{reference:e,popper:t},attributes:{},styles:{}},l=[],c=!1,p={state:o,setOptions:function(i){var r="function"==typeof i?i(o.options):i;d(),o.options=Object.assign({},a,o.options,r),o.scrollParents={reference:w(e)?te(e):e.contextElement?te(e.contextElement):[],popper:te(t)};var n,c,f=function(e){var t=ue(e);return g.reduce(function(e,i){return e.concat(t.filter(function(e){return e.phase===i}))},[])}((n=[].concat(s,o.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 o.orderedModifiers=f.filter(function(e){return e.enabled}),o.orderedModifiers.forEach(function(e){var t=e.name,i=e.options,s=void 0===i?{}:i,r=e.effect;if("function"==typeof r){var a=r({state:o,name:t,instance:p,options:s}),n=function(){};l.push(a||n)}}),p.update()},forceUpdate:function(){if(!c){var e=o.elements,t=e.reference,i=e.popper;if(ge(t,i)){o.rects={reference:me(t,D(i),"fixed"===o.options.strategy),popper:B(i)},o.reset=!1,o.placement=o.options.placement,o.orderedModifiers.forEach(function(e){return o.modifiersData[e.name]=Object.assign({},e.data)});for(var s=0;s<o.orderedModifiers.length;s++)if(!0!==o.reset){var r=o.orderedModifiers[s],a=r.fn,n=r.options,l=void 0===n?{}:n,d=r.name;"function"==typeof a&&(o=a({state:o,options:l,name:d,instance:p})||o)}else o.reset=!1,s=-1}}},update:(r=function(){return new Promise(function(e){p.forceUpdate(),e(o)})},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,a=void 0===r||r,n=s.resize,o=void 0===n||n,l=y(t.elements.popper),c=[].concat(t.scrollParents.reference,t.scrollParents.popper);return a&&c.forEach(function(e){e.addEventListener("scroll",i.update,V)}),o&&l.addEventListener("resize",i.update,V),function(){a&&c.forEach(function(e){e.removeEventListener("scroll",i.update,V)}),o&&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]=ae({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,a=i.adaptive,n=void 0===a||a,o=i.roundOffsets,l=void 0===o||o,c={placement:O(t.placement),variation:T(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,F,{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,a=t.modifiersData.preventOverflow,n=ne(t,{elementContext:"reference"}),o=ne(t,{altBoundary:!0}),l=ce(n,s),c=ce(o,r,a),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
+ `,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
+ `,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"}_initializeDefaults(){this.isPopoverVisible=!1,this.id=`popover-${(Math.random()+1).toString(36).substring(7)}`,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.addEventListener("touchstart",function(){this.toggle(),this.setAttribute("isTouch","true")})}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this.documentClickHandler)}firstUpdated(){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.auroPopover=this.shadowRoot.querySelector("#popover"),this.popper=new we(this.trigger,this.auroPopover,this.placement,this.boundary);const e=()=>{this.toggleShow()},t=()=>{this.toggleHide()},i="AURO-POPOVER"===this.trigger.parentElement.nodeName?this:this.trigger;i.addEventListener("mouseenter",e),i.addEventListener("mouseleave",t),this.trigger.addEventListener("keydown",e=>{const t=e.key.toLowerCase();this.isPopoverVisible&&("tab"!==t&&"escape"!==t||this.toggleHide())," "!==t&&"enter"!==t||this.toggle()}),this.trigger.addEventListener("focus",e),this.trigger.addEventListener("blur",t),this.addEventListener("hidePopover",t)}toggle(){this.isPopoverVisible?this.toggleHide():this.toggleShow()}toggleHide(){this.popper.hide(),this.isPopoverVisible=!1,this.removeAttribute("data-show"),document.querySelector("body").removeEventListener("mouseover",this.mouseoverHandler)}toggleShow(){this.popper.show(),this.isPopoverVisible=!0,this.setAttribute("data-show",!0),this.mouseoverHandler=e=>this.handleMouseoverEvent(e),document.querySelector("body").addEventListener("mouseover",this.mouseoverHandler)}handleMouseoverEvent(e){this.isPopoverVisible&&!e.composedPath().includes(this)&&this.toggleHide()}updated(e){e.has("boundary")&&(this.popper.boundaryElement=this.boundary)}render(){return i`
5
+ <div id="popover" class="popover util_insetLg body-default" aria-live="polite" part="popover">
6
+ <div id="arrow" class="arrow" data-popper-arrow></div>
7
+ <span role="tooltip" aria-labelledby="${this.id}"><slot></slot></span>
8
+ </div>
9
+
10
+ <span id="${this.id}">
11
+ <slot name="trigger" data-trigger-placement="${this.placement}"></slot>
12
+ </span>
13
+ `}}export{Oe as A};