@eunomia/elements 1.0.0-beta.5 → 1.0.0-beta.6

package/dist/cdn/components/eun-toolbar.js

@@ -1,9 +1,12 @@
-import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js";import"./chunks/chunk-UDOZRIJZ.js";import{a as s}from"./chunks/chunk-YYCEPZUN.js";import{a as b}from"./chunks/chunk-VRGRCYIO.js";import{a as v}from"./chunks/chunk-5GKM5DIB.js";import{a as i,f as c,g as h,h as r,j as p,l as d,n as o,p as l,s as u}from"./chunks/chunk-XH6NREVZ.js";var f=h`
+import{a as b}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js";import"./chunks/chunk-UDOZRIJZ.js";import{a as s}from"./chunks/chunk-YYCEPZUN.js";import{a as v}from"./chunks/chunk-BKZGTCMF.js";import{a as r,f as c,h,j as i,l as d,n as p,p as n,r as l,u}from"./chunks/chunk-YITWLCD3.js";var m=h`
   :host {
     --_height: var(--toolbar-height, 72px);
     --_heightCollapsed: var(--toolbar-height-collapsed, 56px);
     --_currentHeight: var(--_height);
-    --_padding: var(--toolbar-padding, 0 24px);
+    --_padding: var(
+      --toolbar-padding,
+      var(--toolbar-padding-block, 0) var(--toolbar-padding-inline, 24px)
+    );
     --_gap: var(--toolbar-gap, 16px);
     --_gapStart: var(--toolbar-gap-start, var(--_gap));
     --_gapCenter: var(--toolbar-gap-center, var(--_gap));
@@ -13,8 +16,14 @@ import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js
       var(--eun-surface-color, #ffffff)
     );
     --_colorLight: var(--toolbar-color-light, var(--eun-text-color, #071621));
-    --_backgroundDark: var(--toolbar-background-dark, #0b1620);
-    --_colorDark: var(--toolbar-color-dark, #f5f7fa);
+    --_backgroundDark: var(
+      --toolbar-background-dark,
+      var(--eun-surface-inverse, #0b1620)
+    );
+    --_colorDark: var(
+      --toolbar-color-dark,
+      var(--eun-text-on-inverse, #f5f7fa)
+    );
     --_background: var(--toolbar-background, var(--_backgroundLight));
     --_color: var(--toolbar-color, var(--_colorLight));
     --_borderColor: var(
@@ -23,17 +32,30 @@ import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js
     );
     --_shadow: var(--toolbar-shadow, none);
     --_zIndex: var(--toolbar-z-index, 100);
-    --_transitionDuration: var(--toolbar-transition-duration, 0.25s);
-    --_logoHeight: var(--toolbar-logo-height, 32px);
+    --_transitionDuration: var(
+      --toolbar-transition-duration,
+      var(--eun-duration-l, 250ms)
+    );
     --_panelSize: var(--toolbar-panel-size, 100%);
     --_panelBackground: var(
       --toolbar-panel-background,
       color-mix(in srgb, var(--_background) 90%, transparent)
     );
     --_panelColor: var(--toolbar-panel-color, var(--_color));
-    --_panelPadding: var(--toolbar-panel-padding, 14px);
+    --_panelPaddingBlock: var(
+      --toolbar-panel-padding,
+      var(--toolbar-panel-padding-block, 14px)
+    );
+    --_panelPaddingInline: var(
+      --toolbar-panel-padding,
+      var(--toolbar-panel-padding-inline, 14px)
+    );
     --_burgerAlign: var(--toolbar-burger-align, center);
-    --_burgerPadding: var(--toolbar-burger-padding, 0 var(--_panelPadding));
+    --_burgerPadding: var(
+      --toolbar-burger-padding,
+      var(--toolbar-burger-padding-block, 0)
+        var(--toolbar-burger-padding-inline, var(--_panelPaddingInline))
+    );
     --_panelGap: var(--toolbar-panel-gap, 8px);
     --_panelBackdropBlur: var(--toolbar-panel-backdrop-blur, 8px);
     --_skipLinksHeight: var(--toolbar-skip-links-height, 40px);
@@ -71,9 +93,8 @@ import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js
   :host([theme="dark"]) {
     --_background: var(--toolbar-background, var(--_backgroundDark));
     --_color: var(--toolbar-color, var(--_colorDark));
-  }
-  :host([theme="dark"]) #logo-image {
-    filter: var(--toolbar-logo-filter-dark, brightness(0) invert(1));
+    --_skipLinksBase: var(--toolbar-background, var(--_backgroundDark));
+    --_skipLinksColor: var(--toolbar-skip-links-color, var(--_color));
   }
 
   #bar {
@@ -90,11 +111,12 @@ import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js
     border-block-end: var(--eun-border-width-s, 1px) solid var(--_borderColor);
     box-shadow: var(--_shadow);
     transition:
-      height var(--_transitionDuration) ease,
-      background-color var(--_transitionDuration) ease,
-      color var(--_transitionDuration) ease,
-      border-color var(--_transitionDuration) ease,
-      box-shadow var(--_transitionDuration) ease;
+      height var(--_transitionDuration) var(--eun-easing-default, ease),
+      background-color var(--_transitionDuration)
+        var(--eun-easing-default, ease),
+      color var(--_transitionDuration) var(--eun-easing-default, ease),
+      border-color var(--_transitionDuration) var(--eun-easing-default, ease),
+      box-shadow var(--_transitionDuration) var(--eun-easing-default, ease);
   }
   :host([transparent-at-top][at-top]) #bar {
     background: transparent;
@@ -137,25 +159,21 @@ import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js
   #center ::slotted(eun-link),
   #end ::slotted(eun-link) {
     --link-padding: var(--eun-space-xs, 4px);
-    --link-background-focus: var(--eun-color-primary-transparent, #3d6fff33);
+    --link-background-focus: var(--eun-color-primary-alpha-20, #3d6fff33);
   }
 
-  #logo-link {
+  #start ::slotted(a) {
     display: inline-flex;
     align-items: center;
     outline-offset: 2px;
     outline: 2px solid transparent;
-    transition: outline 0.2s ease-out;
+    transition: outline var(--eun-duration-m, 200ms)
+      var(--eun-easing-out, ease-out);
     border-radius: var(--eun-border-radius-s);
   }
-  #logo-link:focus-visible {
+  #start ::slotted(a:focus-visible) {
     outline-color: var(--eun-color-primary-500);
   }
-  #logo-image {
-    display: block;
-    height: min(var(--_logoHeight), var(--_currentHeight));
-    width: auto;
-  }
 
   #burger {
     flex-shrink: 0;
@@ -179,8 +197,8 @@ import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js
     transform: translateY(-100%);
     opacity: 0;
     transition:
-      transform var(--_transitionDuration) ease,
-      opacity var(--_transitionDuration) ease;
+      transform var(--_transitionDuration) var(--eun-easing-default, ease),
+      opacity var(--_transitionDuration) var(--eun-easing-default, ease);
   }
   #skip-links:focus-within {
     transform: translateY(0);
@@ -203,7 +221,7 @@ import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js
     --link-color-hover: var(--_skipLinksColor);
     --link-color-focus: var(--_skipLinksColor);
     --link-padding: var(--eun-space-xs, 4px);
-    --link-background-focus: var(--eun-color-secondary-transparent, #edbd6f33);
+    --link-background-focus: var(--eun-color-secondary-alpha-20, #edbd6f33);
     --link-border-radius: var(--eun-border-radius-l, 999px);
   }
 
@@ -214,8 +232,8 @@ import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js
     outline-offset: 2px;
     border-radius: var(--eun-border-radius-l, 999px);
     transition:
-      outline 0.2s ease-out,
-      background 0.2s ease-out;
+      outline var(--eun-duration-m, 200ms) var(--eun-easing-out, ease-out),
+      background var(--eun-duration-m, 200ms) var(--eun-easing-out, ease-out);
   }
 
   #skip-links ::slotted(a:not(:first-child)),
@@ -240,7 +258,7 @@ import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js
   #skip-links ::slotted(a:focus-visible),
   .skip-link:focus-visible {
     outline-color: var(--_skipLinksColor);
-    background: var(--eun-color-secondary-transparent, #edbd6f33);
+    background: var(--eun-color-secondary-alpha-20, #edbd6f33);
   }
 
   #panel {
@@ -291,7 +309,8 @@ import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js
     height: calc(var(--_currentHeight) - var(--eun-border-width-s, 1px));
     padding: var(--_burgerPadding);
     pointer-events: auto;
-    transition: height var(--_transitionDuration) ease;
+    transition: height var(--_transitionDuration)
+      var(--eun-easing-default, ease);
   }
 
   #panel-body {
@@ -299,7 +318,7 @@ import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js
     inset: 0;
     display: flex;
     flex-direction: column;
-    padding: var(--_panelPadding);
+    padding: var(--_panelPaddingBlock) var(--_panelPaddingInline);
     background: var(--_panelBackground);
     backdrop-filter: blur(var(--_panelBackdropBlur));
     -webkit-backdrop-filter: blur(var(--_panelBackdropBlur));
@@ -308,8 +327,8 @@ import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js
     opacity: 0;
     pointer-events: none;
     transition:
-      opacity var(--_transitionDuration) ease,
-      transform var(--_transitionDuration) ease;
+      opacity var(--_transitionDuration) var(--eun-easing-default, ease),
+      transform var(--_transitionDuration) var(--eun-easing-default, ease);
   }
   #panel[data-direction="top"] #panel-body {
     transform: translateY(-100%);
@@ -362,10 +381,10 @@ import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js
       transition-duration: 0.01ms;
     }
   }
