@filip.mazev/blocks 1.4.17 → 1.4.18

package/fesm2022/filip.mazev-blocks-primitives.mjs

@@ -1,9 +1,9 @@
 import { BxSurfaceDirective } from "@filip.mazev/blocks/effects";
 import * as i0 from "@angular/core";
-import { ChangeDetectionStrategy, Component, DestroyRef, Directive, ElementRef, HostListener, InjectionToken, NgZone, PLATFORM_ID, Pipe, TemplateRef, ViewContainerRef, afterEveryRender, afterNextRender, afterRenderEffect, booleanAttribute, computed, contentChild, contentChildren, effect, forwardRef, inject, input, model, output, signal, viewChild, viewChildren } from "@angular/core";
+import { ChangeDetectionStrategy, Component, DestroyRef, Directive, ElementRef, HostListener, Injectable, InjectionToken, NgZone, PLATFORM_ID, Pipe, TemplateRef, ViewContainerRef, afterEveryRender, afterNextRender, afterRenderEffect, booleanAttribute, computed, contentChild, contentChildren, effect, forwardRef, inject, input, model, output, signal, untracked, viewChild, viewChildren } from "@angular/core";
 import { BX_I18N, BxA11yService, BxOverlayPositionService, BxShortcutService, inheritOverlayTheme, isTextWithKey, resolveText, resolveTokenToCssVar, trackOverlayOrigin, uuidv4 } from "@filip.mazev/blocks/core";
 import { Icon } from "@filip.mazev/blocks/icons";
-import { AriaDescriber, FocusMonitor } from "@angular/cdk/a11y";
+import { AriaDescriber, FocusMonitor, FocusTrapFactory } from "@angular/cdk/a11y";
 import { Overlay } from "@angular/cdk/overlay";
 import { ComponentPortal, TemplatePortal } from "@angular/cdk/portal";
 import { createGlassTransition, inheritGlassLighting } from "@filip.mazev/blocks/effects/runtime";
@@ -106,7 +106,7 @@ var Menu = class Menu {
 		selector: "bx-menu",
 		ngImport: i0,
 		template: "<div data-bx-surface=\"solid\" role=\"menu\" class=\"bx-menu-wrapper\" [class.bx-menu-animated]=\"isAnimated()\">\n    <ng-content></ng-content>\n</div>\n",
-		styles: [":host{display:block}.bx-menu-wrapper{--bx-glass-surface: var(--bx-bg-surface);--bx-glass-text: var(--bx-text-primary);--bx-glass-edge: var(--bx-border-default);--bx-glass-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1);--bx-glass-radius: var(--bx-rounded-lg, .75rem);background-color:var(--bx-glass-surface);border:1px solid var(--bx-glass-edge);border-radius:var(--bx-glass-radius, var(--bx-rounded-lg, .75rem));box-shadow:0 2px 4px #0000001a,0 1px 2px -1px #0000001a;padding:.25rem;display:flex;flex-direction:column;min-width:12rem}.bx-menu-wrapper[data-bx-surface=solid]{background:var(--bx-glass-surface)!important;-webkit-backdrop-filter:none;backdrop-filter:none}.bx-menu-wrapper.bx-menu-animated{transition:transform .2s cubic-bezier(.25,.8,.25,1)}.bx-menu-wrapper{transform-origin:top}.bx-menu-wrapper.is-hidden{opacity:0;transform:scaleY(.95);pointer-events:none}:host([data-bx-surface]){border-radius:var(--bx-glass-radius, var(--bx-rounded-lg, .75rem));--bx-glass-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1);color:var(--bx-glass-text, var(--bx-text-primary))}:host([data-bx-surface]) .bx-menu-wrapper{background:transparent;border-color:transparent;border-radius:inherit;box-shadow:none}\n"],
+		styles: [":host{display:block}.bx-menu-wrapper{--bx-glass-surface: var(--bx-bg-surface);--bx-glass-text: var(--bx-text-primary);--bx-glass-edge: var(--bx-border-default);--bx-glass-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1);--bx-glass-radius: var(--bx-rounded-lg, .75rem);background-color:var(--bx-glass-surface);border:1px solid var(--bx-glass-edge);border-radius:var(--bx-glass-radius, var(--bx-rounded-lg, .75rem));box-shadow:0 2px 4px #0000001a,0 1px 2px -1px #0000001a;padding:.25rem;display:flex;flex-direction:column;gap:var(--bx-menu-item-gap, 0);box-sizing:border-box;min-width:var(--bx-menu-min-width, 12rem);max-width:100%}.bx-menu-wrapper[data-bx-surface=solid]{background:var(--bx-glass-surface)!important;-webkit-backdrop-filter:none;backdrop-filter:none}.bx-menu-wrapper.bx-menu-animated{transition:transform .2s cubic-bezier(.25,.8,.25,1)}.bx-menu-wrapper{transform-origin:top}.bx-menu-wrapper.is-hidden{opacity:0;transform:scaleY(.95);pointer-events:none}:host([data-bx-surface]){border-radius:var(--bx-glass-radius, var(--bx-rounded-lg, .75rem));--bx-glass-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1);color:var(--bx-glass-text, var(--bx-text-primary))}:host([data-bx-surface]) .bx-menu-wrapper{background:transparent;border-color:transparent;border-radius:inherit;box-shadow:none}\n"],
 		changeDetection: i0.ChangeDetectionStrategy.OnPush
 	});
 };
