@ethlete/components 1.0.0-next.50 → 1.0.0-next.52

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # Changelog
 
+## 1.0.0-next.52
+
+### Patch Changes
+
+- [`5c1190a`](https://github.com/ethlete-io/ethdk/commit/5c1190ac76c244ff1c293b390dd599ed016d26de) Thanks [@TomTomB](https://github.com/TomTomB)! - Overlays: a press on a surface stacked above them no longer counts as an outside press, so working in the query devtools leaves an open dialog, sheet, menu, select or tooltip alone.
+
+## 1.0.0-next.51
+
+### Patch Changes
+
+- [#3063](https://github.com/ethlete-io/ethdk/pull/3063) [`37067ce`](https://github.com/ethlete-io/ethdk/commit/37067cee67c5cd360360a5f59c29f58afc08e62c) Thanks [@TomTomB](https://github.com/TomTomB)! - A single-scheme app no longer needs a root `etProvideSurface`: its default surface paints `:root` unconditionally once the surface CSS is regenerated, and the outermost provider resolves it through the new `injectDefaultSurfaceTheme()` / `injectSurfaceType()`.
+
 ## 1.0.0-next.50
 
 ### Minor Changes

package/fesm2022/ethlete-components.mjs

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
 import { InjectionToken, input, booleanAttribute, signal, computed, effect, untracked, Directive, inject, afterNextRender, DestroyRef, TemplateRef, ElementRef, model, linkedSignal, ViewEncapsulation, Component, numberAttribute, contentChildren, Injector, output, runInInjectionContext, contentChild, NgZone, ApplicationRef, viewChild, ViewContainerRef, createEnvironmentInjector, DOCUMENT, EnvironmentInjector, inputBinding, createComponent, isSignal, assertInInjectionContext, isDevMode as isDevMode$1, provideEnvironmentInitializer, viewChildren, afterRenderEffect, outputBinding, afterEveryRender, PLATFORM_ID } from '@angular/core';
 import * as i1 from '@ethlete/core';
-import { injectHostElement, RuntimeError, createComponentId, ProvideColorDirective, defineLabels, toProvideFn, toInjectFn, toToken, injectStyleManager, SurfaceInteractiveDirective, createCanAnimateSignal, ColorInteractiveDirective, injectSuccessTheme, injectWarningTheme, injectErrorTheme, injectLocale, defineStaticRootProvider, inferMimeType, injectColorThemes, injectRenderer, ProvideSurfaceDirective, COLOR_PROVIDER, SURFACE_PROVIDER, injectSurfaceThemes, injectSurfaceThemesPrefix, injectSurfaceContextTracker, injectBoundaryElement, ANIMATED_LIFECYCLE_TOKEN, resolveAppRootColorProvider, resolveSurfaceByElevation, createCssSurfaceName, provideBoundaryElement, AnimatedLifecycleDirective, injectBreakpointObserver, isHTMLElement, equal, animationDebugLog, resolveOverlayLayer, defineRootProvider, injectOverlayRuntime, anchoredOverlayPosition, enableAnchoredOverlayPositionExtras, randomId, forceReflow, nextFrame, elementCanScroll, matchesReducedMotion, createSwipeTracker, ScrollObserverDirective, signalElementScrollState, ScrollObserverStartDirective, ScrollObserverEndDirective, applyHostListener, injectQueryParam, defineProvider, fromNextFrame, injectRoute, createUnsavedChangesTracker, createDocumentElementSignal, AnimatedIfDirective, signalElementDimensions, applyInitialFocus, syncSignal, AutoSurfaceDirective, setInputSignal, injectTemplateRef, signalHostElementScrollState, applyStructuredDataBinding, typedBreakpointTransform, signalElementChildren, signalElementIntersection, signalHostAttributes, signalHostClasses, signalHostStyles, getScrollContainerTarget, getScrollItemTarget, getElementScrollCoordinates, provideBreakpointInstance, signalClasses, useCursorDragScroll, signalStyles, getScrollSnapTarget, injectPrefersReducedMotion, injectIsDocumentVisible, signalHostElementIntersection, clamp as clamp$1, copyToClipboard, injectAnimatedBlockSize, injectObserveBreakpoint, signalDeferredLoading, AnimatableDirective, ColorInteractiveContainerDirective, ColorInteractiveExcludeDirective, createFlipAnimation, createObjectUrlHandle, createFlipAnimationGroup, focusElement, isFocusable, getFocusableElements, ColorInteractiveHasFocusDirective, dragGestureFrom, injectFocusVisibleTracker, htmlToMarkdown, markdownToHtml, injectHasTouchInput, signalHostElementDimensions, DragHandleDirective, ResizeHandlesComponent, numberBreakpointTransform, applyLinkBinding, applyHeadTitleBinding, injectColorPalette, injectViewportSize, injectFileDownload, injectRouterEvent, canUseSessionMemory, createAutoSessionMemoryKey, createSessionMemory } from '@ethlete/core';
+import { injectHostElement, RuntimeError, createComponentId, ProvideColorDirective, defineLabels, toProvideFn, toInjectFn, toToken, injectStyleManager, SurfaceInteractiveDirective, createCanAnimateSignal, ColorInteractiveDirective, injectSuccessTheme, injectWarningTheme, injectErrorTheme, injectLocale, defineStaticRootProvider, inferMimeType, injectColorThemes, injectRenderer, ProvideSurfaceDirective, COLOR_PROVIDER, SURFACE_PROVIDER, injectSurfaceThemes, injectSurfaceThemesPrefix, injectSurfaceContextTracker, injectBoundaryElement, ANIMATED_LIFECYCLE_TOKEN, resolveAppRootColorProvider, resolveSurfaceByElevation, createCssSurfaceName, provideBoundaryElement, AnimatedLifecycleDirective, injectBreakpointObserver, isHTMLElement, equal, animationDebugLog, resolveOverlayLayer, defineRootProvider, injectOverlayRuntime, anchoredOverlayPosition, enableAnchoredOverlayPositionExtras, randomId, forceReflow, nextFrame, elementCanScroll, matchesReducedMotion, createSwipeTracker, ScrollObserverDirective, signalElementScrollState, ScrollObserverStartDirective, ScrollObserverEndDirective, applyHostListener, injectQueryParam, defineProvider, fromNextFrame, injectRoute, createUnsavedChangesTracker, createDocumentElementSignal, AnimatedIfDirective, signalElementDimensions, applyInitialFocus, syncSignal, AutoSurfaceDirective, setInputSignal, injectTemplateRef, signalHostElementScrollState, applyStructuredDataBinding, typedBreakpointTransform, signalElementChildren, signalElementIntersection, signalHostAttributes, signalHostClasses, signalHostStyles, getScrollContainerTarget, getScrollItemTarget, getElementScrollCoordinates, provideBreakpointInstance, signalClasses, useCursorDragScroll, signalStyles, getScrollSnapTarget, injectPrefersReducedMotion, injectIsDocumentVisible, signalHostElementIntersection, clamp as clamp$1, copyToClipboard, isOnHigherOverlayLayer, injectAnimatedBlockSize, injectObserveBreakpoint, signalDeferredLoading, AnimatableDirective, ColorInteractiveContainerDirective, ColorInteractiveExcludeDirective, createFlipAnimation, createObjectUrlHandle, createFlipAnimationGroup, focusElement, isFocusable, getFocusableElements, ColorInteractiveHasFocusDirective, dragGestureFrom, injectFocusVisibleTracker, htmlToMarkdown, markdownToHtml, injectHasTouchInput, signalHostElementDimensions, DragHandleDirective, ResizeHandlesComponent, numberBreakpointTransform, applyLinkBinding, applyHeadTitleBinding, injectColorPalette, injectSurfaceType, injectViewportSize, injectFileDownload, injectRouterEvent, canUseSessionMemory, createAutoSessionMemoryKey, createSessionMemory } from '@ethlete/core';
 import { NgTemplateOutlet, NgComponentOutlet, Location, DOCUMENT as DOCUMENT$1, isPlatformBrowser } from '@angular/common';
 import { DomSanitizer } from '@angular/platform-browser';
 import { format, startOfWeek, startOfDay, endOfWeek, isBefore, addDays, endOfMonth, startOfMonth, isSameYear, isSameMonth, isSameDay, startOfYear, isAfter, addYears, addMonths, setMonth, setYear, getDate, setDate, lastDayOfMonth, getWeek, endOfYear, parse, isValid, setSeconds, setMinutes, setHours, setMilliseconds, endOfDay, eachDayOfInterval, differenceInCalendarDays, addMinutes, differenceInMinutes, addHours } from 'date-fns';
@@ -20025,6 +20025,9 @@ const createAnchoredPanelController = (options) => {
             if (options.anchor()?.contains(target)) {
                 return;
             }
+            if (isOnHigherOverlayLayer(target, resolveOverlayLayer(pane ?? options.anchor()))) {
+                return;
+            }
             closedByOutsidePointer = true;
             if (options.open()) {
                 options.open.set(false);
@@ -31115,7 +31118,7 @@ class TooltipDirective {
     dismissOnOutsidePointer(overlayRef) {
         const hostElement = this.elementRef.nativeElement;
         fromEvent(this.document, 'pointerdown', { capture: true })
-            .pipe(takeUntil(overlayRef.afterClosed()), takeUntilDestroyed(this.destroyRef), filter((event) => !(event.target instanceof Node) || !hostElement.contains(event.target)), tap(() => {
+            .pipe(takeUntil(overlayRef.afterClosed()), takeUntilDestroyed(this.destroyRef), filter((event) => !(event.target instanceof Node) || !hostElement.contains(event.target)), filter((event) => !isOnHigherOverlayLayer(event.target, resolveOverlayLayer(hostElement))), tap(() => {
             this.hasHover.set(false);
             this.hasFocus.set(false);
             this.hide();
@@ -35801,6 +35804,9 @@ class MenuDirective {
             if (this.isTargetInsideTree(event.target)) {
                 return;
             }
+            if (isOnHigherOverlayLayer(event.target, resolveOverlayLayer(this.hostElement))) {
+                return;
+            }
             const triggerElement = this.registeredTrigger()?.elementRef.nativeElement;
             // the subsequent click on the trigger toggles the menu closed on its own
             if (triggerElement && event.target instanceof Node && triggerElement.contains(event.target)) {
@@ -55094,6 +55100,7 @@ let nextHeadingId = 0;
 class StreamConsentComponent {
     constructor() {
         this.parentSurfaceProvider = inject(SURFACE_PROVIDER, { optional: true, skipSelf: true });
+        this.surfaceType = injectSurfaceType();
         this.config = injectStreamConsentConfig();
         this.labels = injectStreamLabels();
         this.surfaceThemes = injectSurfaceThemes({ optional: true });
@@ -55102,7 +55109,7 @@ class StreamConsentComponent {
             const themes = this.surfaceThemes;
             if (!themes)
                 return null;
-            const type = this.parentSurfaceProvider?.surfaceType() ?? 'dark';
+            const type = this.surfaceType();
             const elevation = (this.parentSurfaceProvider?.elevation() ?? 0) + 1;
             return resolveSurfaceByElevation(themes, type, elevation)?.name ?? null;
         }, /* @ts-ignore */
@@ -55176,6 +55183,7 @@ class StreamPlayerErrorComponent {
     constructor() {
         this.errorDirective = inject(STREAM_PLAYER_ERROR_TOKEN);
         this.parentSurfaceProvider = inject(SURFACE_PROVIDER, { optional: true, skipSelf: true });
+        this.surfaceType = injectSurfaceType();
         this.config = injectStreamPlayerErrorConfig();
         this.labels = injectStreamLabels();
         this.surfaceThemes = injectSurfaceThemes({ optional: true });
@@ -55183,7 +55191,7 @@ class StreamPlayerErrorComponent {
             const themes = this.surfaceThemes;
             if (!themes)
                 return null;
-            const type = this.parentSurfaceProvider?.surfaceType() ?? 'dark';
+            const type = this.surfaceType();
             const elevation = (this.parentSurfaceProvider?.elevation() ?? 0) + 1;
             return resolveSurfaceByElevation(themes, type, elevation)?.name ?? null;
         }, /* @ts-ignore */
@@ -57012,6 +57020,7 @@ class PipSlotPlaceholderComponent {
     constructor() {
         this.slotPlayerId = inject(STREAM_SLOT_PLAYER_ID_TOKEN);
         this.parentSurfaceProvider = inject(SURFACE_PROVIDER, { optional: true, skipSelf: true });
+        this.surfaceType = injectSurfaceType();
         this.pipManager = injectPipManager();
         this.config = injectPipSlotPlaceholderConfig();
         this.labels = injectStreamLabels();
@@ -57022,7 +57031,7 @@ class PipSlotPlaceholderComponent {
             const themes = this.surfaceThemes;
             if (!themes)
                 return null;
-            const type = this.parentSurfaceProvider?.surfaceType() ?? 'dark';
+            const type = this.surfaceType();
             const elevation = (this.parentSurfaceProvider?.elevation() ?? 0) + 1;
             return resolveSurfaceByElevation(themes, type, elevation)?.name ?? null;
         }, /* @ts-ignore */
@@ -57415,6 +57424,7 @@ class StreamPlayerSlotDirective {
         this.playerComponent = inject(STREAM_PLAYER_COMPONENT_TOKEN);
         this.provideSurface = inject(ProvideSurfaceDirective);
         this.parentSurfaceProvider = inject(SURFACE_PROVIDER, { optional: true, skipSelf: true });
+        this.surfaceType = injectSurfaceType();
         this.surfaceThemes = injectSurfaceThemes({ optional: true });
         this.styleManager = injectStyleManager();
         this.streamSlotPriority = input(false, { ...(ngDevMode ? { debugName: "streamSlotPriority" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
@@ -57424,7 +57434,7 @@ class StreamPlayerSlotDirective {
             const themes = this.surfaceThemes;
             if (!themes)
                 return null;
-            const type = this.parentSurfaceProvider?.surfaceType() ?? 'dark';
+            const type = this.surfaceType();
             const elevation = (this.parentSurfaceProvider?.elevation() ?? 0) + 1;
             return resolveSurfaceByElevation(themes, type, elevation);
         }, /* @ts-ignore */
@@ -66319,7 +66329,7 @@ const TREE_IMPORTS = [TreeComponent, TreeDirective, TreeNodeDirective, TreeNodeD
 
 // Generated from package.json by tools/scripts/generate-version.js - do not edit.
 /** The version of `@ethlete/components` this build was cut from. */
-const COMPONENTS_VERSION = '1.0.0-next.50';
+const COMPONENTS_VERSION = '1.0.0-next.52';
 
 /**
  * Generated bundle index. Do not edit.