-`,k=f;var y="eun-toolbar",t=class extends g(u){constructor(){super(...arguments);this.position="sticky";this.logoAlt="Home";this.logoHref="#";this.mobileBreakpoint=b.tablet;this.open=!1;this.panelDirection="top";this.closeOnBackdrop=!0;this.ariaLabelMenuOpen="Open menu";this.ariaLabelMenuClose="Close menu";this.ariaLabelMenu="Menu";this.collapseOnScroll=!1;this.collapseThreshold=24;this.collapsed=!1;this.transparentAtTop=!1;this.atTop=!0;this.adaptiveTheme=!1;this.adaptiveThemeSelector="[data-toolbar-theme]";this.theme="light";this.defaultTheme="light";this.skipLinkLabel="Skip to main content";this.mobile=!1;this.handleIconSlotChange=()=>{this.requestUpdate()};this.scrollTargetEl=window;this.scrollListenerAttached=!1;this.intersectingThemeEls=new Set;this.handleMediaChange=e=>{this.mobile=e.matches,!this.mobile&&this.open&&this.hide()};this.handleScroll=()=>{this.scrollRafId===void 0&&(this.scrollRafId=requestAnimationFrame(()=>{this.scrollRafId=void 0,this.updateScrollState()}))};this.handleThemeIntersect=e=>{for(let a of e)a.isIntersecting?this.intersectingThemeEls.add(a.target):this.intersectingThemeEls.delete(a.target);this.resolveAdaptiveTheme()};this.handleLogoClick=e=>{v(this,e,this.logoHref,"_self")};this.handlePanelToggle=e=>{let a=e;if(this.syncingFromPopover=!0,this.open=a.newState==="open",this.syncingFromPopover=!1,this.open){this.openDialogSurface({surfaceEl:this.panelEl,onEscape:()=>this.hide(),onOutsideClick:()=>{this.closeOnBackdrop&&this.hide()}}),this.dispatchEvent(new s),this.updateComplete.then(()=>this.focusInitialElement());return}this.closeDialogSurface(this.burgerEl),this.dispatchEvent(new s)};this.handleSkipLinkClick=e=>{let n=e.composedPath().find(m=>m instanceof HTMLAnchorElement)?.getAttribute("href");!n||!n.startsWith("#")||n.length<2||document.getElementById(n.slice(1))?.focus()}}connectedCallback(){super.connectedCallback(),this.updateMediaQuery(),this.syncScrollListener()}disconnectedCallback(){this.mediaQueryList?.removeEventListener("change",this.handleMediaChange),this.detachScrollListener(),this.teardownAdaptiveThemeObserver(),this.teardownDialogSurface(this.open),super.disconnectedCallback()}updated(e){super.updated(e),e.has("mobileBreakpoint")&&this.updateMediaQuery(),e.has("open")&&this.syncPopoverOpenState(this.open,this.panelEl),e.has("panelSize")&&(this.panelSize?this.style.setProperty("--toolbar-panel-size",this.panelSize):this.style.removeProperty("--toolbar-panel-size")),this.updateScrollListenerFor(e),this.updateAdaptiveThemeObserverFor(e)}updateScrollListenerFor(e){(e.has("collapseOnScroll")||e.has("transparentAtTop"))&&this.syncScrollListener(),e.has("scrollTarget")&&this.scrollListenerAttached&&this.attachScrollListener()}updateAdaptiveThemeObserverFor(e){if(e.has("adaptiveTheme")){this.adaptiveTheme?this.setupAdaptiveThemeObserver():(this.teardownAdaptiveThemeObserver(),this.theme=this.defaultTheme);return}this.adaptiveTheme&&(e.has("adaptiveThemeSelector")||e.has("collapsed")||e.has("scrollTarget"))&&this.setupAdaptiveThemeObserver()}show(){this.open=!0}hide(){this.open=!1}toggle(){this.open=!this.open}refreshAdaptiveTheme(){this.themeObserver&&(this.themeObserver.disconnect(),this.intersectingThemeEls.clear(),document.querySelectorAll(this.adaptiveThemeSelector).forEach(e=>this.themeObserver?.observe(e)),this.resolveAdaptiveTheme())}updateMediaQuery(){this.mediaQueryList?.removeEventListener("change",this.handleMediaChange),this.mediaQueryList=window.matchMedia(`(max-width: ${Math.max(this.mobileBreakpoint-1,0)}px)`),this.mediaQueryList.addEventListener("change",this.handleMediaChange),this.mobile=this.mediaQueryList.matches}resolveScrollTarget(){if(this.scrollTarget){let e=document.querySelector(this.scrollTarget);if(e)return e}return window}resolveIntersectionRoot(){if(this.scrollTarget){let e=document.querySelector(this.scrollTarget);if(e)return e}return null}syncScrollListener(){let e=this.collapseOnScroll||this.transparentAtTop;e&&!this.scrollListenerAttached?(this.attachScrollListener(),this.scrollListenerAttached=!0):!e&&this.scrollListenerAttached&&(this.detachScrollListener(),this.scrollListenerAttached=!1)}attachScrollListener(){this.scrollTargetEl?.removeEventListener("scroll",this.handleScroll),this.scrollTargetEl=this.resolveScrollTarget(),this.scrollTargetEl.addEventListener("scroll",this.handleScroll,{passive:!0}),this.updateScrollState()}detachScrollListener(){this.scrollTargetEl?.removeEventListener("scroll",this.handleScroll),this.scrollRafId!==void 0&&(cancelAnimationFrame(this.scrollRafId),this.scrollRafId=void 0)}currentScrollY(){return this.scrollTargetEl instanceof Element?this.scrollTargetEl.scrollTop:window.scrollY}updateScrollState(){let e=this.currentScrollY();this.collapseOnScroll&&this.setCollapsed(e>this.collapseThreshold),this.transparentAtTop&&(this.atTop=e<=0)}setCollapsed(e){this.collapsed!==e&&(this.collapsed=e,this.dispatchEvent(new s))}setTheme(e){this.theme!==e&&(this.theme=e,this.dispatchEvent(new s))}barHeightPx(){return this.barEl?.getBoundingClientRect().height??(this.collapsed?56:72)}setupAdaptiveThemeObserver(){this.teardownAdaptiveThemeObserver();let e=this.barHeightPx();this.themeObserver=new IntersectionObserver(this.handleThemeIntersect,{root:this.resolveIntersectionRoot(),rootMargin:`-${e}px 0px -85% 0px`}),document.querySelectorAll(this.adaptiveThemeSelector).forEach(a=>this.themeObserver?.observe(a)),this.resolveAdaptiveTheme()}teardownAdaptiveThemeObserver(){this.themeObserver?.disconnect(),this.themeObserver=void 0,this.intersectingThemeEls.clear()}resolveAdaptiveTheme(){if(this.intersectingThemeEls.size===0){this.setTheme(this.defaultTheme);return}let e=document.querySelectorAll(this.adaptiveThemeSelector);for(let a=e.length-1;a>=0;a-=1)if(this.intersectingThemeEls.has(e[a])){this.setTheme(e[a].getAttribute("data-toolbar-theme")==="dark"?"dark":"light");return}this.setTheme(this.defaultTheme)}focusInitialElement(){let e=this.querySelector("[autofocus]");if(e){e.focus();return}this.panelEl?.focus()}hasSkipLinksContent(){return this.skipLinkTarget!==void 0||this.querySelector('[slot="skip-links"]')!==null}renderSkipLinks(){return o`
+`,g=m;var f="eun-toolbar",t=class extends b(u){constructor(){super(...arguments);this.position="sticky";this.mobileBreakpoint=v.tablet;this.open=!1;this.panelDirection="top";this.closeOnBackdrop=!0;this.ariaLabelMenuOpen="Open menu";this.ariaLabelMenuClose="Close menu";this.ariaLabelMenu="Menu";this.collapseOnScroll=!1;this.collapseThreshold=24;this.collapsed=!1;this.transparentAtTop=!1;this.atTop=!0;this.adaptiveTheme=!1;this.adaptiveThemeSelector="[data-toolbar-theme]";this.theme="light";this.defaultTheme="light";this.skipLinkLabel="Skip to main content";this.mobile=!1;this.handleIconSlotChange=()=>{this.requestUpdate()};this.scrollTargetEl=window;this.scrollListenerAttached=!1;this.intersectingThemeEls=new Set;this.handleMediaChange=e=>{this.mobile=e.matches,!this.mobile&&this.open&&this.hide()};this.handleScroll=()=>{this.scrollRafId===void 0&&(this.scrollRafId=requestAnimationFrame(()=>{this.scrollRafId=void 0,this.updateScrollState()}))};this.handleThemeIntersect=e=>{for(let a of e)a.isIntersecting?this.intersectingThemeEls.add(a.target):this.intersectingThemeEls.delete(a.target);this.resolveAdaptiveTheme()};this.handlePanelToggle=e=>{let a=e;if(this.syncingFromPopover=!0,this.open=a.newState==="open",this.syncingFromPopover=!1,this.open){this.openDialogSurface({surfaceEl:this.panelEl,onEscape:()=>this.hide(),onOutsideClick:()=>{this.closeOnBackdrop&&this.hide()}}),this.dispatchEvent(new s),this.updateComplete.then(()=>this.focusInitialElement());return}this.closeDialogSurface(this.burgerEl),this.dispatchEvent(new s)};this.handleSkipLinkClick=e=>{let o=e.composedPath().find(k=>k instanceof HTMLAnchorElement)?.getAttribute("href");!o||!o.startsWith("#")||o.length<2||document.getElementById(o.slice(1))?.focus()}}connectedCallback(){super.connectedCallback(),this.updateMediaQuery(),this.syncScrollListener()}disconnectedCallback(){this.mediaQueryList?.removeEventListener("change",this.handleMediaChange),this.detachScrollListener(),this.teardownAdaptiveThemeObserver(),this.teardownDialogSurface(this.open),super.disconnectedCallback()}updated(e){super.updated(e),e.has("mobileBreakpoint")&&this.updateMediaQuery(),e.has("open")&&this.syncPopoverOpenState(this.open,this.panelEl),e.has("panelSize")&&(this.panelSize?this.style.setProperty("--toolbar-panel-size",this.panelSize):this.style.removeProperty("--toolbar-panel-size")),this.updateScrollListenerFor(e),this.updateAdaptiveThemeObserverFor(e)}updateScrollListenerFor(e){(e.has("collapseOnScroll")||e.has("transparentAtTop"))&&this.syncScrollListener(),e.has("scrollTarget")&&this.scrollListenerAttached&&this.attachScrollListener()}updateAdaptiveThemeObserverFor(e){if(e.has("adaptiveTheme")){this.adaptiveTheme?this.setupAdaptiveThemeObserver():e.get("adaptiveTheme")===!0&&(this.teardownAdaptiveThemeObserver(),this.theme=this.defaultTheme);return}this.adaptiveTheme&&(e.has("adaptiveThemeSelector")||e.has("collapsed")||e.has("scrollTarget"))&&this.setupAdaptiveThemeObserver()}show(){this.open=!0}hide(){this.open=!1}toggle(){this.open=!this.open}refreshAdaptiveTheme(){this.themeObserver&&(this.themeObserver.disconnect(),this.intersectingThemeEls.clear(),document.querySelectorAll(this.adaptiveThemeSelector).forEach(e=>this.themeObserver?.observe(e)),this.resolveAdaptiveTheme())}updateMediaQuery(){this.mediaQueryList?.removeEventListener("change",this.handleMediaChange),this.mediaQueryList=window.matchMedia(`(width < ${this.mobileBreakpoint}px)`),this.mediaQueryList.addEventListener("change",this.handleMediaChange),this.mobile=this.mediaQueryList.matches}resolveScrollTarget(){if(this.scrollTarget){let e=document.querySelector(this.scrollTarget);if(e)return e}return window}resolveIntersectionRoot(){if(this.scrollTarget){let e=document.querySelector(this.scrollTarget);if(e)return e}return null}syncScrollListener(){let e=this.collapseOnScroll||this.transparentAtTop;e&&!this.scrollListenerAttached?(this.attachScrollListener(),this.scrollListenerAttached=!0):!e&&this.scrollListenerAttached&&(this.detachScrollListener(),this.scrollListenerAttached=!1)}attachScrollListener(){this.scrollTargetEl?.removeEventListener("scroll",this.handleScroll),this.scrollTargetEl=this.resolveScrollTarget(),this.scrollTargetEl.addEventListener("scroll",this.handleScroll,{passive:!0}),this.updateScrollState()}detachScrollListener(){this.scrollTargetEl?.removeEventListener("scroll",this.handleScroll),this.scrollRafId!==void 0&&(cancelAnimationFrame(this.scrollRafId),this.scrollRafId=void 0)}currentScrollY(){return this.scrollTargetEl instanceof Element?this.scrollTargetEl.scrollTop:window.scrollY}updateScrollState(){let e=this.currentScrollY();this.collapseOnScroll&&this.setCollapsed(e>this.collapseThreshold),this.transparentAtTop&&(this.atTop=e<=0)}setCollapsed(e){this.collapsed!==e&&(this.collapsed=e,this.dispatchEvent(new s))}setTheme(e){this.theme!==e&&(this.theme=e,this.dispatchEvent(new s))}barHeightPx(){return this.barEl?.getBoundingClientRect().height??(this.collapsed?56:72)}setupAdaptiveThemeObserver(){this.teardownAdaptiveThemeObserver();let e=this.barHeightPx();this.themeObserver=new IntersectionObserver(this.handleThemeIntersect,{root:this.resolveIntersectionRoot(),rootMargin:`-${e}px 0px -85% 0px`}),document.querySelectorAll(this.adaptiveThemeSelector).forEach(a=>this.themeObserver?.observe(a)),this.resolveAdaptiveTheme()}teardownAdaptiveThemeObserver(){this.themeObserver?.disconnect(),this.themeObserver=void 0,this.intersectingThemeEls.clear()}resolveAdaptiveTheme(){if(this.intersectingThemeEls.size===0){this.setTheme(this.defaultTheme);return}let e=document.querySelectorAll(this.adaptiveThemeSelector);for(let a=e.length-1;a>=0;a-=1)if(this.intersectingThemeEls.has(e[a])){this.setTheme(e[a].getAttribute("data-toolbar-theme")==="dark"?"dark":"light");return}this.setTheme(this.defaultTheme)}focusInitialElement(){let e=this.querySelector("[autofocus]");if(e){e.focus();return}this.panelEl?.focus()}hasSkipLinksContent(){return this.skipLinkTarget!==void 0||this.querySelector('[slot="skip-links"]')!==null}renderSkipLinks(){return n`
       <div id="skip-links" @click=${this.handleSkipLinkClick}>
         <slot name="skip-links">