@@ -121,7 +121,7 @@ i0.ɵɵngDeclareClassMetadata({
 			selector: "bx-menu",
 			changeDetection: ChangeDetectionStrategy.OnPush,
 			template: "<div data-bx-surface=\"solid\" role=\"menu\" class=\"bx-menu-wrapper\" [class.bx-menu-animated]=\"isAnimated()\">\n    <ng-content></ng-content>\n</div>\n",
-			styles: [":host{display:block}.bx-menu-wrapper{--bx-glass-surface: var(--bx-bg-surface);--bx-glass-text: var(--bx-text-primary);--bx-glass-edge: var(--bx-border-default);--bx-glass-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1);--bx-glass-radius: var(--bx-rounded-lg, .75rem);background-color:var(--bx-glass-surface);border:1px solid var(--bx-glass-edge);border-radius:var(--bx-glass-radius, var(--bx-rounded-lg, .75rem));box-shadow:0 2px 4px #0000001a,0 1px 2px -1px #0000001a;padding:.25rem;display:flex;flex-direction:column;min-width:12rem}.bx-menu-wrapper[data-bx-surface=solid]{background:var(--bx-glass-surface)!important;-webkit-backdrop-filter:none;backdrop-filter:none}.bx-menu-wrapper.bx-menu-animated{transition:transform .2s cubic-bezier(.25,.8,.25,1)}.bx-menu-wrapper{transform-origin:top}.bx-menu-wrapper.is-hidden{opacity:0;transform:scaleY(.95);pointer-events:none}:host([data-bx-surface]){border-radius:var(--bx-glass-radius, var(--bx-rounded-lg, .75rem));--bx-glass-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1);color:var(--bx-glass-text, var(--bx-text-primary))}:host([data-bx-surface]) .bx-menu-wrapper{background:transparent;border-color:transparent;border-radius:inherit;box-shadow:none}\n"]
+			styles: [":host{display:block}.bx-menu-wrapper{--bx-glass-surface: var(--bx-bg-surface);--bx-glass-text: var(--bx-text-primary);--bx-glass-edge: var(--bx-border-default);--bx-glass-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1);--bx-glass-radius: var(--bx-rounded-lg, .75rem);background-color:var(--bx-glass-surface);border:1px solid var(--bx-glass-edge);border-radius:var(--bx-glass-radius, var(--bx-rounded-lg, .75rem));box-shadow:0 2px 4px #0000001a,0 1px 2px -1px #0000001a;padding:.25rem;display:flex;flex-direction:column;gap:var(--bx-menu-item-gap, 0);box-sizing:border-box;min-width:var(--bx-menu-min-width, 12rem);max-width:100%}.bx-menu-wrapper[data-bx-surface=solid]{background:var(--bx-glass-surface)!important;-webkit-backdrop-filter:none;backdrop-filter:none}.bx-menu-wrapper.bx-menu-animated{transition:transform .2s cubic-bezier(.25,.8,.25,1)}.bx-menu-wrapper{transform-origin:top}.bx-menu-wrapper.is-hidden{opacity:0;transform:scaleY(.95);pointer-events:none}:host([data-bx-surface]){border-radius:var(--bx-glass-radius, var(--bx-rounded-lg, .75rem));--bx-glass-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1);color:var(--bx-glass-text, var(--bx-text-primary))}:host([data-bx-surface]) .bx-menu-wrapper{background:transparent;border-color:transparent;border-radius:inherit;box-shadow:none}\n"]
 		}]
 	}]
 });
@@ -2559,6 +2559,7 @@ var Tag = class Tag {
 	}, ...ngDevMode ? [{ debugName: "resolvedTrailingNumber" }] : /* istanbul ignore next */ []);
 	palette = computed(() => TAG_PALETTES[this.color() ?? this.config().color ?? "accent"], ...ngDevMode ? [{ debugName: "palette" }] : /* istanbul ignore next */ []);
 	isNumberOnly = computed(() => !this.resolvedText() && !this.resolvedLeadingIcon() && !this.resolvedTrailingIcon() && !!this.resolvedLeadingNumber() !== !!this.resolvedTrailingNumber(), ...ngDevMode ? [{ debugName: "isNumberOnly" }] : /* istanbul ignore next */ []);