-          ${this.skipLinkTarget?o`
+          ${this.skipLinkTarget?n`
                 <a
                   id="skip-link"
                   class="skip-link"
@@ -376,20 +395,11 @@ import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js
               `:l}
         </slot>
       </div>
-    `}renderStart(){return o`
+    `}renderStart(){return n`
       <div id="start">
-        ${this.logoSrc?o`
-              <a
-                id="logo-link"
-                href=${this.logoHref}
-                @click=${this.handleLogoClick}
-              >
-                <img id="logo-image" src=${this.logoSrc} alt=${this.logoAlt} />
-              </a>
-            `:l}
         <slot name="start"></slot>
       </div>
-    `}renderEnd(){return o` <div id="end"><slot name="end"></slot></div> `}renderBurger(){let e=this.open?"close-icon":"menu-icon",a=this.open?"close":"menu",n=this.open?this.closeIconSlotEls.length:this.menuIconSlotEls.length;return o`
+    `}renderEnd(){return n` <div id="end"><slot name="end"></slot></div> `}renderBurger(){let e=this.open?"close-icon":"menu-icon",a=this.open?"close":"menu",o=this.open?this.closeIconSlotEls.length:this.menuIconSlotEls.length;return n`
       <eun-button
         id="burger"
         appearance="ghost"
@@ -400,10 +410,10 @@ import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js
         @click=${()=>this.toggle()}
       >
         <slot name=${e} @slotchange=${this.handleIconSlotChange}>
-          ${n?l:o`<eun-icon name=${a} size="20"></eun-icon>`}
+          ${o?l:n`<eun-icon name=${a} size="20"></eun-icon>`}
         </slot>
       </eun-button>
-    `}renderPanel(){return o`
+    `}renderPanel(){return n`
       <div
         id="panel"
         popover="manual"
@@ -419,7 +429,7 @@ import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js
           <div id="panel-content"><slot></slot></div>
         </div>
       </div>
-    `}render(){return o`
+    `}render(){return n`
       ${this.hasSkipLinksContent()?this.renderSkipLinks():l}
       <nav id="bar" aria-label=${this.ariaLabel??"Main navigation"}>
         ${this.renderStart()}
@@ -427,4 +437,4 @@ import{a as g}from"./chunks/chunk-N6ZW5CDN.js";import"./chunks/chunk-RIFF2D2F.js
         ${this.renderEnd()}
       </nav>
       ${this.mobile?this.renderPanel():l}
-    `}};t.styles=k,i([r({reflect:!0})],t.prototype,"position",2),i([r({attribute:"logo-src"})],t.prototype,"logoSrc",2),i([r({attribute:"logo-alt"})],t.prototype,"logoAlt",2),i([r({attribute:"logo-href"})],t.prototype,"logoHref",2),i([r({type:Number,attribute:"mobile-breakpoint"})],t.prototype,"mobileBreakpoint",2),i([r({type:Boolean,reflect:!0})],t.prototype,"open",2),i([r({reflect:!0,attribute:"panel-direction"})],t.prototype,"panelDirection",2),i([r({attribute:"panel-size"})],t.prototype,"panelSize",2),i([r({type:Boolean,attribute:"close-on-backdrop"})],t.prototype,"closeOnBackdrop",2),i([r({attribute:"aria-label-menu-open"})],t.prototype,"ariaLabelMenuOpen",2),i([r({attribute:"aria-label-menu-close"})],t.prototype,"ariaLabelMenuClose",2),i([r({attribute:"aria-label-menu"})],t.prototype,"ariaLabelMenu",2),i([r({type:Boolean,attribute:"collapse-on-scroll"})],t.prototype,"collapseOnScroll",2),i([r({type:Number,attribute:"collapse-threshold"})],t.prototype,"collapseThreshold",2),i([r({type:Boolean,reflect:!0})],t.prototype,"collapsed",2),i([r({type:Boolean,attribute:"transparent-at-top"})],t.prototype,"transparentAtTop",2),i([r({type:Boolean,reflect:!0,attribute:"at-top"})],t.prototype,"atTop",2),i([r({attribute:"scroll-target"})],t.prototype,"scrollTarget",2),i([r({type:Boolean,attribute:"adaptive-theme"})],t.prototype,"adaptiveTheme",2),i([r({attribute:"adaptive-theme-selector"})],t.prototype,"adaptiveThemeSelector",2),i([r({reflect:!0})],t.prototype,"theme",2),i([r({attribute:"default-theme"})],t.prototype,"defaultTheme",2),i([r({attribute:"skip-link-target"})],t.prototype,"skipLinkTarget",2),i([r({attribute:"skip-link-label"})],t.prototype,"skipLinkLabel",2),i([r({type:Boolean,reflect:!0})],t.prototype,"mobile",2),i([p("#bar")],t.prototype,"barEl",2),i([p("#panel")],t.prototype,"panelEl",2),i([p("#burger")],t.prototype,"burgerEl",2),i([d({slot:"menu-icon"})],t.prototype,"menuIconSlotEls",2),i([d({slot:"close-icon"})],t.prototype,"closeIconSlotEls",2),t=i([c(y)],t);export{t as EunomiaToolbar,y as EunomiaToolbarTagName};
+    `}};t.styles=g,r([i({reflect:!0})],t.prototype,"position",2),r([i({type:Number,attribute:"mobile-breakpoint"})],t.prototype,"mobileBreakpoint",2),r([i({type:Boolean,reflect:!0})],t.prototype,"open",2),r([i({reflect:!0,attribute:"panel-direction"})],t.prototype,"panelDirection",2),r([i({attribute:"panel-size"})],t.prototype,"panelSize",2),r([i({type:Boolean,attribute:"close-on-backdrop"})],t.prototype,"closeOnBackdrop",2),r([i({attribute:"aria-label-menu-open"})],t.prototype,"ariaLabelMenuOpen",2),r([i({attribute:"aria-label-menu-close"})],t.prototype,"ariaLabelMenuClose",2),r([i({attribute:"aria-label-menu"})],t.prototype,"ariaLabelMenu",2),r([i({type:Boolean,attribute:"collapse-on-scroll"})],t.prototype,"collapseOnScroll",2),r([i({type:Number,attribute:"collapse-threshold"})],t.prototype,"collapseThreshold",2),r([i({type:Boolean,reflect:!0})],t.prototype,"collapsed",2),r([i({type:Boolean,attribute:"transparent-at-top"})],t.prototype,"transparentAtTop",2),r([i({type:Boolean,reflect:!0,attribute:"at-top"})],t.prototype,"atTop",2),r([i({attribute:"scroll-target"})],t.prototype,"scrollTarget",2),r([i({type:Boolean,attribute:"adaptive-theme"})],t.prototype,"adaptiveTheme",2),r([i({attribute:"adaptive-theme-selector"})],t.prototype,"adaptiveThemeSelector",2),r([i({reflect:!0})],t.prototype,"theme",2),r([i({attribute:"default-theme"})],t.prototype,"defaultTheme",2),r([i({attribute:"skip-link-target"})],t.prototype,"skipLinkTarget",2),r([i({attribute:"skip-link-label"})],t.prototype,"skipLinkLabel",2),r([i({type:Boolean,reflect:!0})],t.prototype,"mobile",2),r([d("#bar")],t.prototype,"barEl",2),r([d("#panel")],t.prototype,"panelEl",2),r([d("#burger")],t.prototype,"burgerEl",2),r([p({slot:"menu-icon"})],t.prototype,"menuIconSlotEls",2),r([p({slot:"close-icon"})],t.prototype,"closeIconSlotEls",2),t=r([c(f)],t);export{t as EunomiaToolbar,f as EunomiaToolbarTagName};

package/dist/cdn/components/eun-tooltip.js

@@ -1,8 +1,8 @@
-import{c as y}from"./chunks/chunk-CEDHJUUH.js";import{a as C}from"./chunks/chunk-LK5BJ4SH.js";import{a as m}from"./chunks/chunk-LYYQAALT.js";import{e as T}from"./chunks/chunk-LGLQ36QB.js";import{a as f}from"./chunks/chunk-A4EQSU36.js";import"./chunks/chunk-SGM2X2TC.js";import{a as v}from"./chunks/chunk-5EVP7YNE.js";import{a,f as E,g as c,h as l,l as S,m as u,n as h,p as A,r as _,s as P}from"./chunks/chunk-XH6NREVZ.js";var L=c`
+import{c as g}from"./chunks/chunk-EUWUDCBZ.js";import{a as C}from"./chunks/chunk-LK5BJ4SH.js";import{b as k,c as y}from"./chunks/chunk-624VJYNA.js";import{a as m}from"./chunks/chunk-LYYQAALT.js";import{e as L}from"./chunks/chunk-GDBPWZN6.js";import{a as v}from"./chunks/chunk-PPCHQG7P.js";import{a as f}from"./chunks/chunk-O7PHBLH2.js";import"./chunks/chunk-SGM2X2TC.js";import{a,f as S,h as c,j as l,n as A,o as u,p as h,r as _,t as P,u as T}from"./chunks/chunk-YITWLCD3.js";var D=c`
   :host {
     display: contents;
   }
-`,R=c`
+`,N=c`
   /*
    * Step 1 : the palette (severity, else color) fills --_solid (strong
    * color), --_onSolid (text on it) and --_accent (text on a pale or neutral
@@ -62,7 +62,9 @@ import{c as y}from"./chunks/chunk-CEDHJUUH.js";import{a as C}from"./chunks/chunk
     --_onSolid: var(--eun-color-grey-900, #000000);
     --_opposite: var(--eun-color-grey-800, #071621);
   }
-  .eun-tooltip-panel:not([data-severity])[data-color="light"][data-fixed-color] {
+  .eun-tooltip-panel:not(
+      [data-severity]
+    )[data-color="light"][data-fixed-color] {
     --_solid: #ffffff;
     --_onSolid: #000000;
     --_opposite: #071621;
@@ -110,14 +112,22 @@ import{c as y}from"./chunks/chunk-CEDHJUUH.js";import{a as C}from"./chunks/chunk
     --_body: var(--_onSolid);
     --_bd: transparent;
   }
-  .eun-tooltip-panel:not([data-severity])[data-color="light"][data-appearance="default"],
-  .eun-tooltip-panel:not([data-severity])[data-color="dark"][data-appearance="default"] {
+  .eun-tooltip-panel:not(
+      [data-severity]
+    )[data-color="light"][data-appearance="default"],
+  .eun-tooltip-panel:not(
+      [data-severity]
+    )[data-color="dark"][data-appearance="default"] {
     --_bg: var(--_solid);
     --_head: var(--_onSolid);
     --_body: var(--_onSolid);
   }
-  .eun-tooltip-panel:not([data-severity])[data-color="light"][data-appearance="outline"],
-  .eun-tooltip-panel:not([data-severity])[data-color="dark"][data-appearance="outline"] {
+  .eun-tooltip-panel:not(
+      [data-severity]
+    )[data-color="light"][data-appearance="outline"],
+  .eun-tooltip-panel:not(
+      [data-severity]
+    )[data-color="dark"][data-appearance="outline"] {
     --_bg: var(--_opposite);
     --_head: var(--_solid);
     --_body: var(--_solid);
@@ -137,8 +147,14 @@ import{c as y}from"./chunks/chunk-CEDHJUUH.js";import{a as C}from"./chunks/chunk
     max-width: var(--tooltip-max-width, 280px);
     padding: var(
       --tooltip-padding,
-      max(0px, calc(var(--eun-space-s, 8px) - var(--_bw)))
-        max(0px, calc(var(--eun-space-m, 16px) - var(--_bw)))
+      var(
+          --tooltip-padding-block,
+          max(0px, calc(var(--eun-space-s, 8px) - var(--_bw)))
+        )
+        var(
+          --tooltip-padding-inline,
+          max(0px, calc(var(--eun-space-m, 16px) - var(--_bw)))
+        )
     );
     border-radius: var(
       --tooltip-border-radius,
@@ -209,7 +225,7 @@ import{c as y}from"./chunks/chunk-CEDHJUUH.js";import{a as C}from"./chunks/chunk
     margin: 0;
     color: inherit;
   }
-`,g=R,H=c`
+`,b=N,$=c`
   @supports (anchor-name: --a) {
     .eun-tooltip-panel[data-placement="top"]:popover-open {
       position-try-fallbacks: --eun-tooltip-try-bottom;
@@ -263,7 +279,7 @@ import{c as y}from"./chunks/chunk-CEDHJUUH.js";import{a as C}from"./chunks/chunk
       right: calc(anchor(left) + var(--tooltip-gap, 8px));
     }
   }
-`,b=H;var N="eun-tooltip",$=0,V=0,D=new WeakSet,B=["--tooltip-z-index","--tooltip-gap","--tooltip-viewport-gap","--tooltip-min-width","--tooltip-max-width","--tooltip-background-color","--tooltip-color","--tooltip-content-color","--tooltip-border-color","--tooltip-border-width","--tooltip-font-weight","--tooltip-border-radius","--tooltip-padding","--tooltip-row-gap","--tooltip-shadow","--tooltip-transition-duration"],M=C(P),o=class extends M{constructor(){super(...arguments);this.color="primary";this.appearance="default";this.fixedColor=!1;this.placement="top";this.open=!1;this.lazy=!1;this.showDelay=100;this.hideDelay=150;this.pinned=!1;this.panelId=`eun-tooltip-panel-${++V}`;this.headingId=`${this.panelId}-heading`;this.ariaDescribedByApplied=!1;this.handleReposition=()=>{this.reposition()};this.handleDocumentKeydown=e=>{e.key==="Escape"&&this.hide()};this.handleDocumentPointerDown=e=>{if(!this.pinned)return;let t=e.composedPath();this.anchorEl&&t.includes(this.anchorEl)||this.panelEl&&t.includes(this.panelEl)||this.hide()};this.handleAnchorSlotChange=()=>{this.rebindAnchorListeners()};this.handleAnchorPointerEnter=()=>{this.scheduleShow()};this.handleAnchorPointerLeave=()=>{this.scheduleHide()};this.handleAnchorFocusIn=()=>{this.clearShowTimer(),this.clearHideTimer(),this.show()};this.handleAnchorFocusOut=()=>{this.pinned=!1,this.hide()};this.handleAnchorClick=()=>{this.pinned=!this.pinned,this.pinned?(this.clearShowTimer(),this.clearHideTimer(),this.show()):this.scheduleHide()};this.handlePanelPointerEnter=()=>{this.clearHideTimer()};this.handlePanelPointerLeave=()=>{this.scheduleHide()};this.handleSlotChange=()=>{this.requestUpdate()}}supportsAnchorPositioning(){return o.nativeAnchorPositioningSupported}connectedCallback(){super.connectedCallback(),this.hasUpdated&&!this.lazy&&this.ensurePortal()}firstUpdated(e){super.firstUpdated(e),this.rebindAnchorListeners(),this.lazy||this.ensurePortal()}disconnectedCallback(){this.unbindAnchorListeners(),this.clearShowTimer(),this.clearHideTimer(),this.panelAnimation?.cancel(),this.panelAnimation=void 0,this.removeGlobalListeners(),this.portalContainer?.remove(),this.portalContainer=void 0,this.portalRoot=void 0,this.panelEl=void 0,super.disconnectedCallback?.()}updated(e){if(super.updated(e),this.portalContainer&&this.renderPortal(),e.has("open")){this.open?this.openTooltip():this.closeTooltip();return}e.has("placement")&&this.open&&this.reposition()}show(){this.open=!0}hide(){this.open=!1}toggle(){this.open=!this.open}get anchorEl(){return this.anchorSlotEls[0]}ensurePortal(){if(this.portalContainer||!this.anchorEl)return;let e=this.anchorEl.getRootNode();this.portalRoot=e,this.installPanelStyles(e);let t=document.createElement("div");t.style.display="contents",(e===document?document.body:e).appendChild(t),this.portalContainer=t,this.renderPortal()}installPanelStyles(e){if(D.has(e)||!g.styleSheet)return;D.add(e);let t=[g.styleSheet];!m&&b.styleSheet&&t.push(b.styleSheet),e.adoptedStyleSheets=[...e.adoptedStyleSheets,...t]}renderPortal(){this.portalContainer&&(_(this.renderPanel(),this.portalContainer,{host:this}),this.panelEl=this.portalContainer.querySelector(".eun-tooltip-panel")??void 0,this.forwardCssVariables(),this.mirrorSlottedContent())}forwardCssVariables(){if(!this.panelEl)return;let e=getComputedStyle(this);for(let t of B)this.panelEl.style.setProperty(t,e.getPropertyValue(t))}openTooltip(){if(this.ensurePortal(),!this.anchorEl||!this.panelEl)return;this.applyAriaDescribedBy();let e=this.panelEl,t=this.panelAnimation!==void 0;this.panelAnimation?.cancel(),this.panelAnimation=void 0;let n=!e.matches(":popover-open");n&&e.showPopover(),this.reposition(),(n||t)&&this.playEnterAnimation(e),window.addEventListener("resize",this.handleReposition),window.addEventListener("scroll",this.handleReposition,!0),document.addEventListener("keydown",this.handleDocumentKeydown),document.addEventListener("pointerdown",this.handleDocumentPointerDown,!0),this.observeAnchorVisibility(this.anchorEl,()=>this.hide())}closeTooltip(){this.pinned=!1;let e=this.panelEl;this.panelAnimation?.cancel(),this.panelAnimation=void 0,e?.matches(":popover-open")&&this.playExitAnimation(e),this.removeGlobalListeners(),this.unobserveAnchorVisibility()}static panelAnimationDuration(e){if(window.matchMedia("(prefers-reduced-motion: reduce)").matches)return 0;let t=getComputedStyle(e).getPropertyValue("--tooltip-transition-duration").trim();if(t){let n=t.endsWith("ms")?Number.parseFloat(t):Number.parseFloat(t)*1e3;if(Number.isFinite(n)&&n>=0)return n}return 150}playEnterAnimation(e){e.style.removeProperty("pointer-events");let t=o.panelAnimationDuration(e);t!==0&&(this.panelAnimation=e.animate([{opacity:0,scale:.96},{opacity:1,scale:1}],{duration:t,easing:"ease",fill:"forwards"}))}playExitAnimation(e){e.style.pointerEvents="none";let t=o.panelAnimationDuration(e);if(t===0){e.hidePopover();return}let n=e.animate([{opacity:1,scale:1},{opacity:0,scale:.96}],{duration:t,easing:"ease",fill:"forwards"});this.panelAnimation=n,n.finished.then(()=>{this.panelAnimation===n&&(this.panelAnimation=void 0),e.hidePopover()}).catch(()=>{})}removeGlobalListeners(){window.removeEventListener("resize",this.handleReposition),window.removeEventListener("scroll",this.handleReposition,!0),document.removeEventListener("keydown",this.handleDocumentKeydown),document.removeEventListener("pointerdown",this.handleDocumentPointerDown,!0)}reposition(){!this.anchorEl||!this.panelEl||(this.supportsAnchorPositioning()?(this.anchorPositionName??=`--eun-tooltip-anchor-${++$}`,this.anchorEl.style.setProperty("anchor-name",this.anchorPositionName),this.panelEl.style.setProperty("position-anchor",this.anchorPositionName)):this.updateFallbackPosition(),this.clampPanelToViewport())}getEffectivePlacementFallback(e,t,n,i){let r=this.readGap();if(this.placement==="left"||this.placement==="right"){let k=window.innerWidth,w=e.right+r+t.width<=k,x=e.left-r-t.width>=0;return this.placement==="right"&&!w&&x?"left":this.placement==="left"&&!x&&w?"right":this.placement}let p=window.innerHeight,d=e.bottom+r+t.height<=p-i,s=e.top-r-t.height>=n;return this.placement==="top"&&!s&&d?"bottom":this.placement==="bottom"&&!d&&s?"top":this.placement}updateFallbackPosition(){if(!this.anchorEl||!this.panelEl)return;let e=this.readGap(),t=this.readViewportInset(this.panelEl,"--eun-viewport-inset-top"),n=this.readViewportInset(this.panelEl,"--eun-viewport-inset-bottom"),i=this.anchorEl.getBoundingClientRect(),r=this.panelEl.getBoundingClientRect(),p=this.getEffectivePlacementFallback(i,r,t,n),d,s;p==="top"||p==="bottom"?(d=p==="top"?i.top-r.height-e:i.bottom+e,s=y(i.left+i.width/2-r.width/2,r.width,window.innerWidth,e)):(s=p==="left"?i.left-r.width-e:i.right+e,d=y(i.top+i.height/2-r.height/2,r.height,window.innerHeight,e)),this.panelEl.style.setProperty("--_panelTop",`${d}px`),this.panelEl.style.setProperty("--_panelLeft",`${s}px`)}clampPanelToViewport(){if(!this.panelEl)return;let e=this.readPixelVar("--tooltip-viewport-gap",8),t=this.readViewportInset(this.panelEl,"--eun-viewport-inset-top"),n=this.readViewportInset(this.panelEl,"--eun-viewport-inset-bottom"),i=this.panelEl.getBoundingClientRect(),r=0;i.left<e?r=e-i.left:i.right>window.innerWidth-e&&(r=window.innerWidth-e-i.right);let p=t+e,d=window.innerHeight-n-e,s=0;i.top<p?s=p-i.top:i.bottom>d&&(s=d-i.bottom),this.panelEl.style.transform=r||s?`translate(${r}px, ${s}px)`:""}readPixelVar(e,t){if(!this.panelEl)return t;let n=getComputedStyle(this.panelEl).getPropertyValue(e),i=Number.parseFloat(n);return Number.isFinite(i)?i:t}readGap(){return this.readPixelVar("--tooltip-gap",8)}applyAriaDescribedBy(){if(this.ariaDescribedByApplied||!this.anchorEl)return;this.ariaDescribedByApplied=!0;let e=this.anchorEl.getAttribute("aria-describedby"),t=e?e.split(/\s+/):[];t.includes(this.panelId)||(t.push(this.panelId),this.anchorEl.setAttribute("aria-describedby",t.join(" ")))}clearShowTimer(){this.showTimer!==void 0&&(clearTimeout(this.showTimer),this.showTimer=void 0)}clearHideTimer(){this.hideTimer!==void 0&&(clearTimeout(this.hideTimer),this.hideTimer=void 0)}scheduleShow(){this.clearHideTimer(),!this.open&&(this.clearShowTimer(),this.showTimer=setTimeout(()=>{this.showTimer=void 0,this.show()},this.showDelay))}scheduleHide(){this.clearShowTimer(),!this.pinned&&(this.clearHideTimer(),this.hideTimer=setTimeout(()=>{this.hideTimer=void 0,this.pinned||this.hide()},this.hideDelay))}rebindAnchorListeners(){let e=this.anchorEl;this.boundAnchorEl!==e&&(this.unbindAnchorListeners(),this.boundAnchorEl=e,this.ariaDescribedByApplied=!1,e&&(e.addEventListener("pointerenter",this.handleAnchorPointerEnter),e.addEventListener("pointerleave",this.handleAnchorPointerLeave),e.addEventListener("focusin",this.handleAnchorFocusIn),e.addEventListener("focusout",this.handleAnchorFocusOut),e.addEventListener("click",this.handleAnchorClick)))}unbindAnchorListeners(){this.boundAnchorEl?.removeEventListener("pointerenter",this.handleAnchorPointerEnter),this.boundAnchorEl?.removeEventListener("pointerleave",this.handleAnchorPointerLeave),this.boundAnchorEl?.removeEventListener("focusin",this.handleAnchorFocusIn),this.boundAnchorEl?.removeEventListener("focusout",this.handleAnchorFocusOut),this.boundAnchorEl?.removeEventListener("click",this.handleAnchorClick)}hasDescription(){return!!this.richText||this.descriptionSlotNodes.length>0}hasHeading(){return!!this.heading||this.defaultSlotNodes.some(e=>e.nodeType!==Node.TEXT_NODE||!!e.textContent?.trim())}mirrorSlottedContent(){if(!this.panelEl)return;this.heading||this.panelEl.querySelector(".eun-tooltip-heading-mirror")?.replaceChildren(...this.defaultSlotNodes.map(n=>n.cloneNode(!0))),this.panelEl.querySelector(".eun-tooltip-description-mirror")?.replaceChildren(...this.descriptionSlotNodes.map(t=>t.cloneNode(!0)))}renderPanel(){let e=this.heading?this.heading:h`<span class="eun-tooltip-heading-mirror"></span>`;return h`
+`,w=$;var M="eun-tooltip",B=0,V=0,R=new WeakSet,I=["--tooltip-z-index","--tooltip-gap","--tooltip-viewport-gap","--tooltip-min-width","--tooltip-max-width","--tooltip-background-color","--tooltip-color","--tooltip-content-color","--tooltip-border-color","--tooltip-border-width","--tooltip-font-weight","--tooltip-border-radius","--tooltip-padding","--tooltip-padding-block","--tooltip-padding-inline","--tooltip-row-gap","--tooltip-shadow","--tooltip-transition-duration"],F=C(T),o=class extends F{constructor(){super(...arguments);this.color="primary";this.appearance="default";this.fixedColor=!1;this.placement="top";this.open=!1;this.lazy=!1;this.showDelay=100;this.hideDelay=150;this.pinned=!1;this.panelId=`eun-tooltip-panel-${++V}`;this.headingId=`${this.panelId}-heading`;this.ariaDescribedByApplied=!1;this.handleReposition=()=>{this.reposition()};this.handleDocumentKeydown=e=>{e.key==="Escape"&&this.hide()};this.handleDocumentPointerDown=e=>{if(!this.pinned)return;let t=e.composedPath();this.anchorEl&&t.includes(this.anchorEl)||this.panelEl&&t.includes(this.panelEl)||this.hide()};this.handleAnchorSlotChange=()=>{this.rebindAnchorListeners()};this.handleAnchorPointerEnter=()=>{this.scheduleShow()};this.handleAnchorPointerLeave=()=>{this.scheduleHide()};this.handleAnchorFocusIn=()=>{this.clearShowTimer(),this.clearHideTimer(),this.show()};this.handleAnchorFocusOut=()=>{this.pinned=!1,this.hide()};this.handleAnchorClick=()=>{this.pinned=!this.pinned,this.pinned?(this.clearShowTimer(),this.clearHideTimer(),this.show()):this.scheduleHide()};this.handlePanelPointerEnter=()=>{this.clearHideTimer()};this.handlePanelPointerLeave=()=>{this.scheduleHide()};this.handleSlotChange=()=>{this.requestUpdate()}}supportsAnchorPositioning(){return o.nativeAnchorPositioningSupported}connectedCallback(){super.connectedCallback(),this.hasUpdated&&!this.lazy&&this.ensurePortal()}firstUpdated(e){super.firstUpdated(e),this.rebindAnchorListeners(),this.lazy||this.ensurePortal()}disconnectedCallback(){this.unbindAnchorListeners(),this.clearShowTimer(),this.clearHideTimer(),this.panelAnimation?.cancel(),this.panelAnimation=void 0,this.removeGlobalListeners(),this.portalContainer?.remove(),this.portalContainer=void 0,this.portalRoot=void 0,this.panelEl=void 0,super.disconnectedCallback?.()}updated(e){if(super.updated(e),this.portalContainer&&this.renderPortal(),e.has("open")){this.open?this.openTooltip():this.closeTooltip();return}e.has("placement")&&this.open&&this.reposition()}show(){this.open=!0}hide(){this.open=!1}toggle(){this.open=!this.open}get anchorEl(){return this.anchorSlotEls[0]}ensurePortal(){if(this.portalContainer||!this.anchorEl)return;let e=this.anchorEl.getRootNode();this.portalRoot=e,this.installPanelStyles(e);let t=document.createElement("div");t.style.display="contents",(e===document?document.body:e).appendChild(t),this.portalContainer=t,this.renderPortal()}installPanelStyles(e){if(R.has(e)||!b.styleSheet)return;R.add(e);let t=[b.styleSheet];!m&&w.styleSheet&&t.push(w.styleSheet),e.adoptedStyleSheets=[...e.adoptedStyleSheets,...t]}renderPortal(){this.portalContainer&&(P(this.renderPanel(),this.portalContainer,{host:this}),this.panelEl=this.portalContainer.querySelector(".eun-tooltip-panel")??void 0,this.forwardCssVariables(),this.mirrorSlottedContent())}forwardCssVariables(){if(!this.panelEl)return;let e=getComputedStyle(this);for(let t of I)this.panelEl.style.setProperty(t,e.getPropertyValue(t))}openTooltip(){if(this.ensurePortal(),!this.anchorEl||!this.panelEl)return;this.applyAriaDescribedBy();let e=this.panelEl,t=this.panelAnimation!==void 0;this.panelAnimation?.cancel(),this.panelAnimation=void 0;let r=!e.matches(":popover-open");r&&e.showPopover(),this.reposition(),(r||t)&&this.playEnterAnimation(e),window.addEventListener("resize",this.handleReposition),window.addEventListener("scroll",this.handleReposition,!0),document.addEventListener("keydown",this.handleDocumentKeydown),document.addEventListener("pointerdown",this.handleDocumentPointerDown,!0),this.observeAnchorVisibility(this.anchorEl,()=>this.hide())}closeTooltip(){this.pinned=!1;let e=this.panelEl;this.panelAnimation?.cancel(),this.panelAnimation=void 0,e?.matches(":popover-open")&&this.playExitAnimation(e),this.removeGlobalListeners(),this.unobserveAnchorVisibility()}static panelAnimationDuration(e){return window.matchMedia("(prefers-reduced-motion: reduce)").matches?0:k(e,"--tooltip-transition-duration","s",150)}playEnterAnimation(e){e.style.removeProperty("pointer-events");let t=o.panelAnimationDuration(e);t!==0&&(this.panelAnimation=e.animate([{opacity:0,scale:.96},{opacity:1,scale:1}],{duration:t,easing:y(e),fill:"forwards"}))}playExitAnimation(e){e.style.pointerEvents="none";let t=o.panelAnimationDuration(e);if(t===0){e.hidePopover();return}let r=e.animate([{opacity:1,scale:1},{opacity:0,scale:.96}],{duration:t,easing:y(e),fill:"forwards"});this.panelAnimation=r,r.finished.then(()=>{this.panelAnimation===r&&(this.panelAnimation=void 0),e.hidePopover()}).catch(()=>{})}removeGlobalListeners(){window.removeEventListener("resize",this.handleReposition),window.removeEventListener("scroll",this.handleReposition,!0),document.removeEventListener("keydown",this.handleDocumentKeydown),document.removeEventListener("pointerdown",this.handleDocumentPointerDown,!0)}reposition(){!this.anchorEl||!this.panelEl||(this.supportsAnchorPositioning()?(this.anchorPositionName??=`--eun-tooltip-anchor-${++B}`,this.anchorEl.style.setProperty("anchor-name",this.anchorPositionName),this.panelEl.style.setProperty("position-anchor",this.anchorPositionName)):this.updateFallbackPosition(),this.clampPanelToViewport())}getEffectivePlacementFallback(e,t,r,i){let n=this.readGap();if(this.placement==="left"||this.placement==="right"){let H=window.innerWidth,x=e.right+n+t.width<=H,E=e.left-n-t.width>=0;return this.placement==="right"&&!x&&E?"left":this.placement==="left"&&!E&&x?"right":this.placement}let p=window.innerHeight,d=e.bottom+n+t.height<=p-i,s=e.top-n-t.height>=r;return this.placement==="top"&&!s&&d?"bottom":this.placement==="bottom"&&!d&&s?"top":this.placement}updateFallbackPosition(){if(!this.anchorEl||!this.panelEl)return;let e=this.readGap(),t=this.readViewportInset(this.panelEl,"--eun-viewport-inset-top"),r=this.readViewportInset(this.panelEl,"--eun-viewport-inset-bottom"),i=this.anchorEl.getBoundingClientRect(),n=this.panelEl.getBoundingClientRect(),p=this.getEffectivePlacementFallback(i,n,t,r),d,s;p==="top"||p==="bottom"?(d=p==="top"?i.top-n.height-e:i.bottom+e,s=g(i.left+i.width/2-n.width/2,n.width,window.innerWidth,e)):(s=p==="left"?i.left-n.width-e:i.right+e,d=g(i.top+i.height/2-n.height/2,n.height,window.innerHeight,e)),this.panelEl.style.setProperty("--_panelTop",`${d}px`),this.panelEl.style.setProperty("--_panelLeft",`${s}px`)}clampPanelToViewport(){if(!this.panelEl)return;let e=this.readPixelVar("--tooltip-viewport-gap",8),t=this.readViewportInset(this.panelEl,"--eun-viewport-inset-top"),r=this.readViewportInset(this.panelEl,"--eun-viewport-inset-bottom"),i=this.panelEl.getBoundingClientRect(),n=0;i.left<e?n=e-i.left:i.right>window.innerWidth-e&&(n=window.innerWidth-e-i.right);let p=t+e,d=window.innerHeight-r-e,s=0;i.top<p?s=p-i.top:i.bottom>d&&(s=d-i.bottom),this.panelEl.style.transform=n||s?`translate(${n}px, ${s}px)`:""}readPixelVar(e,t){if(!this.panelEl)return t;let r=getComputedStyle(this.panelEl).getPropertyValue(e),i=Number.parseFloat(r);return Number.isFinite(i)?i:t}readGap(){return this.readPixelVar("--tooltip-gap",8)}applyAriaDescribedBy(){if(this.ariaDescribedByApplied||!this.anchorEl)return;this.ariaDescribedByApplied=!0;let e=this.anchorEl.getAttribute("aria-describedby"),t=e?e.split(/\s+/):[];t.includes(this.panelId)||(t.push(this.panelId),this.anchorEl.setAttribute("aria-describedby",t.join(" ")))}clearShowTimer(){this.showTimer!==void 0&&(clearTimeout(this.showTimer),this.showTimer=void 0)}clearHideTimer(){this.hideTimer!==void 0&&(clearTimeout(this.hideTimer),this.hideTimer=void 0)}scheduleShow(){this.clearHideTimer(),!this.open&&(this.clearShowTimer(),this.showTimer=setTimeout(()=>{this.showTimer=void 0,this.show()},this.showDelay))}scheduleHide(){this.clearShowTimer(),!this.pinned&&(this.clearHideTimer(),this.hideTimer=setTimeout(()=>{this.hideTimer=void 0,this.pinned||this.hide()},this.hideDelay))}rebindAnchorListeners(){let e=this.anchorEl;this.boundAnchorEl!==e&&(this.unbindAnchorListeners(),this.boundAnchorEl=e,this.ariaDescribedByApplied=!1,e&&(e.addEventListener("pointerenter",this.handleAnchorPointerEnter),e.addEventListener("pointerleave",this.handleAnchorPointerLeave),e.addEventListener("focusin",this.handleAnchorFocusIn),e.addEventListener("focusout",this.handleAnchorFocusOut),e.addEventListener("click",this.handleAnchorClick)))}unbindAnchorListeners(){this.boundAnchorEl?.removeEventListener("pointerenter",this.handleAnchorPointerEnter),this.boundAnchorEl?.removeEventListener("pointerleave",this.handleAnchorPointerLeave),this.boundAnchorEl?.removeEventListener("focusin",this.handleAnchorFocusIn),this.boundAnchorEl?.removeEventListener("focusout",this.handleAnchorFocusOut),this.boundAnchorEl?.removeEventListener("click",this.handleAnchorClick)}hasDescription(){return!!this.richText||this.descriptionSlotNodes.length>0}hasHeading(){return!!this.heading||this.defaultSlotNodes.some(e=>e.nodeType!==Node.TEXT_NODE||!!e.textContent?.trim())}mirrorSlottedContent(){if(!this.panelEl)return;this.heading||this.panelEl.querySelector(".eun-tooltip-heading-mirror")?.replaceChildren(...this.defaultSlotNodes.map(r=>r.cloneNode(!0))),this.panelEl.querySelector(".eun-tooltip-description-mirror")?.replaceChildren(...this.descriptionSlotNodes.map(t=>t.cloneNode(!0)))}renderPanel(){let e=this.heading?this.heading:h`<span class="eun-tooltip-heading-mirror"></span>`;return h`
       <div
         id=${this.panelId}
         class=${f({"eun-tooltip-panel":!0,"no-heading":!this.hasHeading()})}
@@ -285,8 +301,8 @@ import{c as y}from"./chunks/chunk-CEDHJUUH.js";import{a as C}from"./chunks/chunk
           class=${f({"eun-tooltip-description":!0,hidden:!this.hasDescription()})}
         >
           ${this.richText?h`<div class="eun-tooltip-rich-text">
-                ${T(this.richText)}
-              </div>`:A}
+                ${L(this.richText)}
+              </div>`:_}
           <span class="eun-tooltip-description-mirror"></span>
         </div>
       </div>
@@ -298,4 +314,4 @@ import{c as y}from"./chunks/chunk-CEDHJUUH.js";import{a as C}from"./chunks/chunk
         hidden
         @slotchange=${this.handleSlotChange}
       ></slot>
-    `}};o.styles=L,o.nativeAnchorPositioningSupported=typeof CSS<"u"&&CSS.supports("anchor-name: --a")&&!m,a([l({reflect:!0})],o.prototype,"severity",2),a([l({reflect:!0})],o.prototype,"color",2),a([l({reflect:!0})],o.prototype,"appearance",2),a([l({type:Boolean,reflect:!0,attribute:"fixed-color"})],o.prototype,"fixedColor",2),a([l({reflect:!0})],o.prototype,"placement",2),a([l()],o.prototype,"heading",2),a([l({attribute:"rich-text"})],o.prototype,"richText",2),a([l({type:Boolean,reflect:!0})],o.prototype,"open",2),a([l({type:Boolean,reflect:!0})],o.prototype,"lazy",2),a([l({type:Number,attribute:"show-delay"})],o.prototype,"showDelay",2),a([l({type:Number,attribute:"hide-delay"})],o.prototype,"hideDelay",2),a([S({slot:"anchor"})],o.prototype,"anchorSlotEls",2),a([u()],o.prototype,"defaultSlotNodes",2),a([u({slot:"description"})],o.prototype,"descriptionSlotNodes",2),o=a([E(N)],o);export{o as EunomiaTooltip,N as EunomiaTooltipTagName};
+    `}};o.styles=D,o.nativeAnchorPositioningSupported=typeof CSS<"u"&&CSS.supports("anchor-name: --a")&&!m,a([l({reflect:!0})],o.prototype,"severity",2),a([l({reflect:!0})],o.prototype,"color",2),a([l({reflect:!0})],o.prototype,"appearance",2),a([l({type:Boolean,reflect:!0,attribute:"fixed-color"})],o.prototype,"fixedColor",2),a([l({reflect:!0})],o.prototype,"placement",2),a([l()],o.prototype,"heading",2),a([l({attribute:"rich-text"})],o.prototype,"richText",2),a([l({type:Boolean,reflect:!0})],o.prototype,"open",2),a([l({type:Boolean,reflect:!0})],o.prototype,"lazy",2),a([l({type:Number,attribute:"show-delay"})],o.prototype,"showDelay",2),a([l({type:Number,attribute:"hide-delay"})],o.prototype,"hideDelay",2),a([A({slot:"anchor"})],o.prototype,"anchorSlotEls",2),a([u()],o.prototype,"defaultSlotNodes",2),a([u({slot:"description"})],o.prototype,"descriptionSlotNodes",2),o=a([S(M)],o);export{o as EunomiaTooltip,M as EunomiaTooltipTagName};

package/dist/cdn/styles/breakpoints.scss

@@ -0,0 +1,8 @@
+// Short entry point for the breakpoints : the `eunomia-below-*` and
+// `eunomia-from-*` mixins, and the `$map-device-width` scale they read.
+//
+//   @use "@eunomia/elements/styles/breakpoints" as *;
+//
+// Emits no CSS, so it can be used in every stylesheet that needs it.
+@forward "./tools/mixins/media-queries/eunomia-media-queries.mixin.scss";
+@forward "./tools/variables/eunomia.breakpoints.scss";

package/dist/cdn/styles/eunomia-grid.scss

@@ -0,0 +1,6 @@
+// Grid utility classes, emitted once at the top level. Every theme entry
+// file uses this module, and Sass outputs a module's CSS only once per
+// compilation, so loading several themes never duplicates the classes.
+@use "./tools/mixins/layout/eunomia-grid.mixin.scss" as *;
+
+@include eunomia-grid-layouts();