+	opaque = input(void 0, ...ngDevMode ? [{ debugName: "opaque" }] : /* istanbul ignore next */ []);
 	text = input(void 0, ...ngDevMode ? [{ debugName: "text" }] : /* istanbul ignore next */ []);
 	config = input({}, ...ngDevMode ? [{ debugName: "config" }] : /* istanbul ignore next */ []);
 	color = input(void 0, ...ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []);
@@ -2594,6 +2595,13 @@ var Tag = class Tag {
 		isStandalone: true,
 		selector: "bx-tag",
 		inputs: {
+			opaque: {
+				classPropertyName: "opaque",
+				publicName: "opaque",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
 			text: {
 				classPropertyName: "text",
 				publicName: "text",
@@ -2729,7 +2737,7 @@ var Tag = class Tag {
 			isSignal: true
 		}],
 		ngImport: i0,
-		template: "<span class=\"bx-tag\" bxSurface [bxSurfaceInteractive]=\"false\"\n    [class.is-filled]=\"resolvedVariant() === 'filled'\" [class.is-outlined]=\"resolvedVariant() === 'outlined'\"\n    [class.is-small]=\"resolvedSize() === 'small'\" [class.is-disabled]=\"disabled()\" [class.is-number-only]=\"isNumberOnly()\"\n    [attr.aria-disabled]=\"disabled() ? 'true' : null\" [attr.role]=\"resolvedAriaLabel() ? 'group' : null\" [attr.aria-label]=\"resolvedAriaLabel() || null\"\n    [attr.tabindex]=\"resolvedTooltip() && focusable() ? 0 : null\" [bxTooltip]=\"resolvedTooltip()\" [placement]=\"tooltipPlacement()\" bxTooltipTouch=\"longpress\">\n    @if (resolvedLeadingIcon(); as icon) { <bx-icon [name]=\"icon\" [size]=\"resolvedIconSize()\" /> }\n    @if (resolvedLeadingNumber()) { <span class=\"bx-tag-number\">{{ resolvedLeadingNumber() }}</span> }\n    @if (resolvedText()) { <span class=\"bx-tag-text\" bxTruncate>{{ resolvedText() }}</span> }\n    @if (resolvedTrailingNumber()) { <span class=\"bx-tag-number\">{{ resolvedTrailingNumber() }}</span> }\n    @if (resolvedTrailingIcon(); as icon) { <bx-icon [name]=\"icon\" [size]=\"resolvedIconSize()\" /> }\n</span>\n",
+		template: "<span class=\"bx-tag\" bxSurface [bxSurfaceInteractive]=\"false\" [bxReducedTransparency]=\"(opaque() ?? config().opaque) ? true : undefined\"\n    [class.is-filled]=\"resolvedVariant() === 'filled'\" [class.is-outlined]=\"resolvedVariant() === 'outlined'\"\n    [class.is-small]=\"resolvedSize() === 'small'\" [class.is-disabled]=\"disabled()\" [class.is-number-only]=\"isNumberOnly()\"\n    [attr.aria-disabled]=\"disabled() ? 'true' : null\" [attr.role]=\"resolvedAriaLabel() ? 'group' : null\" [attr.aria-label]=\"resolvedAriaLabel() || null\"\n    [attr.tabindex]=\"resolvedTooltip() && focusable() ? 0 : null\" [bxTooltip]=\"resolvedTooltip()\" [placement]=\"tooltipPlacement()\" bxTooltipTouch=\"longpress\">\n    @if (resolvedLeadingIcon(); as icon) { <bx-icon [name]=\"icon\" [size]=\"resolvedIconSize()\" /> }\n    @if (resolvedLeadingNumber()) { <span class=\"bx-tag-number\">{{ resolvedLeadingNumber() }}</span> }\n    @if (resolvedText()) { <span class=\"bx-tag-text\" bxTruncate>{{ resolvedText() }}</span> }\n    @if (resolvedTrailingNumber()) { <span class=\"bx-tag-number\">{{ resolvedTrailingNumber() }}</span> }\n    @if (resolvedTrailingIcon(); as icon) { <bx-icon [name]=\"icon\" [size]=\"resolvedIconSize()\" /> }\n</span>\n",
 		styles: [":host{display:inline-flex;min-inline-size:0;max-inline-size:100%;vertical-align:middle}.bx-tag{--bx-glass-surface: var(--bx-tag-background, var(--bx-tag-role-tonal));--bx-glass-text: var(--bx-tag-color, var(--bx-tag-role-text));--bx-glass-edge: var(--bx-tag-border, var(--bx-tag-role-border));--bx-glass-radius: var(--bx-tag-radius, .25rem);--bx-glass-shadow: var(--bx-tag-shadow, none);position:relative;display:inline-flex;align-items:center;justify-content:center;min-inline-size:0;max-inline-size:100%;box-sizing:border-box;gap:var(--bx-tag-gap, .25rem);padding:var(--bx-tag-padding, .25rem .5rem);border:1px solid var(--bx-glass-edge);border-radius:var(--bx-glass-radius);background:var(--bx-glass-surface);color:var(--bx-glass-text);font:inherit;font-size:var(--bx-tag-font-size, .8125rem);line-height:1.4;white-space:nowrap}.bx-tag.is-filled{--bx-glass-surface: var(--bx-tag-background, var(--bx-tag-role-fill));--bx-glass-text: var(--bx-tag-color, var(--bx-tag-role-on-fill));--bx-glass-min-opacity: var(--bx-tag-fill-opacity, .85)}.bx-tag.is-outlined{--bx-glass-surface: var(--bx-tag-background, var(--bx-bg-surface));--bx-glass-opacity: var(--bx-tag-outline-opacity, .12)}.bx-tag.is-small{font-size:var(--bx-tag-font-size, .75rem);padding-block:.125rem}.bx-tag.is-disabled{opacity:var(--bx-tag-disabled-opacity, .5)}.bx-tag.is-number-only{--bx-glass-radius: 50%;inline-size:max-content;min-inline-size:var(--bx-tag-number-size, 1.875rem);aspect-ratio:1;padding:var(--bx-tag-number-padding, .35em)}.bx-tag.is-number-only.is-small{min-inline-size:var(--bx-tag-number-size, 1.5rem)}.bx-tag:focus-visible{outline:2px solid var(--bx-border-brand);outline-offset:2px}.bx-tag-number{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-inline-size:1.1em;padding-inline:.25em;border-radius:var(--bx-tag-counter-radius, .25rem);background:var(--bx-tag-counter-background, color-mix(in srgb, currentcolor 12%, transparent));font-variant-numeric:tabular-nums}.is-number-only .bx-tag-number{background:transparent;padding:0}@media(forced-colors:active){.bx-tag.is-disabled{color:GrayText;border-color:GrayText;opacity:1}}\n"],
 		dependencies: [
 			{
@@ -2805,7 +2813,7 @@ i0.ɵɵngDeclareClassMetadata({
 				"[style.--bx-tag-role-tonal]": "palette().tonal",
 				"[style.--bx-tag-role-border]": "palette().border"
 			},
-			template: "<span class=\"bx-tag\" bxSurface [bxSurfaceInteractive]=\"false\"\n    [class.is-filled]=\"resolvedVariant() === 'filled'\" [class.is-outlined]=\"resolvedVariant() === 'outlined'\"\n    [class.is-small]=\"resolvedSize() === 'small'\" [class.is-disabled]=\"disabled()\" [class.is-number-only]=\"isNumberOnly()\"\n    [attr.aria-disabled]=\"disabled() ? 'true' : null\" [attr.role]=\"resolvedAriaLabel() ? 'group' : null\" [attr.aria-label]=\"resolvedAriaLabel() || null\"\n    [attr.tabindex]=\"resolvedTooltip() && focusable() ? 0 : null\" [bxTooltip]=\"resolvedTooltip()\" [placement]=\"tooltipPlacement()\" bxTooltipTouch=\"longpress\">\n    @if (resolvedLeadingIcon(); as icon) { <bx-icon [name]=\"icon\" [size]=\"resolvedIconSize()\" /> }\n    @if (resolvedLeadingNumber()) { <span class=\"bx-tag-number\">{{ resolvedLeadingNumber() }}</span> }\n    @if (resolvedText()) { <span class=\"bx-tag-text\" bxTruncate>{{ resolvedText() }}</span> }\n    @if (resolvedTrailingNumber()) { <span class=\"bx-tag-number\">{{ resolvedTrailingNumber() }}</span> }\n    @if (resolvedTrailingIcon(); as icon) { <bx-icon [name]=\"icon\" [size]=\"resolvedIconSize()\" /> }\n</span>\n",
+			template: "<span class=\"bx-tag\" bxSurface [bxSurfaceInteractive]=\"false\" [bxReducedTransparency]=\"(opaque() ?? config().opaque) ? true : undefined\"\n    [class.is-filled]=\"resolvedVariant() === 'filled'\" [class.is-outlined]=\"resolvedVariant() === 'outlined'\"\n    [class.is-small]=\"resolvedSize() === 'small'\" [class.is-disabled]=\"disabled()\" [class.is-number-only]=\"isNumberOnly()\"\n    [attr.aria-disabled]=\"disabled() ? 'true' : null\" [attr.role]=\"resolvedAriaLabel() ? 'group' : null\" [attr.aria-label]=\"resolvedAriaLabel() || null\"\n    [attr.tabindex]=\"resolvedTooltip() && focusable() ? 0 : null\" [bxTooltip]=\"resolvedTooltip()\" [placement]=\"tooltipPlacement()\" bxTooltipTouch=\"longpress\">\n    @if (resolvedLeadingIcon(); as icon) { <bx-icon [name]=\"icon\" [size]=\"resolvedIconSize()\" /> }\n    @if (resolvedLeadingNumber()) { <span class=\"bx-tag-number\">{{ resolvedLeadingNumber() }}</span> }\n    @if (resolvedText()) { <span class=\"bx-tag-text\" bxTruncate>{{ resolvedText() }}</span> }\n    @if (resolvedTrailingNumber()) { <span class=\"bx-tag-number\">{{ resolvedTrailingNumber() }}</span> }\n    @if (resolvedTrailingIcon(); as icon) { <bx-icon [name]=\"icon\" [size]=\"resolvedIconSize()\" /> }\n</span>\n",
 			styles: [":host{display:inline-flex;min-inline-size:0;max-inline-size:100%;vertical-align:middle}.bx-tag{--bx-glass-surface: var(--bx-tag-background, var(--bx-tag-role-tonal));--bx-glass-text: var(--bx-tag-color, var(--bx-tag-role-text));--bx-glass-edge: var(--bx-tag-border, var(--bx-tag-role-border));--bx-glass-radius: var(--bx-tag-radius, .25rem);--bx-glass-shadow: var(--bx-tag-shadow, none);position:relative;display:inline-flex;align-items:center;justify-content:center;min-inline-size:0;max-inline-size:100%;box-sizing:border-box;gap:var(--bx-tag-gap, .25rem);padding:var(--bx-tag-padding, .25rem .5rem);border:1px solid var(--bx-glass-edge);border-radius:var(--bx-glass-radius);background:var(--bx-glass-surface);color:var(--bx-glass-text);font:inherit;font-size:var(--bx-tag-font-size, .8125rem);line-height:1.4;white-space:nowrap}.bx-tag.is-filled{--bx-glass-surface: var(--bx-tag-background, var(--bx-tag-role-fill));--bx-glass-text: var(--bx-tag-color, var(--bx-tag-role-on-fill));--bx-glass-min-opacity: var(--bx-tag-fill-opacity, .85)}.bx-tag.is-outlined{--bx-glass-surface: var(--bx-tag-background, var(--bx-bg-surface));--bx-glass-opacity: var(--bx-tag-outline-opacity, .12)}.bx-tag.is-small{font-size:var(--bx-tag-font-size, .75rem);padding-block:.125rem}.bx-tag.is-disabled{opacity:var(--bx-tag-disabled-opacity, .5)}.bx-tag.is-number-only{--bx-glass-radius: 50%;inline-size:max-content;min-inline-size:var(--bx-tag-number-size, 1.875rem);aspect-ratio:1;padding:var(--bx-tag-number-padding, .35em)}.bx-tag.is-number-only.is-small{min-inline-size:var(--bx-tag-number-size, 1.5rem)}.bx-tag:focus-visible{outline:2px solid var(--bx-border-brand);outline-offset:2px}.bx-tag-number{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-inline-size:1.1em;padding-inline:.25em;border-radius:var(--bx-tag-counter-radius, .25rem);background:var(--bx-tag-counter-background, color-mix(in srgb, currentcolor 12%, transparent));font-variant-numeric:tabular-nums}.is-number-only .bx-tag-number{background:transparent;padding:0}@media(forced-colors:active){.bx-tag.is-disabled{color:GrayText;border-color:GrayText;opacity:1}}\n"]
 		}]
 	}],
@@ -2814,6 +2822,14 @@ i0.ɵɵngDeclareClassMetadata({
 			type: i0.ViewChild,
 			args: [i0.forwardRef(() => TruncateDirective), { isSignal: true }]
 		}],
+		opaque: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "opaque",
+				required: false
+			}]
+		}],
 		text: [{
 			type: i0.Input,
 			args: [{
@@ -2952,6 +2968,424 @@ i0.ɵɵngDeclareClassMetadata({
 		}]
 	}
 });
-export { BX_OVERLAY_CONTEXT, BxOverlayContextDirective, ContextMenuDirective, DropdownDirective, LoadingIndicator, LoadingSpinner, Menu, MenuItem, ProgressBar, Tab, TabContentDirective, Tabs, Tag, Tooltip, TooltipDirective, TruncateDirective, TruncatedTextPipe, truncatedText };
+var MenuCascadeService = class MenuCascadeService {
+	entries = /* @__PURE__ */ new Set();
+	activate(trigger) {
+		const ancestors = /* @__PURE__ */ new Set();
+		let parent = trigger.menuParent();
+		while (parent) {
+			ancestors.add(parent);
+			parent = parent.menuParent();
+		}
+		for (const entry of [...this.entries]) if (!ancestors.has(entry) && entry !== trigger) entry.close();
+		this.entries.add(trigger);
+	}
+	remove(trigger) {
+		this.entries.delete(trigger);
+	}
+	closeChildren(trigger) {
+		for (const entry of [...this.entries]) if (entry.menuParent() === trigger) entry.close();
+	}
+	contains(trigger, target) {
+		return trigger.contains(target) || [...this.entries].some((entry) => entry.menuParent() === trigger && this.contains(entry, target));
+	}
+	hasOpenMenus() {
+		return this.entries.size > 0;
+	}
+	repositionChildren(trigger) {
+		for (const entry of [...this.entries]) if (entry.menuParent() === trigger) entry.reposition();
+	}
+	closeAll(restoreFocus = false) {
+		[...this.entries].find((entry) => !entry.menuParent())?.close(restoreFocus);
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: MenuCascadeService,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Injectable
+	});
+	static ɵprov = i0.ɵɵngDeclareInjectable({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: MenuCascadeService,
+		providedIn: "root"
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: MenuCascadeService,
+	decorators: [{
+		type: Injectable,
+		args: [{ providedIn: "root" }]
+	}]
+});
+function navigateMenuKey(event, menu) {
+	if (![
+		"ArrowDown",
+		"ArrowUp",
+		"Home",
+		"End"
+	].includes(event.key)) return false;
+	const items = Array.from(menu.querySelectorAll("[role=\"menuitem\"]")).filter((item) => item.closest("[role=\"menu\"]") === menu && !item.matches(":disabled, [aria-disabled=\"true\"]") && item.getClientRects().length > 0);
+	if (!items.length) return false;
+	const current = items.indexOf(menu.ownerDocument.activeElement);
+	const index = event.key === "Home" ? 0 : event.key === "End" ? items.length - 1 : event.key === "ArrowDown" ? (current + 1) % items.length : (current - 1 + items.length) % items.length;
+	event.preventDefault();
+	event.stopPropagation();
+	items[index].focus();
+	return true;
+}
+var MenuTriggerDirective = class MenuTriggerDirective {
+	source = inject(ElementRef).nativeElement;
+	overlay = inject(Overlay);
+	overlayContext = inject(BX_OVERLAY_CONTEXT, { optional: true });
+	zone = inject(NgZone);
+	positions = inject(BxOverlayPositionService);
+	cascade = inject(MenuCascadeService);
+	vcr = inject(ViewContainerRef);
+	traps = inject(FocusTrapFactory);
+	opened = signal(false, ...ngDevMode ? [{ debugName: "opened" }] : /* istanbul ignore next */ []);
+	overlayId = signal(null, ...ngDevMode ? [{ debugName: "overlayId" }] : /* istanbul ignore next */ []);
+	isOpen = this.opened.asReadonly();
+	bxMenuTrigger = input.required(...ngDevMode ? [{ debugName: "bxMenuTrigger" }] : /* istanbul ignore next */ []);
+	menuOrigin = input(void 0, ...ngDevMode ? [{ debugName: "menuOrigin" }] : /* istanbul ignore next */ []);
+	menuParent = input(void 0, ...ngDevMode ? [{ debugName: "menuParent" }] : /* istanbul ignore next */ []);
+	menuSide = input("right", ...ngDevMode ? [{ debugName: "menuSide" }] : /* istanbul ignore next */ []);
+	menuHover = input(true, ...ngDevMode ? [{ debugName: "menuHover" }] : /* istanbul ignore next */ []);
+	menuLabel = input("", ...ngDevMode ? [{ debugName: "menuLabel" }] : /* istanbul ignore next */ []);
+	menuPinned = input(false, ...ngDevMode ? [{ debugName: "menuPinned" }] : /* istanbul ignore next */ []);
+	menuOpened = output();
+	menuClosed = output();
+	overlayRef;
+	trap;
+	subscriptions = new Subscription();
+	disconnectTheme;
+	hoverTimer;
+	positionTracker;
+	constructor() {
+		inject(DestroyRef).onDestroy(() => this.close());
+		effect(() => {
+			const label = this.menuLabel();
+			const opened = this.isOpen();
+			untracked(() => {
+				if (opened) this.overlayRef?.overlayElement.querySelector("[role=\"menu\"]")?.setAttribute("aria-label", label || this.source.getAttribute("aria-label") || this.source.textContent?.trim() || "");
+			});
+		});
+	}
+	toggle(event) {
+		event.preventDefault();
+		event.stopPropagation();
+		if (this.isOpen()) this.close(true);
+		else this.open(true);
+	}
+	open(focus = false) {
+		this.cancelClose();
+		if (this.isOpen()) {
+			if (focus) this.focusFirst();
+			return;
+		}
+		if (!this.source.ownerDocument.defaultView || this.source.matches(":disabled, [aria-disabled=\"true\"]")) return;
+		this.cascade.activate(this);
+		const overlay = this.overlay.create({
+			positionStrategy: this.positions.getSubmenuStrategy(this.menuOrigin() ?? this.source, this.menuSide()),
+			scrollStrategy: this.overlay.scrollStrategies.noop(),
+			usePopover: !!this.overlayContext?.useTopLayer || !!this.source.closest("dialog, [role=\"dialog\"], [role=\"alertdialog\"], bx-modal, bx-modal-core, [popover]"),
+			direction: "ltr",
+			hasBackdrop: false
+		});
+		this.overlayRef = overlay;
+		this.overlayId.set(overlay.overlayElement.id);
+		this.opened.set(true);
+		this.disconnectTheme = inheritOverlayTheme(this.source, overlay.overlayElement);
+		this.subscriptions = new Subscription();
+		overlay.attach(new TemplatePortal(this.bxMenuTrigger(), this.vcr)).detectChanges();
+		const menu = overlay.overlayElement.querySelector("[role=\"menu\"]");
+		if (menu) menu.setAttribute("aria-label", this.menuLabel() || this.source.getAttribute("aria-label") || this.source.textContent?.trim() || "");
+		this.trap = this.traps.create(overlay.overlayElement);
+		const tracker = this.zone.runOutsideAngular(() => trackOverlayOrigin(overlay, this.menuOrigin() ?? this.source, {
+			onPosition: () => this.cascade.repositionChildren(this),
+			onOriginHidden: () => this.zone.run(() => this.close())
+		}));
+		this.positionTracker = tracker;
+		this.subscriptions.add(() => {
+			tracker();
+			this.positionTracker = void 0;
+		});
+		if (this.overlayRef !== overlay) return;
+		this.subscriptions.add(overlay.keydownEvents().subscribe((event) => this.onMenuKey(event)));
+		this.subscriptions.add(overlay.outsidePointerEvents().subscribe((event) => {
+			if (event.target instanceof Node && !this.cascade.contains(this, event.target)) this.close();
+		}));
+		this.subscriptions.add(overlay.detachments().subscribe(() => this.close()));
+		const enter = () => this.cancelClose();
+		const leave = () => this.scheduleClose();
+		overlay.overlayElement.addEventListener("pointerenter", enter);
+		overlay.overlayElement.addEventListener("pointerleave", leave);
+		this.subscriptions.add(() => {
+			overlay.overlayElement.removeEventListener("pointerenter", enter);
+			overlay.overlayElement.removeEventListener("pointerleave", leave);
+		});
+		overlay.updatePosition();
+		if (focus) this.focusFirst();
+		this.menuOpened.emit();
+	}
+	close(restoreFocus = false) {
+		this.cancelClose();
+		if (!this.overlayRef) return;
+		this.cascade.closeChildren(this);
+		const overlay = this.overlayRef;
+		this.overlayRef = void 0;
+		if (restoreFocus || overlay.overlayElement.contains(this.source.ownerDocument.activeElement)) this.source.focus({ preventScroll: true });
+		this.subscriptions.unsubscribe();
+		this.trap?.destroy();
+		this.trap = void 0;
+		this.disconnectTheme?.();
+		this.disconnectTheme = void 0;
+		overlay.dispose();
+		this.cascade.remove(this);
+		this.overlayId.set(null);
+		this.opened.set(false);
+		this.menuClosed.emit();
+	}
+	reposition() {
+		this.positionTracker?.reposition();
+	}
+	contains(target) {
+		return this.source.contains(target) || !!this.overlayRef?.overlayElement.contains(target);
+	}
+	scheduleClose() {
+		if (this.menuPinned()) return;
+		this.cancelClose();
+		this.hoverTimer = this.source.ownerDocument.defaultView?.setTimeout(() => {
+			const focused = this.source.ownerDocument.activeElement;
+			if (!focused || !this.cascade.contains(this, focused)) this.close();
+		}, 240);
+	}
+	onPointerEnter(event) {
+		if (this.menuHover() && event.pointerType !== "touch") this.open();
+	}
+	onKey(event) {
+		if (![
+			this.menuSide() === "right" ? "ArrowRight" : "ArrowLeft",
+			"ArrowDown",
+			"ArrowUp"
+		].includes(event.key)) return;
+		event.preventDefault();
+		event.stopPropagation();
+		this.open(true);
+	}
+	cancelClose() {
+		this.source.ownerDocument.defaultView?.clearTimeout(this.hoverTimer);
+		this.hoverTimer = void 0;
+		this.menuParent()?.cancelClose();
+	}
+	focusFirst() {
+		this.overlayRef?.overlayElement.querySelector("[role=\"menuitem\"]:not(:disabled):not([aria-disabled=\"true\"])")?.focus();
+	}
+	onMenuKey(event) {
+		if (event.defaultPrevented) return;
+		const backward = this.menuSide() === "right" ? "ArrowLeft" : "ArrowRight";
+		if (event.key === "Escape" || event.key === backward) {
+			event.preventDefault();
+			event.stopPropagation();
+			this.close(true);
+			return;
+		}
+		const menu = event.target?.closest("[role=\"menu\"]");
+		if (menu) navigateMenuKey(event, menu);
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: MenuTriggerDirective,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Directive
+	});
+	static ɵdir = i0.ɵɵngDeclareDirective({
+		minVersion: "17.1.0",
+		version: "22.2.3",
+		type: MenuTriggerDirective,
+		isStandalone: true,
+		selector: "[bxMenuTrigger]",
+		inputs: {
+			bxMenuTrigger: {
+				classPropertyName: "bxMenuTrigger",
+				publicName: "bxMenuTrigger",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			menuOrigin: {
+				classPropertyName: "menuOrigin",
+				publicName: "menuOrigin",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			menuParent: {
+				classPropertyName: "menuParent",
+				publicName: "menuParent",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			menuSide: {
+				classPropertyName: "menuSide",
+				publicName: "menuSide",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			menuHover: {
+				classPropertyName: "menuHover",
+				publicName: "menuHover",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			menuLabel: {
+				classPropertyName: "menuLabel",
+				publicName: "menuLabel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			menuPinned: {
+				classPropertyName: "menuPinned",
+				publicName: "menuPinned",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: {
+			menuOpened: "menuOpened",
+			menuClosed: "menuClosed"
+		},
+		host: {
+			listeners: {
+				"click": "toggle($event)",
+				"pointerleave": "scheduleClose()",
+				"pointerenter": "onPointerEnter($event)",
+				"keydown": "onKey($event)"
+			},
+			properties: {
+				"attr.aria-haspopup": "\"menu\"",
+				"attr.aria-expanded": "isOpen()",
+				"attr.aria-controls": "overlayId()"
+			}
+		},
+		exportAs: ["bxMenuTrigger"],
+		ngImport: i0
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: MenuTriggerDirective,
+	decorators: [{
+		type: Directive,
+		args: [{
+			selector: "[bxMenuTrigger]",
+			exportAs: "bxMenuTrigger",
+			host: {
+				"[attr.aria-haspopup]": "\"menu\"",
+				"[attr.aria-expanded]": "isOpen()",
+				"[attr.aria-controls]": "overlayId()"
+			}
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		bxMenuTrigger: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "bxMenuTrigger",
+				required: true
+			}]
+		}],
+		menuOrigin: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "menuOrigin",
+				required: false
+			}]
+		}],
+		menuParent: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "menuParent",
+				required: false
+			}]
+		}],
+		menuSide: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "menuSide",
+				required: false
+			}]
+		}],
+		menuHover: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "menuHover",
+				required: false
+			}]
+		}],
+		menuLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "menuLabel",
+				required: false
+			}]
+		}],
+		menuPinned: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "menuPinned",
+				required: false
+			}]
+		}],
+		menuOpened: [{
+			type: i0.Output,
+			args: ["menuOpened"]
+		}],
+		menuClosed: [{
+			type: i0.Output,
+			args: ["menuClosed"]
+		}],
+		toggle: [{
+			type: HostListener,
+			args: ["click", ["$event"]]
+		}],
+		scheduleClose: [{
+			type: HostListener,
+			args: ["pointerleave"]
+		}],
+		onPointerEnter: [{
+			type: HostListener,
+			args: ["pointerenter", ["$event"]]
+		}],
+		onKey: [{
+			type: HostListener,
+			args: ["keydown", ["$event"]]
+		}]
+	}
+});
+export { BX_OVERLAY_CONTEXT, BxOverlayContextDirective, ContextMenuDirective, DropdownDirective, LoadingIndicator, LoadingSpinner, Menu, MenuCascadeService, MenuItem, MenuTriggerDirective, ProgressBar, Tab, TabContentDirective, Tabs, Tag, Tooltip, TooltipDirective, TruncateDirective, TruncatedTextPipe, navigateMenuKey, truncatedText };
 
 //# sourceMappingURL=filip.mazev-blocks-primitives.mjs.map