@lifecorner/angular-ui-kit 3.31.0 → 3.32.0

package/fesm2022/lifecorner-angular-ui-kit-bottom-nav.mjs

@@ -180,7 +180,7 @@ var BottomNavComponent = class BottomNavComponent {
 		host: { classAttribute: "lc-bottom-nav-host" },
 		ngImport: i0,
 		template: "<nav [class]=\"navClasses()\" [attr.aria-label]=\"ariaLabel()\">\n  <ul class=\"lc-bottom-nav__list\">\n    @for (entry of entries(); track entry.item.id) {\n      <li class=\"lc-bottom-nav__entry\">\n        @if (entry.more && !entry.item.route) {\n          <button\n            type=\"button\"\n            class=\"lc-bottom-nav__item\"\n            [class.lc-bottom-nav__item--current]=\"entry.current\"\n            (click)=\"onMoreButtonClick()\"\n          >\n            <ng-container [ngTemplateOutlet]=\"itemContent\" [ngTemplateOutletContext]=\"{ $implicit: entry }\" />\n          </button>\n        } @else {\n          <a\n            class=\"lc-bottom-nav__item\"\n            [class.lc-bottom-nav__item--current]=\"entry.current\"\n            [routerLink]=\"entry.item.route\"\n            [attr.aria-current]=\"entry.current ? 'page' : null\"\n            (click)=\"onItemClick(entry)\"\n          >\n            <ng-container [ngTemplateOutlet]=\"itemContent\" [ngTemplateOutletContext]=\"{ $implicit: entry }\" />\n          </a>\n        }\n      </li>\n    }\n  </ul>\n</nav>\n\n<ng-template #itemContent let-entry>\n  <!-- Icon and badge are decoration: the label and the hidden badge text name the link. -->\n  <span class=\"lc-bottom-nav__pill\" aria-hidden=\"true\">\n    <lc-icon [name]=\"entry.item.icon\" size=\"md\" [decorative]=\"true\" class=\"lc-bottom-nav__icon\" />\n    @if (entry.item.badge; as badge) {\n      <span class=\"lc-bottom-nav__badge\">\n        <lc-badge [variant]=\"badge.variant || 'default'\" size=\"xs\" [rounded]=\"true\">{{ badge.value }}</lc-badge>\n      </span>\n    }\n  </span>\n  <span class=\"lc-bottom-nav__label\">{{ entry.item.label }}</span>\n  @if (entry.item.badge) {\n    <span class=\"lc-bottom-nav__sr-only\">{{ badgeText(entry.item) }}</span>\n  }\n</ng-template>\n",
-		styles: [":host{display:block}.lc-bottom-nav{--_fg: var(--lc-bottom-nav-fg, var(--color-text-secondary));--_current-bg: var(--lc-bottom-nav-current-bg, var(--color-surface-selected));--_current-fg: var(--lc-bottom-nav-current-fg, var(--color-on-surface-selected, var(--color-link)));--_hover-bg: var(--lc-bottom-nav-hover-bg, var(--color-surface-hover));box-sizing:border-box;background-color:var(--lc-bottom-nav-bg, var(--_bg));color:var(--_fg)}.lc-bottom-nav--docked{--_bg: var(--color-surface);border-top:1px solid var(--lc-bottom-nav-border, var(--color-border));padding-bottom:env(safe-area-inset-bottom,0px);padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}.lc-bottom-nav--floating{--_bg: var(--color-floating-bar-surface, var(--color-surface));border:1px solid var(--lc-bottom-nav-border, var(--color-floating-bar-border, var(--color-border)));border-radius:28px;box-shadow:var(--lc-bottom-nav-shadow, var(--shadow-floating-bar, 0 10px 30px -10px rgba(13, 53, 61, .28)))}.lc-bottom-nav--fixed{position:fixed;z-index:var(--lc-bottom-nav-z, 900)}.lc-bottom-nav--fixed.lc-bottom-nav--docked{left:0;right:0;bottom:0}.lc-bottom-nav--fixed.lc-bottom-nav--floating{left:calc(16px + env(safe-area-inset-left,0px));right:calc(16px + env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px))}.lc-bottom-nav__list{display:flex;margin:0;padding:4px 8px;list-style:none}.lc-bottom-nav__entry{display:flex;flex:1 1 0;min-width:0}.lc-bottom-nav__item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:4px;min-width:min(64px,100%);min-height:64px;padding-block:6px 2px;padding-inline:0;box-sizing:border-box;border:0;border-radius:20px;background:transparent;color:var(--_fg);font-family:inherit;text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent}.lc-bottom-nav__item:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:-2px}@media(hover:hover){.lc-bottom-nav__item:hover:not(.lc-bottom-nav__item--current) .lc-bottom-nav__pill{background-color:var(--_hover-bg)}}.lc-bottom-nav__pill{position:relative;display:flex;align-items:center;justify-content:center;flex:none;width:56px;max-width:100%;height:32px;border-radius:9999px;background-color:transparent;transition:background-color .2s ease}@media(prefers-reduced-motion:reduce){.lc-bottom-nav__pill{transition:none}}.lc-bottom-nav__icon{display:flex;width:24px;height:24px;color:currentColor}.lc-bottom-nav__label{--_reach: clamp(-4px, 32px - 1.5rem, 8px);max-width:calc(100% + var(--_reach));margin-inline:calc(var(--_reach) / -2);font-size:var(--font-size-xs, .75rem);line-height:1rem;font-weight:var(--font-weight-medium, 500);text-align:center;overflow-wrap:anywhere;hyphens:auto}.lc-bottom-nav__item--current{color:var(--_current-fg)}.lc-bottom-nav__item--current .lc-bottom-nav__pill{background-color:var(--_current-bg)}.lc-bottom-nav__item--current .lc-bottom-nav__label{font-weight:var(--font-weight-bold, 700)}.lc-bottom-nav__item--current .lc-bottom-nav__icon ::ng-deep svg{stroke-width:2.4}.lc-bottom-nav__badge{position:absolute;top:-4px;left:calc(50% + 6px);display:flex;pointer-events:none}.lc-bottom-nav__sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media print{.lc-bottom-nav{display:none}}\n"],
+		styles: [":host{display:block}.lc-bottom-nav{--_fg: var(--lc-bottom-nav-fg, var(--color-text-secondary));--_current-bg: var(--lc-bottom-nav-current-bg, var(--color-surface-selected));--_current-fg: var(--lc-bottom-nav-current-fg, var(--color-on-surface-selected, var(--color-link)));--_hover-bg: var(--lc-bottom-nav-hover-bg, var(--color-surface-hover));box-sizing:border-box;background-color:var(--lc-bottom-nav-bg, var(--_bg));color:var(--_fg)}.lc-bottom-nav--docked{--_bg: var(--color-surface);border-top:1px solid var(--lc-bottom-nav-border, var(--color-border));padding-bottom:env(safe-area-inset-bottom,0px);padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}.lc-bottom-nav--floating{--_bg: var(--color-floating-bar-surface, var(--color-surface));border:1px solid var(--lc-bottom-nav-border, var(--color-floating-bar-border, var(--color-border)));border-radius:28px;box-shadow:var(--lc-bottom-nav-shadow, var(--shadow-floating-bar, 0 10px 30px -10px rgba(13, 53, 61, .28)))}.lc-bottom-nav--fixed{position:fixed;z-index:var(--lc-bottom-nav-z, 900)}.lc-bottom-nav--fixed.lc-bottom-nav--docked{left:0;right:0;bottom:0}.lc-bottom-nav--fixed.lc-bottom-nav--floating{left:calc(16px + env(safe-area-inset-left,0px));right:calc(16px + env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px))}.lc-bottom-nav__list{display:flex;margin:0;padding:4px 8px;list-style:none}.lc-bottom-nav__entry{display:flex;flex:1 1 0;min-width:0}.lc-bottom-nav__item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:4px;min-width:min(64px,100%);min-height:64px;padding-block:6px 2px;padding-inline:0;box-sizing:border-box;border:0;border-radius:20px;background:transparent;color:var(--_fg);font-family:inherit;text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent}.lc-bottom-nav__item:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:-2px}@media(hover:hover){.lc-bottom-nav__item:hover:not(.lc-bottom-nav__item--current) .lc-bottom-nav__pill{background-color:var(--_hover-bg)}}.lc-bottom-nav__pill{position:relative;display:flex;align-items:center;justify-content:center;flex:none;width:56px;max-width:100%;height:32px;border-radius:9999px;background-color:transparent;transition:background-color .2s ease}@media(prefers-reduced-motion:reduce){.lc-bottom-nav__pill{transition:none}}.lc-bottom-nav__icon{display:flex;width:24px;height:24px;color:currentColor}.lc-bottom-nav__label{--_reach: clamp(-4px, 32px - 1.5rem, 8px);max-width:calc(100% + var(--_reach));margin-inline:calc(var(--_reach) / -2);font-size:var(--font-size-xs, .75rem);line-height:1rem;font-weight:var(--font-weight-medium, 500);text-align:center;overflow-wrap:anywhere;hyphens:auto}.lc-bottom-nav__item--current{color:var(--_current-fg)}.lc-bottom-nav__item--current .lc-bottom-nav__pill{background-color:var(--_current-bg)}.lc-bottom-nav__item--current .lc-bottom-nav__label{font-weight:var(--font-weight-bold, 700)}.lc-bottom-nav__item--current .lc-bottom-nav__icon ::ng-deep svg{stroke-width:2.4}.lc-bottom-nav__badge{position:absolute;top:-4px;left:calc(50% + 6px);display:flex;pointer-events:none}.lc-bottom-nav__item--current .lc-bottom-nav__badge ::ng-deep .lc-badge{background-image:linear-gradient(var(--lc-badge-bg),var(--lc-badge-bg));background-color:var(--lc-bottom-nav-bg, var(--_bg))}.lc-bottom-nav__sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media print{.lc-bottom-nav{display:none}}\n"],
 		dependencies: [
 			{
 				kind: "directive",
@@ -266,7 +266,7 @@ i0.ɵɵngDeclareClassMetadata({
 			changeDetection: ChangeDetectionStrategy.OnPush,
 			host: { class: "lc-bottom-nav-host" },
 			template: "<nav [class]=\"navClasses()\" [attr.aria-label]=\"ariaLabel()\">\n  <ul class=\"lc-bottom-nav__list\">\n    @for (entry of entries(); track entry.item.id) {\n      <li class=\"lc-bottom-nav__entry\">\n        @if (entry.more && !entry.item.route) {\n          <button\n            type=\"button\"\n            class=\"lc-bottom-nav__item\"\n            [class.lc-bottom-nav__item--current]=\"entry.current\"\n            (click)=\"onMoreButtonClick()\"\n          >\n            <ng-container [ngTemplateOutlet]=\"itemContent\" [ngTemplateOutletContext]=\"{ $implicit: entry }\" />\n          </button>\n        } @else {\n          <a\n            class=\"lc-bottom-nav__item\"\n            [class.lc-bottom-nav__item--current]=\"entry.current\"\n            [routerLink]=\"entry.item.route\"\n            [attr.aria-current]=\"entry.current ? 'page' : null\"\n            (click)=\"onItemClick(entry)\"\n          >\n            <ng-container [ngTemplateOutlet]=\"itemContent\" [ngTemplateOutletContext]=\"{ $implicit: entry }\" />\n          </a>\n        }\n      </li>\n    }\n  </ul>\n</nav>\n\n<ng-template #itemContent let-entry>\n  <!-- Icon and badge are decoration: the label and the hidden badge text name the link. -->\n  <span class=\"lc-bottom-nav__pill\" aria-hidden=\"true\">\n    <lc-icon [name]=\"entry.item.icon\" size=\"md\" [decorative]=\"true\" class=\"lc-bottom-nav__icon\" />\n    @if (entry.item.badge; as badge) {\n      <span class=\"lc-bottom-nav__badge\">\n        <lc-badge [variant]=\"badge.variant || 'default'\" size=\"xs\" [rounded]=\"true\">{{ badge.value }}</lc-badge>\n      </span>\n    }\n  </span>\n  <span class=\"lc-bottom-nav__label\">{{ entry.item.label }}</span>\n  @if (entry.item.badge) {\n    <span class=\"lc-bottom-nav__sr-only\">{{ badgeText(entry.item) }}</span>\n  }\n</ng-template>\n",
-			styles: [":host{display:block}.lc-bottom-nav{--_fg: var(--lc-bottom-nav-fg, var(--color-text-secondary));--_current-bg: var(--lc-bottom-nav-current-bg, var(--color-surface-selected));--_current-fg: var(--lc-bottom-nav-current-fg, var(--color-on-surface-selected, var(--color-link)));--_hover-bg: var(--lc-bottom-nav-hover-bg, var(--color-surface-hover));box-sizing:border-box;background-color:var(--lc-bottom-nav-bg, var(--_bg));color:var(--_fg)}.lc-bottom-nav--docked{--_bg: var(--color-surface);border-top:1px solid var(--lc-bottom-nav-border, var(--color-border));padding-bottom:env(safe-area-inset-bottom,0px);padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}.lc-bottom-nav--floating{--_bg: var(--color-floating-bar-surface, var(--color-surface));border:1px solid var(--lc-bottom-nav-border, var(--color-floating-bar-border, var(--color-border)));border-radius:28px;box-shadow:var(--lc-bottom-nav-shadow, var(--shadow-floating-bar, 0 10px 30px -10px rgba(13, 53, 61, .28)))}.lc-bottom-nav--fixed{position:fixed;z-index:var(--lc-bottom-nav-z, 900)}.lc-bottom-nav--fixed.lc-bottom-nav--docked{left:0;right:0;bottom:0}.lc-bottom-nav--fixed.lc-bottom-nav--floating{left:calc(16px + env(safe-area-inset-left,0px));right:calc(16px + env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px))}.lc-bottom-nav__list{display:flex;margin:0;padding:4px 8px;list-style:none}.lc-bottom-nav__entry{display:flex;flex:1 1 0;min-width:0}.lc-bottom-nav__item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:4px;min-width:min(64px,100%);min-height:64px;padding-block:6px 2px;padding-inline:0;box-sizing:border-box;border:0;border-radius:20px;background:transparent;color:var(--_fg);font-family:inherit;text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent}.lc-bottom-nav__item:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:-2px}@media(hover:hover){.lc-bottom-nav__item:hover:not(.lc-bottom-nav__item--current) .lc-bottom-nav__pill{background-color:var(--_hover-bg)}}.lc-bottom-nav__pill{position:relative;display:flex;align-items:center;justify-content:center;flex:none;width:56px;max-width:100%;height:32px;border-radius:9999px;background-color:transparent;transition:background-color .2s ease}@media(prefers-reduced-motion:reduce){.lc-bottom-nav__pill{transition:none}}.lc-bottom-nav__icon{display:flex;width:24px;height:24px;color:currentColor}.lc-bottom-nav__label{--_reach: clamp(-4px, 32px - 1.5rem, 8px);max-width:calc(100% + var(--_reach));margin-inline:calc(var(--_reach) / -2);font-size:var(--font-size-xs, .75rem);line-height:1rem;font-weight:var(--font-weight-medium, 500);text-align:center;overflow-wrap:anywhere;hyphens:auto}.lc-bottom-nav__item--current{color:var(--_current-fg)}.lc-bottom-nav__item--current .lc-bottom-nav__pill{background-color:var(--_current-bg)}.lc-bottom-nav__item--current .lc-bottom-nav__label{font-weight:var(--font-weight-bold, 700)}.lc-bottom-nav__item--current .lc-bottom-nav__icon ::ng-deep svg{stroke-width:2.4}.lc-bottom-nav__badge{position:absolute;top:-4px;left:calc(50% + 6px);display:flex;pointer-events:none}.lc-bottom-nav__sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media print{.lc-bottom-nav{display:none}}\n"]
+			styles: [":host{display:block}.lc-bottom-nav{--_fg: var(--lc-bottom-nav-fg, var(--color-text-secondary));--_current-bg: var(--lc-bottom-nav-current-bg, var(--color-surface-selected));--_current-fg: var(--lc-bottom-nav-current-fg, var(--color-on-surface-selected, var(--color-link)));--_hover-bg: var(--lc-bottom-nav-hover-bg, var(--color-surface-hover));box-sizing:border-box;background-color:var(--lc-bottom-nav-bg, var(--_bg));color:var(--_fg)}.lc-bottom-nav--docked{--_bg: var(--color-surface);border-top:1px solid var(--lc-bottom-nav-border, var(--color-border));padding-bottom:env(safe-area-inset-bottom,0px);padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}.lc-bottom-nav--floating{--_bg: var(--color-floating-bar-surface, var(--color-surface));border:1px solid var(--lc-bottom-nav-border, var(--color-floating-bar-border, var(--color-border)));border-radius:28px;box-shadow:var(--lc-bottom-nav-shadow, var(--shadow-floating-bar, 0 10px 30px -10px rgba(13, 53, 61, .28)))}.lc-bottom-nav--fixed{position:fixed;z-index:var(--lc-bottom-nav-z, 900)}.lc-bottom-nav--fixed.lc-bottom-nav--docked{left:0;right:0;bottom:0}.lc-bottom-nav--fixed.lc-bottom-nav--floating{left:calc(16px + env(safe-area-inset-left,0px));right:calc(16px + env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px))}.lc-bottom-nav__list{display:flex;margin:0;padding:4px 8px;list-style:none}.lc-bottom-nav__entry{display:flex;flex:1 1 0;min-width:0}.lc-bottom-nav__item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:4px;min-width:min(64px,100%);min-height:64px;padding-block:6px 2px;padding-inline:0;box-sizing:border-box;border:0;border-radius:20px;background:transparent;color:var(--_fg);font-family:inherit;text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent}.lc-bottom-nav__item:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:-2px}@media(hover:hover){.lc-bottom-nav__item:hover:not(.lc-bottom-nav__item--current) .lc-bottom-nav__pill{background-color:var(--_hover-bg)}}.lc-bottom-nav__pill{position:relative;display:flex;align-items:center;justify-content:center;flex:none;width:56px;max-width:100%;height:32px;border-radius:9999px;background-color:transparent;transition:background-color .2s ease}@media(prefers-reduced-motion:reduce){.lc-bottom-nav__pill{transition:none}}.lc-bottom-nav__icon{display:flex;width:24px;height:24px;color:currentColor}.lc-bottom-nav__label{--_reach: clamp(-4px, 32px - 1.5rem, 8px);max-width:calc(100% + var(--_reach));margin-inline:calc(var(--_reach) / -2);font-size:var(--font-size-xs, .75rem);line-height:1rem;font-weight:var(--font-weight-medium, 500);text-align:center;overflow-wrap:anywhere;hyphens:auto}.lc-bottom-nav__item--current{color:var(--_current-fg)}.lc-bottom-nav__item--current .lc-bottom-nav__pill{background-color:var(--_current-bg)}.lc-bottom-nav__item--current .lc-bottom-nav__label{font-weight:var(--font-weight-bold, 700)}.lc-bottom-nav__item--current .lc-bottom-nav__icon ::ng-deep svg{stroke-width:2.4}.lc-bottom-nav__badge{position:absolute;top:-4px;left:calc(50% + 6px);display:flex;pointer-events:none}.lc-bottom-nav__item--current .lc-bottom-nav__badge ::ng-deep .lc-badge{background-image:linear-gradient(var(--lc-badge-bg),var(--lc-badge-bg));background-color:var(--lc-bottom-nav-bg, var(--_bg))}.lc-bottom-nav__sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media print{.lc-bottom-nav{display:none}}\n"]
 		}]
 	}],
 	propDecorators: {

package/fesm2022/lifecorner-angular-ui-kit-bottom-nav.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"lifecorner-angular-ui-kit-bottom-nav.mjs","names":[],"sources":["../../../../libs/angular-ui-kit/src/lib/bottom-nav/bottom-nav.component.ts","../../../../libs/angular-ui-kit/src/lib/bottom-nav/bottom-nav.component.html"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, input, output } from '@angular/core';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { RouterModule } from '@angular/router';\nimport { IconComponent, ɵprovideKitIcons } from '@lifecorner/angular-ui-kit/icon';\nimport { ICON_DOTS } from '@lifecorner/angular-ui-kit/icons';\nimport { BadgeComponent, type BadgeVariant } from '@lifecorner/angular-ui-kit/badge';\n\n/** A count or status on a bottom-nav entry (`BottomNavItem.badge`, `moreBadge`). */\nexport interface BottomNavBadge {\n  /** Text or number inside the badge. */\n  value: string | number;\n  /** Badge colour (`lc-badge` variant). */\n  variant?: BadgeVariant;\n}\n\n/**\n * A destination in the bottom navigation bar. A subset of `NavigationItem`, so\n * the side navigation's items can be passed as they are (sections and children\n * are ignored).\n */\nexport interface BottomNavItem {\n  /** Unique id. */\n  id: string;\n  /** Visible label, always shown below the icon. */\n  label: string;\n  /** Icon name (`lc-icon`), drawn at 24 px. */\n  icon: string;\n  /** Router path the item links to (`routerLink`). */\n  route: string;\n  /** Sort order; items without one keep their array order. */\n  displayOrder?: number;\n  /** Count or status shown on the icon; read out through `badgeAriaLabel`. */\n  badge?: BottomNavBadge;\n}\n\n/** Surface of the bar: `docked` spans the bottom edge, `floating` is an inset pill. */\nexport type BottomNavVariant = 'docked' | 'floating';\n\n/** One rendered entry: a destination or the overflow entry (\"More\"). */\ninterface BottomNavEntry {\n  item: BottomNavItem;\n  current: boolean;\n  more: boolean;\n}\n\n/**\n * Bottom navigation bar for phones and tablets: the app's main destinations as\n * links in the thumb zone.\n *\n * - Renders `<nav aria-label><ul><li><a routerLink>` — links, not tabs — with\n *   `aria-current=\"page\"` on the current destination.\n * - Items are at least 48 px high and 64 px wide: a 24 px icon over a 12 px\n *   label that is always visible and wraps at large text sizes.\n * - The current item sits on a 56 × 32 px pill in `--color-surface-selected`,\n *   its icon drawn heavier and its label bold in `--color-on-surface-selected`.\n * - The current item follows `activeRoute` by its first path segment, so a\n *   sub-page (`/household/members`) keeps its destination current; `/` only\n *   matches itself. Query and fragment are ignored.\n * - More than `maxItems` destinations: the first `maxItems − 1` stay, the\n *   rest move behind a \"More\" entry (`moreLabel`, `moreIcon`, `moreRoute`);\n *   without `moreRoute` the entry is a button that emits `moreClick`.\n * - `showMore`: \"More\" on request, also when every destination fits (fixed\n *   slots); it takes one of the `maxItems` entries.\n * - Tapping the current item emits `reselect` (scroll the page to the top).\n * - `variant=\"floating\"`: an inset pill 16 px from the sides and 16 px above\n *   the safe-area inset, radius 28 px, elevated. `docked` (default) spans the\n *   bottom edge with a top border and pads the safe-area inset.\n * - Fixed to the viewport by default (`fixed`), below menus and dialogs\n *   (`z-index` 900). Reserve space for it at the end of the page (see\n *   `lc-app-shell`, which does that for you).\n * - Light and dark from the semantic tokens; no hover-only information;\n *   transitions are off under `prefers-reduced-motion`.\n *\n * @example\n * ```html\n * <lc-bottom-nav\n *   variant=\"floating\"\n *   ariaLabel=\"Hauptnavigation\"\n *   [items]=\"[\n *     { id: 'today', label: 'Heute', icon: 'sun', route: '/' },\n *     { id: 'household', label: 'Haushalt', icon: 'home', route: '/household' }\n *   ]\"\n *   [activeRoute]=\"router.url\"\n *   (reselect)=\"scrollToTop()\"\n * />\n * ```\n */\n@Component({\n  selector: 'lc-bottom-nav',\n  standalone: true,\n  imports: [NgTemplateOutlet, RouterModule, IconComponent, BadgeComponent],\n  // The default \"more\" glyph (moreIcon); the items' glyphs are the app's.\n  viewProviders: [ɵprovideKitIcons([ICON_DOTS])],\n  templateUrl: './bottom-nav.component.html',\n  styleUrl: './bottom-nav.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    class: 'lc-bottom-nav-host',\n  },\n})\nexport class BottomNavComponent {\n  /** Destinations, left to right (sorted by `displayOrder` when given). */\n  readonly items = input<readonly BottomNavItem[]>([]);\n\n  /**\n   * The current URL (e.g. `router.url`). The item whose route matches its\n   * first path segment is current; `/` matches only itself.\n   */\n  readonly activeRoute = input('');\n\n  /** Accessible name of the `<nav>` landmark. */\n  readonly ariaLabel = input('Main navigation');\n\n  /** `docked` spans the bottom edge; `floating` is the inset, elevated pill (LK-5). */\n  readonly variant = input<BottomNavVariant>('docked');\n\n  /**\n   * Pin the bar to the bottom of the viewport. Turn off to render it in the\n   * document flow (previews, tests, a custom container).\n   */\n  readonly fixed = input(true);\n\n  /**\n   * Most entries the bar shows, \"More\" included. With more destinations, or\n   * with `showMore`, the first `maxItems − 1` stay and the rest go behind the\n   * \"More\" entry.\n   *\n   * @default 5\n   */\n  readonly maxItems = input(5);\n\n  /**\n   * Always end the bar with the \"More\" entry (`moreLabel`, `moreIcon`, and\n   * `moreRoute` or `moreClick`), even when every destination fits: for a bar\n   * with fixed slots, such as two destinations plus \"More\". \"More\" takes one\n   * of the `maxItems` entries, so the first `maxItems − 1` destinations stay\n   * and any others move behind it, as on overflow.\n   *\n   * @default false\n   */\n  readonly showMore = input(false);\n\n  /**\n   * Label of the \"More\" entry (on overflow or with `showMore`).\n   *\n   * @default 'More'\n   */\n  readonly moreLabel = input('More');\n\n  /**\n   * Icon of the \"More\" entry (on overflow or with `showMore`).\n   *\n   * @default 'dots'\n   */\n  readonly moreIcon = input('dots');\n\n  /**\n   * Route of the \"More\" entry (on overflow or with `showMore`): a page that\n   * lists the remaining destinations. Empty renders the entry as a button that\n   * emits `moreClick`.\n   *\n   * @default ''\n   */\n  readonly moreRoute = input('');\n\n  /**\n   * Badge on the \"More\" entry (on overflow or with `showMore`), e.g. the open\n   * tasks on the pages behind it: drawn like an item badge and read after the\n   * label through `badgeAriaLabel`. The kit doesn't add up the hidden\n   * destinations' badges; pass the value to show. It sits on the bar's last\n   * entry, so keep it to two characters (`'9+'`). `null` or `undefined`: no\n   * badge.\n   *\n   * @default null\n   */\n  readonly moreBadge = input<BottomNavBadge | null | undefined>(null);\n\n  /**\n   * Text read after an item's label, and after the \"More\" label with\n   * `moreBadge`, when it has a badge; `{value}` is replaced with the badge\n   * value (e.g. \"3 new\").\n   *\n   * @default '{value} new'\n   */\n  readonly badgeAriaLabel = input('{value} new');\n\n  /** The current item was tapped again (e.g. scroll the page to the top). */\n  readonly reselect = output<BottomNavItem>();\n\n  /** The \"More\" entry was tapped while it has no `moreRoute`. */\n  readonly moreClick = output<void>();\n\n  /** Destinations in display order. */\n  private readonly sortedItems = computed(() =>\n    [...this.items()].sort((a, b) => (a.displayOrder ?? 0) - (b.displayOrder ?? 0)),\n  );\n\n  /** Path of `activeRoute` without query and fragment. */\n  private readonly activePath = computed(() => this.activeRoute().split(/[?#]/)[0] || '/');\n\n  /**\n   * Entries as rendered: destinations plus, on overflow or with `showMore`,\n   * the \"More\" entry, which then takes one of the `maxItems` entries.\n   */\n  protected readonly entries = computed<BottomNavEntry[]>(() => {\n    const items = this.sortedItems();\n    const max = Math.max(1, Math.floor(this.maxItems()));\n    if (!this.showMore() && items.length <= max) {\n      return items.map((item) => ({ item, current: this.matches(item.route), more: false }));\n    }\n    const visible = items.slice(0, max - 1);\n    const hidden = items.slice(max - 1);\n    const moreRoute = this.moreRoute();\n    const moreItem: BottomNavItem = {\n      id: '__more',\n      label: this.moreLabel(),\n      icon: this.moreIcon(),\n      route: moreRoute,\n      badge: this.moreBadge() ?? undefined,\n    };\n    const moreCurrent =\n      (moreRoute !== '' && this.matches(moreRoute)) || hidden.some((item) => this.matches(item.route));\n    return [\n      ...visible.map((item) => ({ item, current: this.matches(item.route), more: false })),\n      { item: moreItem, current: moreCurrent, more: true },\n    ];\n  });\n\n  protected readonly navClasses = computed(() => {\n    const classes = ['lc-bottom-nav', `lc-bottom-nav--${this.variant()}`];\n    if (this.fixed()) classes.push('lc-bottom-nav--fixed');\n    return classes.join(' ');\n  });\n\n  /** Visually hidden badge text for screen readers. */\n  protected badgeText(item: BottomNavItem): string {\n    return item.badge ? this.badgeAriaLabel().replace('{value}', String(item.badge.value)) : '';\n  }\n\n  protected onItemClick(entry: BottomNavEntry): void {\n    if (entry.current && !entry.more) {\n      this.reselect.emit(entry.item);\n    }\n  }\n\n  protected onMoreButtonClick(): void {\n    this.moreClick.emit();\n  }\n\n  /** First-segment match: `/household/members` keeps `/household` current. */\n  private matches(route: string): boolean {\n    const path = this.activePath();\n    const target = route.split(/[?#]/)[0] || '/';\n    if (target === '/') return path === '/';\n    const normalized = target.endsWith('/') ? target.slice(0, -1) : target;\n    return path === normalized || path.startsWith(`${normalized}/`);\n  }\n}\n","<nav [class]=\"navClasses()\" [attr.aria-label]=\"ariaLabel()\">\n  <ul class=\"lc-bottom-nav__list\">\n    @for (entry of entries(); track entry.item.id) {\n      <li class=\"lc-bottom-nav__entry\">\n        @if (entry.more && !entry.item.route) {\n          <button\n            type=\"button\"\n            class=\"lc-bottom-nav__item\"\n            [class.lc-bottom-nav__item--current]=\"entry.current\"\n            (click)=\"onMoreButtonClick()\"\n          >\n            <ng-container [ngTemplateOutlet]=\"itemContent\" [ngTemplateOutletContext]=\"{ $implicit: entry }\" />\n          </button>\n        } @else {\n          <a\n            class=\"lc-bottom-nav__item\"\n            [class.lc-bottom-nav__item--current]=\"entry.current\"\n            [routerLink]=\"entry.item.route\"\n            [attr.aria-current]=\"entry.current ? 'page' : null\"\n            (click)=\"onItemClick(entry)\"\n          >\n            <ng-container [ngTemplateOutlet]=\"itemContent\" [ngTemplateOutletContext]=\"{ $implicit: entry }\" />\n          </a>\n        }\n      </li>\n    }\n  </ul>\n</nav>\n\n<ng-template #itemContent let-entry>\n  <!-- Icon and badge are decoration: the label and the hidden badge text name the link. -->\n  <span class=\"lc-bottom-nav__pill\" aria-hidden=\"true\">\n    <lc-icon [name]=\"entry.item.icon\" size=\"md\" [decorative]=\"true\" class=\"lc-bottom-nav__icon\" />\n    @if (entry.item.badge; as badge) {\n      <span class=\"lc-bottom-nav__badge\">\n        <lc-badge [variant]=\"badge.variant || 'default'\" size=\"xs\" [rounded]=\"true\">{{ badge.value }}</lc-badge>\n      </span>\n    }\n  </span>\n  <span class=\"lc-bottom-nav__label\">{{ entry.item.label }}</span>\n  @if (entry.item.badge) {\n    <span class=\"lc-bottom-nav__sr-only\">{{ badgeText(entry.item) }}</span>\n  }\n</ng-template>\n"],"mappings":"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"}
+{"version":3,"file":"lifecorner-angular-ui-kit-bottom-nav.mjs","names":[],"sources":["../../../../libs/angular-ui-kit/src/lib/bottom-nav/bottom-nav.component.ts","../../../../libs/angular-ui-kit/src/lib/bottom-nav/bottom-nav.component.html"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, input, output } from '@angular/core';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { RouterModule } from '@angular/router';\nimport { IconComponent, ɵprovideKitIcons } from '@lifecorner/angular-ui-kit/icon';\nimport { ICON_DOTS } from '@lifecorner/angular-ui-kit/icons';\nimport { BadgeComponent, type BadgeVariant } from '@lifecorner/angular-ui-kit/badge';\n\n/** A count or status on a bottom-nav entry (`BottomNavItem.badge`, `moreBadge`). */\nexport interface BottomNavBadge {\n  /** Text or number inside the badge. */\n  value: string | number;\n  /** Badge colour (`lc-badge` variant). */\n  variant?: BadgeVariant;\n}\n\n/**\n * A destination in the bottom navigation bar. A subset of `NavigationItem`, so\n * the side navigation's items can be passed as they are (sections and children\n * are ignored).\n */\nexport interface BottomNavItem {\n  /** Unique id. */\n  id: string;\n  /** Visible label, always shown below the icon. */\n  label: string;\n  /** Icon name (`lc-icon`), drawn at 24 px. */\n  icon: string;\n  /** Router path the item links to (`routerLink`). */\n  route: string;\n  /** Sort order; items without one keep their array order. */\n  displayOrder?: number;\n  /** Count or status shown on the icon; read out through `badgeAriaLabel`. */\n  badge?: BottomNavBadge;\n}\n\n/** Surface of the bar: `docked` spans the bottom edge, `floating` is an inset pill. */\nexport type BottomNavVariant = 'docked' | 'floating';\n\n/** One rendered entry: a destination or the overflow entry (\"More\"). */\ninterface BottomNavEntry {\n  item: BottomNavItem;\n  current: boolean;\n  more: boolean;\n}\n\n/**\n * Bottom navigation bar for phones and tablets: the app's main destinations as\n * links in the thumb zone.\n *\n * - Renders `<nav aria-label><ul><li><a routerLink>` — links, not tabs — with\n *   `aria-current=\"page\"` on the current destination.\n * - Items are at least 48 px high and 64 px wide: a 24 px icon over a 12 px\n *   label that is always visible and wraps at large text sizes.\n * - The current item sits on a 56 × 32 px pill in `--color-surface-selected`,\n *   its icon drawn heavier and its label bold in `--color-on-surface-selected`.\n * - The current item follows `activeRoute` by its first path segment, so a\n *   sub-page (`/household/members`) keeps its destination current; `/` only\n *   matches itself. Query and fragment are ignored.\n * - More than `maxItems` destinations: the first `maxItems − 1` stay, the\n *   rest move behind a \"More\" entry (`moreLabel`, `moreIcon`, `moreRoute`);\n *   without `moreRoute` the entry is a button that emits `moreClick`.\n * - `showMore`: \"More\" on request, also when every destination fits (fixed\n *   slots); it takes one of the `maxItems` entries.\n * - Tapping the current item emits `reselect` (scroll the page to the top).\n * - `variant=\"floating\"`: an inset pill 16 px from the sides and 16 px above\n *   the safe-area inset, radius 28 px, elevated. `docked` (default) spans the\n *   bottom edge with a top border and pads the safe-area inset.\n * - Fixed to the viewport by default (`fixed`), below menus and dialogs\n *   (`z-index` 900). Reserve space for it at the end of the page (see\n *   `lc-app-shell`, which does that for you).\n * - Light and dark from the semantic tokens; no hover-only information;\n *   transitions are off under `prefers-reduced-motion`.\n *\n * @example\n * ```html\n * <lc-bottom-nav\n *   variant=\"floating\"\n *   ariaLabel=\"Hauptnavigation\"\n *   [items]=\"[\n *     { id: 'today', label: 'Heute', icon: 'sun', route: '/' },\n *     { id: 'household', label: 'Haushalt', icon: 'home', route: '/household' }\n *   ]\"\n *   [activeRoute]=\"router.url\"\n *   (reselect)=\"scrollToTop()\"\n * />\n * ```\n */\n@Component({\n  selector: 'lc-bottom-nav',\n  standalone: true,\n  imports: [NgTemplateOutlet, RouterModule, IconComponent, BadgeComponent],\n  // The default \"more\" glyph (moreIcon); the items' glyphs are the app's.\n  viewProviders: [ɵprovideKitIcons([ICON_DOTS])],\n  templateUrl: './bottom-nav.component.html',\n  styleUrl: './bottom-nav.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    class: 'lc-bottom-nav-host',\n  },\n})\nexport class BottomNavComponent {\n  /** Destinations, left to right (sorted by `displayOrder` when given). */\n  readonly items = input<readonly BottomNavItem[]>([]);\n\n  /**\n   * The current URL (e.g. `router.url`). The item whose route matches its\n   * first path segment is current; `/` matches only itself.\n   */\n  readonly activeRoute = input('');\n\n  /** Accessible name of the `<nav>` landmark. */\n  readonly ariaLabel = input('Main navigation');\n\n  /** `docked` spans the bottom edge; `floating` is the inset, elevated pill (LK-5). */\n  readonly variant = input<BottomNavVariant>('docked');\n\n  /**\n   * Pin the bar to the bottom of the viewport. Turn off to render it in the\n   * document flow (previews, tests, a custom container).\n   */\n  readonly fixed = input(true);\n\n  /**\n   * Most entries the bar shows, \"More\" included. With more destinations, or\n   * with `showMore`, the first `maxItems − 1` stay and the rest go behind the\n   * \"More\" entry.\n   *\n   * @default 5\n   */\n  readonly maxItems = input(5);\n\n  /**\n   * Always end the bar with the \"More\" entry (`moreLabel`, `moreIcon`, and\n   * `moreRoute` or `moreClick`), even when every destination fits: for a bar\n   * with fixed slots, such as two destinations plus \"More\". \"More\" takes one\n   * of the `maxItems` entries, so the first `maxItems − 1` destinations stay\n   * and any others move behind it, as on overflow.\n   *\n   * @default false\n   */\n  readonly showMore = input(false);\n\n  /**\n   * Label of the \"More\" entry (on overflow or with `showMore`).\n   *\n   * @default 'More'\n   */\n  readonly moreLabel = input('More');\n\n  /**\n   * Icon of the \"More\" entry (on overflow or with `showMore`).\n   *\n   * @default 'dots'\n   */\n  readonly moreIcon = input('dots');\n\n  /**\n   * Route of the \"More\" entry (on overflow or with `showMore`): a page that\n   * lists the remaining destinations. Empty renders the entry as a button that\n   * emits `moreClick`.\n   *\n   * @default ''\n   */\n  readonly moreRoute = input('');\n\n  /**\n   * Badge on the \"More\" entry (on overflow or with `showMore`), e.g. the open\n   * tasks on the pages behind it: drawn like an item badge and read after the\n   * label through `badgeAriaLabel`. The kit doesn't add up the hidden\n   * destinations' badges; pass the value to show. It sits on the bar's last\n   * entry, so keep it to two characters (`'9+'`). `null` or `undefined`: no\n   * badge.\n   *\n   * @default null\n   */\n  readonly moreBadge = input<BottomNavBadge | null | undefined>(null);\n\n  /**\n   * Text read after an item's label, and after the \"More\" label with\n   * `moreBadge`, when it has a badge; `{value}` is replaced with the badge\n   * value (e.g. \"3 new\").\n   *\n   * @default '{value} new'\n   */\n  readonly badgeAriaLabel = input('{value} new');\n\n  /** The current item was tapped again (e.g. scroll the page to the top). */\n  readonly reselect = output<BottomNavItem>();\n\n  /** The \"More\" entry was tapped while it has no `moreRoute`. */\n  readonly moreClick = output<void>();\n\n  /** Destinations in display order. */\n  private readonly sortedItems = computed(() =>\n    [...this.items()].sort((a, b) => (a.displayOrder ?? 0) - (b.displayOrder ?? 0)),\n  );\n\n  /** Path of `activeRoute` without query and fragment. */\n  private readonly activePath = computed(() => this.activeRoute().split(/[?#]/)[0] || '/');\n\n  /**\n   * Entries as rendered: destinations plus, on overflow or with `showMore`,\n   * the \"More\" entry, which then takes one of the `maxItems` entries.\n   */\n  protected readonly entries = computed<BottomNavEntry[]>(() => {\n    const items = this.sortedItems();\n    const max = Math.max(1, Math.floor(this.maxItems()));\n    if (!this.showMore() && items.length <= max) {\n      return items.map((item) => ({ item, current: this.matches(item.route), more: false }));\n    }\n    const visible = items.slice(0, max - 1);\n    const hidden = items.slice(max - 1);\n    const moreRoute = this.moreRoute();\n    const moreItem: BottomNavItem = {\n      id: '__more',\n      label: this.moreLabel(),\n      icon: this.moreIcon(),\n      route: moreRoute,\n      badge: this.moreBadge() ?? undefined,\n    };\n    const moreCurrent =\n      (moreRoute !== '' && this.matches(moreRoute)) || hidden.some((item) => this.matches(item.route));\n    return [\n      ...visible.map((item) => ({ item, current: this.matches(item.route), more: false })),\n      { item: moreItem, current: moreCurrent, more: true },\n    ];\n  });\n\n  protected readonly navClasses = computed(() => {\n    const classes = ['lc-bottom-nav', `lc-bottom-nav--${this.variant()}`];\n    if (this.fixed()) classes.push('lc-bottom-nav--fixed');\n    return classes.join(' ');\n  });\n\n  /** Visually hidden badge text for screen readers. */\n  protected badgeText(item: BottomNavItem): string {\n    return item.badge ? this.badgeAriaLabel().replace('{value}', String(item.badge.value)) : '';\n  }\n\n  protected onItemClick(entry: BottomNavEntry): void {\n    if (entry.current && !entry.more) {\n      this.reselect.emit(entry.item);\n    }\n  }\n\n  protected onMoreButtonClick(): void {\n    this.moreClick.emit();\n  }\n\n  /** First-segment match: `/household/members` keeps `/household` current. */\n  private matches(route: string): boolean {\n    const path = this.activePath();\n    const target = route.split(/[?#]/)[0] || '/';\n    if (target === '/') return path === '/';\n    const normalized = target.endsWith('/') ? target.slice(0, -1) : target;\n    return path === normalized || path.startsWith(`${normalized}/`);\n  }\n}\n","<nav [class]=\"navClasses()\" [attr.aria-label]=\"ariaLabel()\">\n  <ul class=\"lc-bottom-nav__list\">\n    @for (entry of entries(); track entry.item.id) {\n      <li class=\"lc-bottom-nav__entry\">\n        @if (entry.more && !entry.item.route) {\n          <button\n            type=\"button\"\n            class=\"lc-bottom-nav__item\"\n            [class.lc-bottom-nav__item--current]=\"entry.current\"\n            (click)=\"onMoreButtonClick()\"\n          >\n            <ng-container [ngTemplateOutlet]=\"itemContent\" [ngTemplateOutletContext]=\"{ $implicit: entry }\" />\n          </button>\n        } @else {\n          <a\n            class=\"lc-bottom-nav__item\"\n            [class.lc-bottom-nav__item--current]=\"entry.current\"\n            [routerLink]=\"entry.item.route\"\n            [attr.aria-current]=\"entry.current ? 'page' : null\"\n            (click)=\"onItemClick(entry)\"\n          >\n            <ng-container [ngTemplateOutlet]=\"itemContent\" [ngTemplateOutletContext]=\"{ $implicit: entry }\" />\n          </a>\n        }\n      </li>\n    }\n  </ul>\n</nav>\n\n<ng-template #itemContent let-entry>\n  <!-- Icon and badge are decoration: the label and the hidden badge text name the link. -->\n  <span class=\"lc-bottom-nav__pill\" aria-hidden=\"true\">\n    <lc-icon [name]=\"entry.item.icon\" size=\"md\" [decorative]=\"true\" class=\"lc-bottom-nav__icon\" />\n    @if (entry.item.badge; as badge) {\n      <span class=\"lc-bottom-nav__badge\">\n        <lc-badge [variant]=\"badge.variant || 'default'\" size=\"xs\" [rounded]=\"true\">{{ badge.value }}</lc-badge>\n      </span>\n    }\n  </span>\n  <span class=\"lc-bottom-nav__label\">{{ entry.item.label }}</span>\n  @if (entry.item.badge) {\n    <span class=\"lc-bottom-nav__sr-only\">{{ badgeText(entry.item) }}</span>\n  }\n</ng-template>\n"],"mappings":"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"}

package/fesm2022/lifecorner-angular-ui-kit-combobox.mjs

@@ -35,6 +35,7 @@ var ComboboxComponent = class ComboboxComponent {
 	clearAriaLabel = input("Clear", ...ngDevMode ? [{ debugName: "clearAriaLabel" }] : /* istanbul ignore next */ []);
 	createOptionLabel = input("Create", ...ngDevMode ? [{ debugName: "createOptionLabel" }] : /* istanbul ignore next */ []);
 	size = input("md", ...ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []);
+	openOnFocus = input(true, ...ngDevMode ? [{ debugName: "openOnFocus" }] : /* istanbul ignore next */ []);
 	selectedValue = model(null, ...ngDevMode ? [{ debugName: "selectedValue" }] : /* istanbul ignore next */ []);
 	valueChange = output();
 	queryChange = output();
@@ -206,8 +207,12 @@ var ComboboxComponent = class ComboboxComponent {
 		if (!this.hitsFrameControl(event)) event.preventDefault();
 	}
 	onFrameClick(event) {
-		if (this.isDisabled() || this.hitsFrameControl(event)) return;
-		this.inputEl()?.nativeElement.focus();
+		if (this.isDisabled()) return;
+		if (!(event.target === this.inputEl()?.nativeElement)) {
+			if (this.hitsFrameControl(event)) return;
+			this.inputEl()?.nativeElement.focus();
+		}
+		if (!this.openOnFocus()) this.openIfAny();
 	}
 	onInputChange(event) {
 		const value = event.target.value;
@@ -218,6 +223,9 @@ var ComboboxComponent = class ComboboxComponent {
 		if (value.length >= this.minChars()) this.isOpen.set(true);
 	}
 	onInputFocus() {
+		if (this.openOnFocus()) this.openIfAny();
+	}
+	openIfAny() {
 		if (this.query().length >= this.minChars() || this.options().length > 0) this.isOpen.set(true);
 	}
 	onInputBlur() {
@@ -431,6 +439,13 @@ var ComboboxComponent = class ComboboxComponent {
 				isRequired: false,
 				transformFunction: null
 			},
+			openOnFocus: {
+				classPropertyName: "openOnFocus",
+				publicName: "openOnFocus",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
 			selectedValue: {
 				classPropertyName: "selectedValue",
 				publicName: "selectedValue",
@@ -723,6 +738,14 @@ i0.ɵɵngDeclareClassMetadata({
 				required: false
 			}]
 		}],
+		openOnFocus: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "openOnFocus",
+				required: false
+			}]
+		}],
 		selectedValue: [{
 			type: i0.Input,
 			args: [{

package/fesm2022/lifecorner-angular-ui-kit-combobox.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"lifecorner-angular-ui-kit-combobox.mjs","names":[],"sources":["../../../../libs/angular-ui-kit/src/lib/combobox/combobox.component.ts","../../../../libs/angular-ui-kit/src/lib/combobox/combobox.component.html"],"sourcesContent":["import {\n  Component,\n  ChangeDetectionStrategy,\n  input,\n  output,\n  signal,\n  computed,\n  afterRenderEffect,\n  effect,\n  forwardRef,\n  ElementRef,\n  viewChild,\n  HostListener,\n  inject,\n  isDevMode,\n  model,\n  untracked,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { OverlayModule } from '@angular/cdk/overlay';\nimport { Observable, Subject, catchError, debounce, defer, of, switchMap, timer } from 'rxjs';\nimport { IconComponent, ɵprovideKitIcons } from '@lifecorner/angular-ui-kit/icon';\nimport { ICON_PLUS, ICON_X_MARK } from '@lifecorner/angular-ui-kit/icons';\nimport { SpinnerComponent } from '@lifecorner/angular-ui-kit/spinner';\nimport { ChipComponent } from '@lifecorner/angular-ui-kit/chip';\nimport { closestLang } from '@lifecorner/angular-ui-kit/internal/a11y';\n\nexport interface ComboboxOption {\n  value: string;\n  label: string;\n  description?: string;\n  icon?: string;\n  group?: string;\n  disabled?: boolean;\n}\n\nexport type ComboboxValue = ComboboxOption | ComboboxOption[] | null;\n\nexport type ComboboxSize = 'xs' | 'sm' | 'md' | 'lg';\n\n/**\n * Combobox / async autocomplete component.\n *\n * Supports free-text input with sync/async option suggestions,\n * single/multiple selection, create new entries, and keyboard navigation.\n * The suggestion list is rendered in a CDK overlay so it is never clipped\n * by `overflow: hidden` ancestors (cards, modals, table cells). The dropdown\n * takes the `lang` of the host's closest `[lang]` (3.30.2).\n *\n * The selection is two-way bindable by an option's `value` string\n * (`[(selectedValue)]`, single mode), next to the `valueChange` output with\n * the option object and the forms binding.\n *\n * @example\n * ```html\n * <lc-combobox\n *   label=\"Assign to user\"\n *   [loadOptions]=\"searchUsers\"\n *   [(selectedValue)]=\"assigneeId\"\n *   allowCreate\n * />\n * ```\n */\n@Component({\n  selector: 'lc-combobox',\n  standalone: true,\n  imports: [OverlayModule, IconComponent, SpinnerComponent, ChipComponent],\n  viewProviders: [ɵprovideKitIcons([ICON_X_MARK, ICON_PLUS])],\n  templateUrl: './combobox.component.html',\n  styleUrls: ['./combobox.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => ComboboxComponent),\n      multi: true,\n    },\n  ],\n})\nexport class ComboboxComponent implements ControlValueAccessor {\n  private static nextId = 0;\n\n  /** Per-instance ids so label/listbox/options can be linked via ARIA */\n  readonly inputId = `lc-combobox-${++ComboboxComponent.nextId}`;\n  readonly listboxId = `${this.inputId}-listbox`;\n  protected readonly createOptionId = `${this.listboxId}-create`;\n\n  private readonly inputEl = viewChild<ElementRef<HTMLInputElement>>('inputEl');\n  private readonly dropdownEl = viewChild<ElementRef<HTMLElement>>('dropdownEl');\n\n  private readonly elRef = inject(ElementRef);\n  private readonly querySubject = new Subject<string>();\n\n  /** Sync options */\n  readonly options = input<ComboboxOption[]>([]);\n\n  /** Async option loader */\n  readonly loadOptions = input<((query: string) => Observable<ComboboxOption[]>)>();\n\n  /** Debounce for async queries */\n  readonly debounceMs = input<number>(250);\n\n  /** Minimum characters before triggering search */\n  readonly minChars = input<number>(1);\n\n  /** Placeholder text */\n  readonly placeholder = input<string>('Search…');\n\n  /** Label */\n  readonly label = input<string>();\n\n  /** Helper text */\n  readonly helperText = input<string>();\n\n  /** Error message */\n  readonly error = input<string>();\n\n  /** Disabled state */\n  readonly disabled = input<boolean>(false);\n\n  /** Allow multiple selections */\n  readonly multiple = input<boolean>(false);\n\n  /** Allow creating new entries */\n  readonly allowCreate = input<boolean>(false);\n\n  /** Show loading spinner (controlled) */\n  readonly loading = input<boolean>(false);\n\n  /** Empty state message */\n  readonly emptyMessage = input<string>('No results');\n\n  /** Accessible name of the clear button. */\n  readonly clearAriaLabel = input('Clear');\n\n  /** Label before the query in the \"create\" option (`allowCreate`): `Create \"query\"`. */\n  readonly createOptionLabel = input('Create');\n\n  /** Size */\n  readonly size = input<ComboboxSize>('md');\n\n  /**\n   * The `value` of the selected option, two-way (3.29, regeln row 2):\n   * `[(selectedValue)]=\"month\"`. Shows the matching option's label (from\n   * `options`, or the current selection); an unknown value shows an empty\n   * field and is filled in when `options` with it arrive. Page writes\n   * (including back to `null`) select or clear silently: no\n   * `selectedValueChange`, no `valueChange`, no forms `onChange`. Every user\n   * choice or clear emits `selectedValueChange`, next to the unchanged\n   * `valueChange` (the option object). Single mode only: ignored with\n   * `multiple` (a dev warning). Use it or a forms binding, not both.\n   * @default null\n   */\n  readonly selectedValue = model<string | null>(null);\n\n  /** Value change event */\n  readonly valueChange = output<ComboboxValue>();\n\n  /** Query change event */\n  readonly queryChange = output<string>();\n\n  /** Option selected event */\n  readonly optionSelected = output<ComboboxOption>();\n\n  /** Created event (allowCreate) */\n  readonly created = output<string>();\n\n  /** Internal state */\n  protected query = signal('');\n  protected isOpen = signal(false);\n  protected highlightedIndex = signal(-1);\n  protected asyncOptions = signal<ComboboxOption[]>([]);\n  protected isLoading = signal(false);\n\n  /** Disabled via `setDisabledState` (reactive forms) */\n  private readonly formDisabled = signal(false);\n\n  /** Effective disabled state: `disabled` input OR form control disabled */\n  protected readonly isDisabled = computed(() => this.disabled() || this.formDisabled());\n\n  /**\n   * `lang` of the open dropdown (3.30.2, WCAG 3.1.2): the overlay renders under\n   * `<body>`, so it takes the host's closest `[lang]`, else none. Read at every\n   * opening; `null` while closed, so the server never reads the DOM.\n   */\n  protected readonly panelLang = computed(() => (this.isOpen() ? closestLang(this.elRef.nativeElement) : null));\n\n  /** Selected values */\n  protected selectedSingle = signal<ComboboxOption | null>(null);\n  protected selectedMultiple = signal<ComboboxOption[]>([]);\n\n  /** The last `selectedValue` the component applied or emitted: a different one is a page write. */\n  private seenSelectedValue: string | null = null;\n\n  /** A page-written `selectedValue` no option matched yet: selected silently once `options` hold it. */\n  private pendingSelectedValue: string | null = null;\n\n  /** Resolved visible options */\n  protected visibleOptions = computed(() => {\n    const q = this.query().toLowerCase();\n    const loader = this.loadOptions();\n\n    let opts: ComboboxOption[];\n    if (loader) {\n      opts = this.asyncOptions();\n    } else {\n      opts = this.options();\n      if (q.length >= this.minChars()) {\n        opts = opts.filter(\n          (o) =>\n            o.label.toLowerCase().includes(q) ||\n            o.value.toLowerCase().includes(q) ||\n            (o.description && o.description.toLowerCase().includes(q))\n        );\n      }\n    }\n\n    // Remove already selected in multiple mode\n    if (this.multiple()) {\n      const selected = new Set(this.selectedMultiple().map((s) => s.value));\n      opts = opts.filter((o) => !selected.has(o.value));\n    }\n\n    return opts;\n  });\n\n  /** Grouped options */\n  protected groupedOptions = computed(() => {\n    const opts = this.visibleOptions();\n    const groups = new Map<string, ComboboxOption[]>();\n\n    for (const opt of opts) {\n      const group = opt.group || '';\n      if (!groups.has(group)) groups.set(group, []);\n      groups.get(group)!.push(opt);\n    }\n\n    return Array.from(groups.entries()).map(([label, items]) => ({\n      label,\n      items,\n    }));\n  });\n\n  /** Flat list for keyboard nav */\n  protected flatOptions = computed(() => {\n    return this.groupedOptions().flatMap((g) => g.items);\n  });\n\n  /** Whether to show \"Create\" option */\n  protected showCreateOption = computed(() => {\n    if (!this.allowCreate()) return false;\n    const q = this.query().trim();\n    if (!q) return false;\n    const exact = this.visibleOptions().some(\n      (o) => o.label.toLowerCase() === q.toLowerCase()\n    );\n    return !exact;\n  });\n\n  /** id of the highlighted option — announced via aria-activedescendant */\n  protected readonly activeDescendantId = computed(() => {\n    if (!this.isOpen()) return null;\n    const i = this.highlightedIndex();\n    if (i < 0) return null;\n    if (i === this.flatOptions().length) {\n      return this.showCreateOption() ? this.createOptionId : null;\n    }\n    return i < this.flatOptions().length ? this.optionId(i) : null;\n  });\n\n  /** ids referenced by aria-describedby (helper / error) */\n  protected readonly describedBy = computed(() => {\n    if (this.error()) return `${this.inputId}-error`;\n    if (this.helperText()) return `${this.inputId}-helper`;\n    return null;\n  });\n\n  /** Container classes */\n  protected containerClasses = computed(() => {\n    const classes = [`lc-combobox`, `lc-combobox--${this.size()}`];\n    if (this.isDisabled()) classes.push('lc-combobox--disabled');\n    if (this.error()) classes.push('lc-combobox--error');\n    if (this.isOpen()) classes.push('lc-combobox--open');\n    return classes.join(' ');\n  });\n\n  protected optionId(index: number): string {\n    return `${this.listboxId}-opt-${index}`;\n  }\n\n  // ControlValueAccessor\n  private onChange: (value: ComboboxValue) => void = () => { /* set by registerOnChange */ };\n  private onTouched: () => void = () => { /* set by registerOnTouched */ };\n\n  constructor() {\n    // Async loading pipe. `debounce` (not `debounceTime`) reads the signal per\n    // emission, so `debounceMs` is honoured after inputs are populated.\n    this.querySubject\n      .pipe(\n        debounce(() => timer(this.debounceMs())),\n        switchMap((q) => {\n          const loader = this.loadOptions();\n          if (!loader || q.length < this.minChars()) {\n            return of([] as ComboboxOption[]);\n          }\n          this.isLoading.set(true);\n          // `defer` turns a synchronously throwing loader into an error\n          // notification; `catchError` keeps the pipe alive for the next query.\n          return defer(() => loader(q)).pipe(catchError(() => of([] as ComboboxOption[])));\n        }),\n        takeUntilDestroyed()\n      )\n      .subscribe((results) => {\n        this.asyncOptions.set(results);\n        this.isLoading.set(false);\n      });\n\n    // Keep the highlighted option visible while navigating with the keyboard\n    // (after render, so the option element exists in the overlay pane).\n    afterRenderEffect(() => {\n      const id = this.activeDescendantId();\n      if (!id) return;\n      untracked(() => {\n        // ids are generated from a counter, so no CSS escaping is needed\n        this.dropdownEl()\n          ?.nativeElement.querySelector<HTMLElement>(`#${id}`)\n          ?.scrollIntoView?.({ block: 'nearest' });\n      });\n    });\n\n    // `selectedValue` (3.29): a page write selects or clears silently; an\n    // unknown value waits for `options` that hold it. The component's own\n    // writes (user choice, clear) are already applied, so they are skipped.\n    effect(() => {\n      const value = this.selectedValue();\n      const options = this.options();\n      untracked(() => {\n        if (value !== this.seenSelectedValue) {\n          this.seenSelectedValue = value;\n          if (!this.multiple()) {\n            this.applySelectedValue(value, options);\n          } else if (value !== null && isDevMode()) {\n            console.warn('[lc-combobox] selectedValue is ignored with multiple');\n          }\n        } else if (this.pendingSelectedValue !== null && !this.multiple()) {\n          this.applySelectedValue(this.pendingSelectedValue, options);\n        }\n      });\n    });\n  }\n\n  /** Shows the option with `value` (or clears for `null`) without emitting anything. */\n  private applySelectedValue(value: string | null, options: ComboboxOption[]): void {\n    this.pendingSelectedValue = null;\n    if (value === null) {\n      this.selectedSingle.set(null);\n      this.query.set('');\n      return;\n    }\n    if (this.selectedSingle()?.value === value) return;\n    const match = options.find((o) => o.value === value) ?? null;\n    if (!match) this.pendingSelectedValue = value;\n    this.selectedSingle.set(match);\n    this.query.set(match ? match.label : '');\n  }\n\n  /** Emits a user's single choice or clear through `selectedValueChange` (not in `multiple` mode). */\n  private emitSelectedValue(value: string | null): void {\n    if (this.multiple()) return;\n    this.pendingSelectedValue = null;\n    this.seenSelectedValue = value;\n    this.selectedValue.set(value);\n  }\n\n  writeValue(value: ComboboxValue): void {\n    if (this.multiple()) {\n      this.selectedMultiple.set(Array.isArray(value) ? value : []);\n    } else {\n      const single = value && !Array.isArray(value) ? value : null;\n      this.pendingSelectedValue = null;\n      this.selectedSingle.set(single);\n      this.query.set(single ? single.label : '');\n    }\n  }\n\n  registerOnChange(fn: (value: ComboboxValue) => void): void {\n    this.onChange = fn;\n  }\n\n  registerOnTouched(fn: () => void): void {\n    this.onTouched = fn;\n  }\n\n  setDisabledState(isDisabled: boolean): void {\n    this.formDisabled.set(isDisabled);\n    if (isDisabled) this.isOpen.set(false);\n  }\n\n  /**\n   * Clear the current selection and query. Emits `null` (single) or `[]`\n   * (multiple) exactly once, like a user-initiated deselect.\n   */\n  clear(): void {\n    this.query.set('');\n    this.highlightedIndex.set(-1);\n    this.isOpen.set(false);\n    const value: ComboboxValue = this.multiple() ? [] : null;\n    if (this.multiple()) {\n      this.selectedMultiple.set([]);\n    } else {\n      this.selectedSingle.set(null);\n    }\n    this.onChange(value);\n    this.valueChange.emit(value);\n    this.emitSelectedValue(null);\n  }\n\n  protected onClearClick(): void {\n    if (this.isDisabled()) return;\n    this.clear();\n    this.inputEl()?.nativeElement.focus();\n  }\n\n  /** Whether a pointer event on the frame hit the input or a button in it (chip ×, clear). */\n  private hitsFrameControl(event: MouseEvent): boolean {\n    const target = event.target as Element | null;\n    if (!target || target === this.inputEl()?.nativeElement) return true;\n    const button = target.closest('button');\n    return !!button && (event.currentTarget as Element).contains(button);\n  }\n\n  /**\n   * 3.30 (request 047, regeln row 6): a press on the frame beside the input\n   * and its buttons keeps focus where it is (no blur, so the list stays open).\n   */\n  protected onFrameMousedown(event: MouseEvent): void {\n    if (!this.hitsFrameControl(event)) event.preventDefault();\n  }\n\n  /** A click on the frame beside the input and its buttons focuses the input. */\n  protected onFrameClick(event: MouseEvent): void {\n    if (this.isDisabled() || this.hitsFrameControl(event)) return;\n    this.inputEl()?.nativeElement.focus();\n  }\n\n  protected onInputChange(event: Event): void {\n    const value = (event.target as HTMLInputElement).value;\n    this.query.set(value);\n    this.queryChange.emit(value);\n    this.highlightedIndex.set(-1);\n\n    if (this.loadOptions()) {\n      this.querySubject.next(value);\n    }\n\n    if (value.length >= this.minChars()) {\n      this.isOpen.set(true);\n    }\n  }\n\n  protected onInputFocus(): void {\n    if (this.query().length >= this.minChars() || this.options().length > 0) {\n      this.isOpen.set(true);\n    }\n  }\n\n  protected onInputBlur(): void {\n    this.onTouched();\n    // Delay to allow click on dropdown\n    setTimeout(() => this.isOpen.set(false), 200);\n  }\n\n  protected onKeydown(event: KeyboardEvent): void {\n    const flat = this.flatOptions();\n    const total = flat.length + (this.showCreateOption() ? 1 : 0);\n\n    switch (event.key) {\n      case 'ArrowDown':\n        event.preventDefault();\n        this.isOpen.set(true);\n        if (total > 0) this.highlightedIndex.update((i) => (i + 1) % total);\n        break;\n      case 'ArrowUp':\n        event.preventDefault();\n        if (total > 0) this.highlightedIndex.update((i) => (i - 1 + total) % total);\n        break;\n      case 'Enter':\n        event.preventDefault();\n        if (this.highlightedIndex() >= 0) {\n          if (this.highlightedIndex() === flat.length && this.showCreateOption()) {\n            this.onCreateNew();\n          } else {\n            const opt = flat[this.highlightedIndex()];\n            if (opt && !opt.disabled) {\n              this.selectOption(opt);\n            }\n          }\n        } else if (this.showCreateOption()) {\n          this.onCreateNew();\n        }\n        break;\n      case 'Escape':\n        if (this.isOpen()) {\n          this.isOpen.set(false);\n          this.highlightedIndex.set(-1);\n          // Escape consumed by the list — an enclosing modal must not close too.\n          event.stopPropagation();\n        }\n        break;\n      case 'Tab':\n        if (this.highlightedIndex() >= 0 && this.isOpen()) {\n          const opt = flat[this.highlightedIndex()];\n          if (opt && !opt.disabled) {\n            this.selectOption(opt);\n          }\n        }\n        this.isOpen.set(false);\n        break;\n      case 'Backspace':\n        if (this.multiple() && !this.query() && this.selectedMultiple().length > 0) {\n          this.removeSelected(this.selectedMultiple()[this.selectedMultiple().length - 1]);\n        }\n        break;\n    }\n  }\n\n  protected selectOption(option: ComboboxOption): void {\n    if (this.multiple()) {\n      this.selectedMultiple.update((sel) => [...sel, option]);\n      this.query.set('');\n      const value = this.selectedMultiple();\n      this.onChange(value);\n      this.valueChange.emit(value);\n    } else {\n      this.selectedSingle.set(option);\n      this.query.set(option.label);\n      this.onChange(option);\n      this.valueChange.emit(option);\n      this.emitSelectedValue(option.value);\n    }\n    this.optionSelected.emit(option);\n    this.isOpen.set(false);\n    this.highlightedIndex.set(-1);\n  }\n\n  protected removeSelected(option: ComboboxOption): void {\n    if (this.isDisabled()) return;\n    this.selectedMultiple.update((sel) =>\n      sel.filter((s) => s.value !== option.value)\n    );\n    const value = this.selectedMultiple();\n    this.onChange(value);\n    this.valueChange.emit(value);\n    this.inputEl()?.nativeElement.focus();\n  }\n\n  protected onCreateNew(): void {\n    const q = this.query().trim();\n    if (!q) return;\n    const newOption: ComboboxOption = { value: q, label: q };\n    this.created.emit(q);\n    this.selectOption(newOption);\n  }\n\n  @HostListener('document:click', ['$event'])\n  protected onDocumentClick(event: MouseEvent): void {\n    const target = event.target as Node | null;\n    // The dropdown lives in the CDK overlay container, outside the host element.\n    if (\n      !this.elRef.nativeElement.contains(target) &&\n      !this.dropdownEl()?.nativeElement.contains(target)\n    ) {\n      this.isOpen.set(false);\n    }\n  }\n}\n","<div [class]=\"containerClasses()\">\n  @if (label()) {\n    <label class=\"lc-combobox__label\" [for]=\"inputId\">{{ label() }}</label>\n  }\n\n  <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -- pointer shortcut; the input is the keyboard target -->\n  <div\n    #inputWrapper\n    class=\"lc-combobox__input-wrapper\"\n    (mousedown)=\"onFrameMousedown($event)\"\n    (click)=\"onFrameClick($event)\"\n  >\n    <!-- Selected chips (multiple mode) -->\n    @if (multiple()) {\n      @for (sel of selectedMultiple(); track sel.value) {\n        <lc-chip\n          [removable]=\"!isDisabled()\"\n          size=\"sm\"\n          (remove)=\"removeSelected(sel)\"\n        >{{ sel.label }}</lc-chip>\n      }\n    }\n\n    <input\n      #inputEl\n      type=\"text\"\n      class=\"lc-combobox__input\"\n      [id]=\"inputId\"\n      [placeholder]=\"multiple() && selectedMultiple().length > 0 ? '' : placeholder()\"\n      [value]=\"query()\"\n      [disabled]=\"isDisabled()\"\n      role=\"combobox\"\n      [attr.aria-expanded]=\"isOpen()\"\n      [attr.aria-controls]=\"isOpen() ? listboxId : null\"\n      [attr.aria-activedescendant]=\"activeDescendantId()\"\n      [attr.aria-invalid]=\"error() ? true : null\"\n      [attr.aria-describedby]=\"describedBy()\"\n      aria-autocomplete=\"list\"\n      aria-haspopup=\"listbox\"\n      autocomplete=\"off\"\n      (input)=\"onInputChange($event)\"\n      (focus)=\"onInputFocus()\"\n      (blur)=\"onInputBlur()\"\n      (keydown)=\"onKeydown($event)\"\n    />\n\n    @if (isLoading() || loading()) {\n      <lc-spinner size=\"sm\" class=\"lc-combobox__spinner\" />\n    } @else if (!multiple() && selectedSingle()) {\n      <button\n        type=\"button\"\n        class=\"lc-combobox__clear\"\n        [disabled]=\"isDisabled()\"\n        (mousedown)=\"$event.preventDefault()\"\n        (click)=\"onClearClick()\"\n        [attr.aria-label]=\"clearAriaLabel()\"\n      >\n        <lc-icon name=\"x-mark\" size=\"xs\" [decorative]=\"true\" />\n      </button>\n    }\n  </div>\n\n  <!-- Dropdown: rendered in the CDK overlay container so overflow-hidden\n       ancestors cannot clip it. Focus stays in the input (mousedown is\n       prevented on the panel), keyboard nav uses aria-activedescendant. -->\n  <ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOrigin]=\"inputWrapper\"\n    [cdkConnectedOverlayOpen]=\"isOpen()\"\n    [cdkConnectedOverlayMatchWidth]=\"true\"\n    (detach)=\"isOpen.set(false)\"\n  >\n    <div\n      #dropdownEl\n      class=\"lc-combobox__dropdown\"\n      role=\"listbox\"\n      [id]=\"listboxId\"\n      [attr.aria-multiselectable]=\"multiple() ? true : null\"\n      [attr.lang]=\"panelLang()\"\n      (mousedown)=\"$event.preventDefault()\"\n    >\n      @for (group of groupedOptions(); track group.label) {\n        @if (group.label) {\n          <div class=\"lc-combobox__group-header\" role=\"presentation\">{{ group.label }}</div>\n        }\n        @for (option of group.items; track option.value) {\n          @let idx = flatOptions().indexOf(option);\n          <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -- listbox option: focus stays in the input, keyboard selection via aria-activedescendant -->\n          <div\n            class=\"lc-combobox__option\"\n            [class.lc-combobox__option--highlighted]=\"idx === highlightedIndex()\"\n            [class.lc-combobox__option--disabled]=\"option.disabled\"\n            role=\"option\"\n            [id]=\"optionId(idx)\"\n            [attr.aria-selected]=\"idx === highlightedIndex()\"\n            [attr.aria-disabled]=\"option.disabled\"\n            (click)=\"!option.disabled && selectOption(option)\"\n            (mouseenter)=\"highlightedIndex.set(idx)\"\n          >\n            @if (option.icon) {\n              <lc-icon [name]=\"option.icon\" size=\"sm\" class=\"lc-combobox__option-icon\" [decorative]=\"true\" />\n            }\n            <div class=\"lc-combobox__option-content\">\n              <span class=\"lc-combobox__option-label\">{{ option.label }}</span>\n              @if (option.description) {\n                <span class=\"lc-combobox__option-desc\">{{ option.description }}</span>\n              }\n            </div>\n          </div>\n        }\n      }\n\n      @if (showCreateOption()) {\n        <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -- listbox option: focus stays in the input, keyboard selection via aria-activedescendant -->\n        <div\n          class=\"lc-combobox__option lc-combobox__option--create\"\n          [class.lc-combobox__option--highlighted]=\"highlightedIndex() === flatOptions().length\"\n          role=\"option\"\n          [id]=\"createOptionId\"\n          [attr.aria-selected]=\"highlightedIndex() === flatOptions().length\"\n          (click)=\"onCreateNew()\"\n          (mouseenter)=\"highlightedIndex.set(flatOptions().length)\"\n        >\n          <lc-icon name=\"plus\" size=\"sm\" [decorative]=\"true\" />\n          <span>{{ createOptionLabel() }} \"{{ query() }}\"</span>\n        </div>\n      }\n\n      @if (visibleOptions().length === 0 && !showCreateOption() && !isLoading() && !loading()) {\n        <div class=\"lc-combobox__empty\">{{ emptyMessage() }}</div>\n      }\n    </div>\n  </ng-template>\n\n  @if (helperText() && !error()) {\n    <span class=\"lc-combobox__helper\" [id]=\"inputId + '-helper'\">{{ helperText() }}</span>\n  }\n  @if (error()) {\n    <span class=\"lc-combobox__error\" [id]=\"inputId + '-error'\" role=\"alert\">{{ error() }}</span>\n  }\n</div>\n"],"mappings":"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"}
+{"version":3,"file":"lifecorner-angular-ui-kit-combobox.mjs","names":[],"sources":["../../../../libs/angular-ui-kit/src/lib/combobox/combobox.component.ts","../../../../libs/angular-ui-kit/src/lib/combobox/combobox.component.html"],"sourcesContent":["import {\n  Component,\n  ChangeDetectionStrategy,\n  input,\n  output,\n  signal,\n  computed,\n  afterRenderEffect,\n  effect,\n  forwardRef,\n  ElementRef,\n  viewChild,\n  HostListener,\n  inject,\n  isDevMode,\n  model,\n  untracked,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { OverlayModule } from '@angular/cdk/overlay';\nimport { Observable, Subject, catchError, debounce, defer, of, switchMap, timer } from 'rxjs';\nimport { IconComponent, ɵprovideKitIcons } from '@lifecorner/angular-ui-kit/icon';\nimport { ICON_PLUS, ICON_X_MARK } from '@lifecorner/angular-ui-kit/icons';\nimport { SpinnerComponent } from '@lifecorner/angular-ui-kit/spinner';\nimport { ChipComponent } from '@lifecorner/angular-ui-kit/chip';\nimport { closestLang } from '@lifecorner/angular-ui-kit/internal/a11y';\n\nexport interface ComboboxOption {\n  value: string;\n  label: string;\n  description?: string;\n  icon?: string;\n  group?: string;\n  disabled?: boolean;\n}\n\nexport type ComboboxValue = ComboboxOption | ComboboxOption[] | null;\n\nexport type ComboboxSize = 'xs' | 'sm' | 'md' | 'lg';\n\n/**\n * Combobox / async autocomplete component.\n *\n * Supports free-text input with sync/async option suggestions,\n * single/multiple selection, create new entries, and keyboard navigation.\n * The suggestion list is rendered in a CDK overlay so it is never clipped\n * by `overflow: hidden` ancestors (cards, modals, table cells). The dropdown\n * takes the `lang` of the host's closest `[lang]` (3.30.2).\n *\n * The selection is two-way bindable by an option's `value` string\n * (`[(selectedValue)]`, single mode), next to the `valueChange` output with\n * the option object and the forms binding.\n *\n * @example\n * ```html\n * <lc-combobox\n *   label=\"Assign to user\"\n *   [loadOptions]=\"searchUsers\"\n *   [(selectedValue)]=\"assigneeId\"\n *   allowCreate\n * />\n * ```\n */\n@Component({\n  selector: 'lc-combobox',\n  standalone: true,\n  imports: [OverlayModule, IconComponent, SpinnerComponent, ChipComponent],\n  viewProviders: [ɵprovideKitIcons([ICON_X_MARK, ICON_PLUS])],\n  templateUrl: './combobox.component.html',\n  styleUrls: ['./combobox.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => ComboboxComponent),\n      multi: true,\n    },\n  ],\n})\nexport class ComboboxComponent implements ControlValueAccessor {\n  private static nextId = 0;\n\n  /** Per-instance ids so label/listbox/options can be linked via ARIA */\n  readonly inputId = `lc-combobox-${++ComboboxComponent.nextId}`;\n  readonly listboxId = `${this.inputId}-listbox`;\n  protected readonly createOptionId = `${this.listboxId}-create`;\n\n  private readonly inputEl = viewChild<ElementRef<HTMLInputElement>>('inputEl');\n  private readonly dropdownEl = viewChild<ElementRef<HTMLElement>>('dropdownEl');\n\n  private readonly elRef = inject(ElementRef);\n  private readonly querySubject = new Subject<string>();\n\n  /** Sync options */\n  readonly options = input<ComboboxOption[]>([]);\n\n  /** Async option loader */\n  readonly loadOptions = input<((query: string) => Observable<ComboboxOption[]>)>();\n\n  /** Debounce for async queries */\n  readonly debounceMs = input<number>(250);\n\n  /** Minimum characters before triggering search */\n  readonly minChars = input<number>(1);\n\n  /** Placeholder text */\n  readonly placeholder = input<string>('Search…');\n\n  /** Label */\n  readonly label = input<string>();\n\n  /** Helper text */\n  readonly helperText = input<string>();\n\n  /** Error message */\n  readonly error = input<string>();\n\n  /** Disabled state */\n  readonly disabled = input<boolean>(false);\n\n  /** Allow multiple selections */\n  readonly multiple = input<boolean>(false);\n\n  /** Allow creating new entries */\n  readonly allowCreate = input<boolean>(false);\n\n  /** Show loading spinner (controlled) */\n  readonly loading = input<boolean>(false);\n\n  /** Empty state message */\n  readonly emptyMessage = input<string>('No results');\n\n  /** Accessible name of the clear button. */\n  readonly clearAriaLabel = input('Clear');\n\n  /** Label before the query in the \"create\" option (`allowCreate`): `Create \"query\"`. */\n  readonly createOptionLabel = input('Create');\n\n  /** Size */\n  readonly size = input<ComboboxSize>('md');\n\n  /**\n   * Whether the list opens when the field gets focus (3.32, request 051).\n   * With `false`, focus alone (`focus()` from the page, Tab) leaves the list\n   * closed and `aria-expanded=\"false\"`; a click or tap on the field, typing or\n   * ArrowDown opens it. Use it in forms that move focus into the field\n   * themselves, on open or to the first invalid field after a rejected save.\n   * Escape and choosing an option work as before.\n   * @default true\n   */\n  readonly openOnFocus = input<boolean>(true);\n\n  /**\n   * The `value` of the selected option, two-way (3.29, regeln row 2):\n   * `[(selectedValue)]=\"month\"`. Shows the matching option's label (from\n   * `options`, or the current selection); an unknown value shows an empty\n   * field and is filled in when `options` with it arrive. Page writes\n   * (including back to `null`) select or clear silently: no\n   * `selectedValueChange`, no `valueChange`, no forms `onChange`. Every user\n   * choice or clear emits `selectedValueChange`, next to the unchanged\n   * `valueChange` (the option object). Single mode only: ignored with\n   * `multiple` (a dev warning). Use it or a forms binding, not both.\n   * @default null\n   */\n  readonly selectedValue = model<string | null>(null);\n\n  /** Value change event */\n  readonly valueChange = output<ComboboxValue>();\n\n  /** Query change event */\n  readonly queryChange = output<string>();\n\n  /** Option selected event */\n  readonly optionSelected = output<ComboboxOption>();\n\n  /** Created event (allowCreate) */\n  readonly created = output<string>();\n\n  /** Internal state */\n  protected query = signal('');\n  protected isOpen = signal(false);\n  protected highlightedIndex = signal(-1);\n  protected asyncOptions = signal<ComboboxOption[]>([]);\n  protected isLoading = signal(false);\n\n  /** Disabled via `setDisabledState` (reactive forms) */\n  private readonly formDisabled = signal(false);\n\n  /** Effective disabled state: `disabled` input OR form control disabled */\n  protected readonly isDisabled = computed(() => this.disabled() || this.formDisabled());\n\n  /**\n   * `lang` of the open dropdown (3.30.2, WCAG 3.1.2): the overlay renders under\n   * `<body>`, so it takes the host's closest `[lang]`, else none. Read at every\n   * opening; `null` while closed, so the server never reads the DOM.\n   */\n  protected readonly panelLang = computed(() => (this.isOpen() ? closestLang(this.elRef.nativeElement) : null));\n\n  /** Selected values */\n  protected selectedSingle = signal<ComboboxOption | null>(null);\n  protected selectedMultiple = signal<ComboboxOption[]>([]);\n\n  /** The last `selectedValue` the component applied or emitted: a different one is a page write. */\n  private seenSelectedValue: string | null = null;\n\n  /** A page-written `selectedValue` no option matched yet: selected silently once `options` hold it. */\n  private pendingSelectedValue: string | null = null;\n\n  /** Resolved visible options */\n  protected visibleOptions = computed(() => {\n    const q = this.query().toLowerCase();\n    const loader = this.loadOptions();\n\n    let opts: ComboboxOption[];\n    if (loader) {\n      opts = this.asyncOptions();\n    } else {\n      opts = this.options();\n      if (q.length >= this.minChars()) {\n        opts = opts.filter(\n          (o) =>\n            o.label.toLowerCase().includes(q) ||\n            o.value.toLowerCase().includes(q) ||\n            (o.description && o.description.toLowerCase().includes(q))\n        );\n      }\n    }\n\n    // Remove already selected in multiple mode\n    if (this.multiple()) {\n      const selected = new Set(this.selectedMultiple().map((s) => s.value));\n      opts = opts.filter((o) => !selected.has(o.value));\n    }\n\n    return opts;\n  });\n\n  /** Grouped options */\n  protected groupedOptions = computed(() => {\n    const opts = this.visibleOptions();\n    const groups = new Map<string, ComboboxOption[]>();\n\n    for (const opt of opts) {\n      const group = opt.group || '';\n      if (!groups.has(group)) groups.set(group, []);\n      groups.get(group)!.push(opt);\n    }\n\n    return Array.from(groups.entries()).map(([label, items]) => ({\n      label,\n      items,\n    }));\n  });\n\n  /** Flat list for keyboard nav */\n  protected flatOptions = computed(() => {\n    return this.groupedOptions().flatMap((g) => g.items);\n  });\n\n  /** Whether to show \"Create\" option */\n  protected showCreateOption = computed(() => {\n    if (!this.allowCreate()) return false;\n    const q = this.query().trim();\n    if (!q) return false;\n    const exact = this.visibleOptions().some(\n      (o) => o.label.toLowerCase() === q.toLowerCase()\n    );\n    return !exact;\n  });\n\n  /** id of the highlighted option — announced via aria-activedescendant */\n  protected readonly activeDescendantId = computed(() => {\n    if (!this.isOpen()) return null;\n    const i = this.highlightedIndex();\n    if (i < 0) return null;\n    if (i === this.flatOptions().length) {\n      return this.showCreateOption() ? this.createOptionId : null;\n    }\n    return i < this.flatOptions().length ? this.optionId(i) : null;\n  });\n\n  /** ids referenced by aria-describedby (helper / error) */\n  protected readonly describedBy = computed(() => {\n    if (this.error()) return `${this.inputId}-error`;\n    if (this.helperText()) return `${this.inputId}-helper`;\n    return null;\n  });\n\n  /** Container classes */\n  protected containerClasses = computed(() => {\n    const classes = [`lc-combobox`, `lc-combobox--${this.size()}`];\n    if (this.isDisabled()) classes.push('lc-combobox--disabled');\n    if (this.error()) classes.push('lc-combobox--error');\n    if (this.isOpen()) classes.push('lc-combobox--open');\n    return classes.join(' ');\n  });\n\n  protected optionId(index: number): string {\n    return `${this.listboxId}-opt-${index}`;\n  }\n\n  // ControlValueAccessor\n  private onChange: (value: ComboboxValue) => void = () => { /* set by registerOnChange */ };\n  private onTouched: () => void = () => { /* set by registerOnTouched */ };\n\n  constructor() {\n    // Async loading pipe. `debounce` (not `debounceTime`) reads the signal per\n    // emission, so `debounceMs` is honoured after inputs are populated.\n    this.querySubject\n      .pipe(\n        debounce(() => timer(this.debounceMs())),\n        switchMap((q) => {\n          const loader = this.loadOptions();\n          if (!loader || q.length < this.minChars()) {\n            return of([] as ComboboxOption[]);\n          }\n          this.isLoading.set(true);\n          // `defer` turns a synchronously throwing loader into an error\n          // notification; `catchError` keeps the pipe alive for the next query.\n          return defer(() => loader(q)).pipe(catchError(() => of([] as ComboboxOption[])));\n        }),\n        takeUntilDestroyed()\n      )\n      .subscribe((results) => {\n        this.asyncOptions.set(results);\n        this.isLoading.set(false);\n      });\n\n    // Keep the highlighted option visible while navigating with the keyboard\n    // (after render, so the option element exists in the overlay pane).\n    afterRenderEffect(() => {\n      const id = this.activeDescendantId();\n      if (!id) return;\n      untracked(() => {\n        // ids are generated from a counter, so no CSS escaping is needed\n        this.dropdownEl()\n          ?.nativeElement.querySelector<HTMLElement>(`#${id}`)\n          ?.scrollIntoView?.({ block: 'nearest' });\n      });\n    });\n\n    // `selectedValue` (3.29): a page write selects or clears silently; an\n    // unknown value waits for `options` that hold it. The component's own\n    // writes (user choice, clear) are already applied, so they are skipped.\n    effect(() => {\n      const value = this.selectedValue();\n      const options = this.options();\n      untracked(() => {\n        if (value !== this.seenSelectedValue) {\n          this.seenSelectedValue = value;\n          if (!this.multiple()) {\n            this.applySelectedValue(value, options);\n          } else if (value !== null && isDevMode()) {\n            console.warn('[lc-combobox] selectedValue is ignored with multiple');\n          }\n        } else if (this.pendingSelectedValue !== null && !this.multiple()) {\n          this.applySelectedValue(this.pendingSelectedValue, options);\n        }\n      });\n    });\n  }\n\n  /** Shows the option with `value` (or clears for `null`) without emitting anything. */\n  private applySelectedValue(value: string | null, options: ComboboxOption[]): void {\n    this.pendingSelectedValue = null;\n    if (value === null) {\n      this.selectedSingle.set(null);\n      this.query.set('');\n      return;\n    }\n    if (this.selectedSingle()?.value === value) return;\n    const match = options.find((o) => o.value === value) ?? null;\n    if (!match) this.pendingSelectedValue = value;\n    this.selectedSingle.set(match);\n    this.query.set(match ? match.label : '');\n  }\n\n  /** Emits a user's single choice or clear through `selectedValueChange` (not in `multiple` mode). */\n  private emitSelectedValue(value: string | null): void {\n    if (this.multiple()) return;\n    this.pendingSelectedValue = null;\n    this.seenSelectedValue = value;\n    this.selectedValue.set(value);\n  }\n\n  writeValue(value: ComboboxValue): void {\n    if (this.multiple()) {\n      this.selectedMultiple.set(Array.isArray(value) ? value : []);\n    } else {\n      const single = value && !Array.isArray(value) ? value : null;\n      this.pendingSelectedValue = null;\n      this.selectedSingle.set(single);\n      this.query.set(single ? single.label : '');\n    }\n  }\n\n  registerOnChange(fn: (value: ComboboxValue) => void): void {\n    this.onChange = fn;\n  }\n\n  registerOnTouched(fn: () => void): void {\n    this.onTouched = fn;\n  }\n\n  setDisabledState(isDisabled: boolean): void {\n    this.formDisabled.set(isDisabled);\n    if (isDisabled) this.isOpen.set(false);\n  }\n\n  /**\n   * Clear the current selection and query. Emits `null` (single) or `[]`\n   * (multiple) exactly once, like a user-initiated deselect.\n   */\n  clear(): void {\n    this.query.set('');\n    this.highlightedIndex.set(-1);\n    this.isOpen.set(false);\n    const value: ComboboxValue = this.multiple() ? [] : null;\n    if (this.multiple()) {\n      this.selectedMultiple.set([]);\n    } else {\n      this.selectedSingle.set(null);\n    }\n    this.onChange(value);\n    this.valueChange.emit(value);\n    this.emitSelectedValue(null);\n  }\n\n  protected onClearClick(): void {\n    if (this.isDisabled()) return;\n    this.clear();\n    this.inputEl()?.nativeElement.focus();\n  }\n\n  /** Whether a pointer event on the frame hit the input or a button in it (chip ×, clear). */\n  private hitsFrameControl(event: MouseEvent): boolean {\n    const target = event.target as Element | null;\n    if (!target || target === this.inputEl()?.nativeElement) return true;\n    const button = target.closest('button');\n    return !!button && (event.currentTarget as Element).contains(button);\n  }\n\n  /**\n   * 3.30 (request 047, regeln row 6): a press on the frame beside the input\n   * and its buttons keeps focus where it is (no blur, so the list stays open).\n   */\n  protected onFrameMousedown(event: MouseEvent): void {\n    if (!this.hitsFrameControl(event)) event.preventDefault();\n  }\n\n  /**\n   * A click on the frame beside the input and its buttons focuses the input.\n   * With `openOnFocus` off (3.32, request 051), a click or tap on the input or\n   * the frame also opens the list, which focus alone no longer does.\n   */\n  protected onFrameClick(event: MouseEvent): void {\n    if (this.isDisabled()) return;\n    const onInput = event.target === this.inputEl()?.nativeElement;\n    if (!onInput) {\n      if (this.hitsFrameControl(event)) return;\n      this.inputEl()?.nativeElement.focus();\n    }\n    if (!this.openOnFocus()) this.openIfAny();\n  }\n\n  protected onInputChange(event: Event): void {\n    const value = (event.target as HTMLInputElement).value;\n    this.query.set(value);\n    this.queryChange.emit(value);\n    this.highlightedIndex.set(-1);\n\n    if (this.loadOptions()) {\n      this.querySubject.next(value);\n    }\n\n    if (value.length >= this.minChars()) {\n      this.isOpen.set(true);\n    }\n  }\n\n  protected onInputFocus(): void {\n    if (this.openOnFocus()) this.openIfAny();\n  }\n\n  /** Opens the list when there is something to show: a long enough query, or options. */\n  private openIfAny(): void {\n    if (this.query().length >= this.minChars() || this.options().length > 0) {\n      this.isOpen.set(true);\n    }\n  }\n\n  protected onInputBlur(): void {\n    this.onTouched();\n    // Delay to allow click on dropdown\n    setTimeout(() => this.isOpen.set(false), 200);\n  }\n\n  protected onKeydown(event: KeyboardEvent): void {\n    const flat = this.flatOptions();\n    const total = flat.length + (this.showCreateOption() ? 1 : 0);\n\n    switch (event.key) {\n      case 'ArrowDown':\n        event.preventDefault();\n        this.isOpen.set(true);\n        if (total > 0) this.highlightedIndex.update((i) => (i + 1) % total);\n        break;\n      case 'ArrowUp':\n        event.preventDefault();\n        if (total > 0) this.highlightedIndex.update((i) => (i - 1 + total) % total);\n        break;\n      case 'Enter':\n        event.preventDefault();\n        if (this.highlightedIndex() >= 0) {\n          if (this.highlightedIndex() === flat.length && this.showCreateOption()) {\n            this.onCreateNew();\n          } else {\n            const opt = flat[this.highlightedIndex()];\n            if (opt && !opt.disabled) {\n              this.selectOption(opt);\n            }\n          }\n        } else if (this.showCreateOption()) {\n          this.onCreateNew();\n        }\n        break;\n      case 'Escape':\n        if (this.isOpen()) {\n          this.isOpen.set(false);\n          this.highlightedIndex.set(-1);\n          // Escape consumed by the list — an enclosing modal must not close too.\n          event.stopPropagation();\n        }\n        break;\n      case 'Tab':\n        if (this.highlightedIndex() >= 0 && this.isOpen()) {\n          const opt = flat[this.highlightedIndex()];\n          if (opt && !opt.disabled) {\n            this.selectOption(opt);\n          }\n        }\n        this.isOpen.set(false);\n        break;\n      case 'Backspace':\n        if (this.multiple() && !this.query() && this.selectedMultiple().length > 0) {\n          this.removeSelected(this.selectedMultiple()[this.selectedMultiple().length - 1]);\n        }\n        break;\n    }\n  }\n\n  protected selectOption(option: ComboboxOption): void {\n    if (this.multiple()) {\n      this.selectedMultiple.update((sel) => [...sel, option]);\n      this.query.set('');\n      const value = this.selectedMultiple();\n      this.onChange(value);\n      this.valueChange.emit(value);\n    } else {\n      this.selectedSingle.set(option);\n      this.query.set(option.label);\n      this.onChange(option);\n      this.valueChange.emit(option);\n      this.emitSelectedValue(option.value);\n    }\n    this.optionSelected.emit(option);\n    this.isOpen.set(false);\n    this.highlightedIndex.set(-1);\n  }\n\n  protected removeSelected(option: ComboboxOption): void {\n    if (this.isDisabled()) return;\n    this.selectedMultiple.update((sel) =>\n      sel.filter((s) => s.value !== option.value)\n    );\n    const value = this.selectedMultiple();\n    this.onChange(value);\n    this.valueChange.emit(value);\n    this.inputEl()?.nativeElement.focus();\n  }\n\n  protected onCreateNew(): void {\n    const q = this.query().trim();\n    if (!q) return;\n    const newOption: ComboboxOption = { value: q, label: q };\n    this.created.emit(q);\n    this.selectOption(newOption);\n  }\n\n  @HostListener('document:click', ['$event'])\n  protected onDocumentClick(event: MouseEvent): void {\n    const target = event.target as Node | null;\n    // The dropdown lives in the CDK overlay container, outside the host element.\n    if (\n      !this.elRef.nativeElement.contains(target) &&\n      !this.dropdownEl()?.nativeElement.contains(target)\n    ) {\n      this.isOpen.set(false);\n    }\n  }\n}\n","<div [class]=\"containerClasses()\">\n  @if (label()) {\n    <label class=\"lc-combobox__label\" [for]=\"inputId\">{{ label() }}</label>\n  }\n\n  <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -- pointer shortcut; the input is the keyboard target -->\n  <div\n    #inputWrapper\n    class=\"lc-combobox__input-wrapper\"\n    (mousedown)=\"onFrameMousedown($event)\"\n    (click)=\"onFrameClick($event)\"\n  >\n    <!-- Selected chips (multiple mode) -->\n    @if (multiple()) {\n      @for (sel of selectedMultiple(); track sel.value) {\n        <lc-chip\n          [removable]=\"!isDisabled()\"\n          size=\"sm\"\n          (remove)=\"removeSelected(sel)\"\n        >{{ sel.label }}</lc-chip>\n      }\n    }\n\n    <input\n      #inputEl\n      type=\"text\"\n      class=\"lc-combobox__input\"\n      [id]=\"inputId\"\n      [placeholder]=\"multiple() && selectedMultiple().length > 0 ? '' : placeholder()\"\n      [value]=\"query()\"\n      [disabled]=\"isDisabled()\"\n      role=\"combobox\"\n      [attr.aria-expanded]=\"isOpen()\"\n      [attr.aria-controls]=\"isOpen() ? listboxId : null\"\n      [attr.aria-activedescendant]=\"activeDescendantId()\"\n      [attr.aria-invalid]=\"error() ? true : null\"\n      [attr.aria-describedby]=\"describedBy()\"\n      aria-autocomplete=\"list\"\n      aria-haspopup=\"listbox\"\n      autocomplete=\"off\"\n      (input)=\"onInputChange($event)\"\n      (focus)=\"onInputFocus()\"\n      (blur)=\"onInputBlur()\"\n      (keydown)=\"onKeydown($event)\"\n    />\n\n    @if (isLoading() || loading()) {\n      <lc-spinner size=\"sm\" class=\"lc-combobox__spinner\" />\n    } @else if (!multiple() && selectedSingle()) {\n      <button\n        type=\"button\"\n        class=\"lc-combobox__clear\"\n        [disabled]=\"isDisabled()\"\n        (mousedown)=\"$event.preventDefault()\"\n        (click)=\"onClearClick()\"\n        [attr.aria-label]=\"clearAriaLabel()\"\n      >\n        <lc-icon name=\"x-mark\" size=\"xs\" [decorative]=\"true\" />\n      </button>\n    }\n  </div>\n\n  <!-- Dropdown: rendered in the CDK overlay container so overflow-hidden\n       ancestors cannot clip it. Focus stays in the input (mousedown is\n       prevented on the panel), keyboard nav uses aria-activedescendant. -->\n  <ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOrigin]=\"inputWrapper\"\n    [cdkConnectedOverlayOpen]=\"isOpen()\"\n    [cdkConnectedOverlayMatchWidth]=\"true\"\n    (detach)=\"isOpen.set(false)\"\n  >\n    <div\n      #dropdownEl\n      class=\"lc-combobox__dropdown\"\n      role=\"listbox\"\n      [id]=\"listboxId\"\n      [attr.aria-multiselectable]=\"multiple() ? true : null\"\n      [attr.lang]=\"panelLang()\"\n      (mousedown)=\"$event.preventDefault()\"\n    >\n      @for (group of groupedOptions(); track group.label) {\n        @if (group.label) {\n          <div class=\"lc-combobox__group-header\" role=\"presentation\">{{ group.label }}</div>\n        }\n        @for (option of group.items; track option.value) {\n          @let idx = flatOptions().indexOf(option);\n          <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -- listbox option: focus stays in the input, keyboard selection via aria-activedescendant -->\n          <div\n            class=\"lc-combobox__option\"\n            [class.lc-combobox__option--highlighted]=\"idx === highlightedIndex()\"\n            [class.lc-combobox__option--disabled]=\"option.disabled\"\n            role=\"option\"\n            [id]=\"optionId(idx)\"\n            [attr.aria-selected]=\"idx === highlightedIndex()\"\n            [attr.aria-disabled]=\"option.disabled\"\n            (click)=\"!option.disabled && selectOption(option)\"\n            (mouseenter)=\"highlightedIndex.set(idx)\"\n          >\n            @if (option.icon) {\n              <lc-icon [name]=\"option.icon\" size=\"sm\" class=\"lc-combobox__option-icon\" [decorative]=\"true\" />\n            }\n            <div class=\"lc-combobox__option-content\">\n              <span class=\"lc-combobox__option-label\">{{ option.label }}</span>\n              @if (option.description) {\n                <span class=\"lc-combobox__option-desc\">{{ option.description }}</span>\n              }\n            </div>\n          </div>\n        }\n      }\n\n      @if (showCreateOption()) {\n        <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -- listbox option: focus stays in the input, keyboard selection via aria-activedescendant -->\n        <div\n          class=\"lc-combobox__option lc-combobox__option--create\"\n          [class.lc-combobox__option--highlighted]=\"highlightedIndex() === flatOptions().length\"\n          role=\"option\"\n          [id]=\"createOptionId\"\n          [attr.aria-selected]=\"highlightedIndex() === flatOptions().length\"\n          (click)=\"onCreateNew()\"\n          (mouseenter)=\"highlightedIndex.set(flatOptions().length)\"\n        >\n          <lc-icon name=\"plus\" size=\"sm\" [decorative]=\"true\" />\n          <span>{{ createOptionLabel() }} \"{{ query() }}\"</span>\n        </div>\n      }\n\n      @if (visibleOptions().length === 0 && !showCreateOption() && !isLoading() && !loading()) {\n        <div class=\"lc-combobox__empty\">{{ emptyMessage() }}</div>\n      }\n    </div>\n  </ng-template>\n\n  @if (helperText() && !error()) {\n    <span class=\"lc-combobox__helper\" [id]=\"inputId + '-helper'\">{{ helperText() }}</span>\n  }\n  @if (error()) {\n    <span class=\"lc-combobox__error\" [id]=\"inputId + '-error'\" role=\"alert\">{{ error() }}</span>\n  }\n</div>\n"],"mappings":"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"}

package/fesm2022/lifecorner-angular-ui-kit-tooltip.mjs

@@ -109,6 +109,7 @@ const FALLBACKS = {
 		"bottom"
 	]
 };
+const CONTROL = "a[href], button, input:not([type=hidden]), select, textarea, [tabindex]:not([tabindex=\"-1\"])";
 var TooltipDirective = class TooltipDirective {
 	static nextId = 0;
 	lcTooltip = input.required(...ngDevMode ? [{ debugName: "lcTooltip" }] : /* istanbul ignore next */ []);
@@ -119,6 +120,8 @@ var TooltipDirective = class TooltipDirective {
 	tooltipId = `lc-tooltip-${++TooltipDirective.nextId}`;
 	overlayRef;
 	tooltipRef;
+	positionStrategy;
+	describedEl;
 	positionSubscription;
 	showTimeout;
 	hideTimeout;
@@ -144,11 +147,24 @@ var TooltipDirective = class TooltipDirective {
 	onBlur() {
 		this.hideWithDelay();
 	}
+	onFocusIn(event) {
+		if (event.target === this.elementRef.nativeElement) return;
+		this.showWithDelay();
+	}
+	onFocusOut(event) {
+		const host = this.elementRef.nativeElement;
+		if (event.target === host) return;
+		const next = event.relatedTarget;
+		if (next && host.contains(next)) return;
+		this.hideWithDelay();
+	}
 	show() {
 		if (this.tooltipDisabled() || !this.lcTooltip()) return;
 		this.clearTimeouts();
 		if (!this.overlayRef) this.createOverlay();
 		if (!this.tooltipRef && this.overlayRef) {
+			const control = this.resolveControl();
+			this.positionStrategy?.setOrigin(this.resolveAnchor(control));
 			const portal = new ComponentPortal(TooltipContentComponent, this.viewContainerRef);
 			this.tooltipRef = this.overlayRef.attach(portal);
 			this.tooltipRef.instance.content = this.lcTooltip();
@@ -156,7 +172,7 @@ var TooltipDirective = class TooltipDirective {
 			this.renderer.setAttribute(tooltipEl, "id", this.tooltipId);
 			const lang = closestLang(this.elementRef.nativeElement);
 			if (lang !== null) this.renderer.setAttribute(tooltipEl, "lang", lang);
-			this.addDescribedBy();
+			this.addDescribedBy(control);
 			this.setPositionClass(this.tooltipPosition());
 			this.overlayStack.push(this.tooltipId);
 			if (typeof document !== "undefined") {
@@ -201,6 +217,7 @@ var TooltipDirective = class TooltipDirective {
 	}
 	createOverlay() {
 		const positionStrategy = this.overlay.position().flexibleConnectedTo(this.elementRef).withPositions(this.getPositions());
+		this.positionStrategy = positionStrategy;
 		this.positionSubscription = positionStrategy.positionChanges.subscribe((change) => {
 			const applied = POSITION_NAMES.find((p) => POSITIONS[p] === change.connectionPair);
 			if (applied) this.setPositionClass(applied);
@@ -220,19 +237,29 @@ var TooltipDirective = class TooltipDirective {
 		for (const p of POSITION_NAMES) this.renderer.removeClass(tooltipEl, `lc-tooltip--${p}`);
 		this.renderer.addClass(tooltipEl, `lc-tooltip--${position}`);
 	}
-	addDescribedBy() {
+	resolveControl() {
+		const host = this.elementRef.nativeElement;
+		if (host.matches(CONTROL)) return host;
+		return host.querySelector(CONTROL) ?? host;
+	}
+	resolveAnchor(control) {
 		const host = this.elementRef.nativeElement;
-		const ids = (host.getAttribute("aria-describedby") ?? "").split(/\s+/).filter(Boolean);
+		return control !== host && host.childElementCount === 1 && host.firstElementChild === control ? control : host;
+	}
+	addDescribedBy(el) {
+		this.describedEl = el;
+		const ids = (el.getAttribute("aria-describedby") ?? "").split(/\s+/).filter(Boolean);
 		if (!ids.includes(this.tooltipId)) ids.push(this.tooltipId);
-		this.renderer.setAttribute(host, "aria-describedby", ids.join(" "));
+		this.renderer.setAttribute(el, "aria-describedby", ids.join(" "));
 	}
 	removeDescribedBy() {
-		const host = this.elementRef.nativeElement;
-		const ids = (host.getAttribute("aria-describedby") ?? "").split(/\s+/).filter(Boolean);
+		const el = this.describedEl ?? this.elementRef.nativeElement;
+		this.describedEl = void 0;
+		const ids = (el.getAttribute("aria-describedby") ?? "").split(/\s+/).filter(Boolean);
 		if (!ids.includes(this.tooltipId)) return;
 		const rest = ids.filter((id) => id !== this.tooltipId);
-		if (rest.length) this.renderer.setAttribute(host, "aria-describedby", rest.join(" "));
-		else this.renderer.removeAttribute(host, "aria-describedby");
+		if (rest.length) this.renderer.setAttribute(el, "aria-describedby", rest.join(" "));
+		else this.renderer.removeAttribute(el, "aria-describedby");
 	}
 	clearTimeouts() {
 		if (this.showTimeout) {
@@ -248,6 +275,7 @@ var TooltipDirective = class TooltipDirective {
 		this.clearTimeouts();
 		this.positionSubscription?.unsubscribe();
 		this.positionSubscription = void 0;
+		this.positionStrategy = void 0;
 		if (this.overlayRef) {
 			this.overlayRef.dispose();
 			this.overlayRef = void 0;
@@ -308,7 +336,9 @@ var TooltipDirective = class TooltipDirective {
 			"mouseenter": "onMouseEnter()",
 			"mouseleave": "onMouseLeave()",
 			"focus": "onFocus()",
-			"blur": "onBlur()"
+			"blur": "onBlur()",
+			"focusin": "onFocusIn($event)",
+			"focusout": "onFocusOut($event)"
 		} },
 		ngImport: i0
 	});
@@ -381,6 +411,14 @@ i0.ɵɵngDeclareClassMetadata({
 		onBlur: [{
 			type: HostListener,
 			args: ["blur"]
+		}],
+		onFocusIn: [{
+			type: HostListener,
+			args: ["focusin", ["$event"]]
+		}],
+		onFocusOut: [{
+			type: HostListener,
+			args: ["focusout", ["$event"]]
 		}]
 	}
 });

package/fesm2022/lifecorner-angular-ui-kit-tooltip.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"lifecorner-angular-ui-kit-tooltip.mjs","names":[],"sources":["../../../../libs/angular-ui-kit/src/lib/tooltip/tooltip.directive.ts"],"sourcesContent":["import {\n  Directive,\n  input,\n  ElementRef,\n  OnDestroy,\n  Renderer2,\n  ViewContainerRef,\n  ComponentRef,\n  HostListener,\n  Component,\n  ChangeDetectionStrategy,\n  inject,\n} from '@angular/core';\nimport { Overlay, OverlayRef, ConnectedPosition } from '@angular/cdk/overlay';\nimport { ComponentPortal } from '@angular/cdk/portal';\nimport { Subscription } from 'rxjs';\nimport { OverlayStackService } from '@lifecorner/angular-ui-kit/internal/overlay';\nimport { closestLang } from '@lifecorner/angular-ui-kit/internal/a11y';\n\nexport type TooltipPosition = 'top' | 'bottom' | 'left' | 'right';\n\n/**\n * Internal tooltip content component\n */\n@Component({\n  selector: 'lc-tooltip-content',\n  standalone: true,\n  imports: [],\n  template: `<div class=\"lc-tooltip-inner\">{{ content }}</div>`,\n  styles: [\n    `\n      :host {\n        display: block;\n        /* Inverted surface: reads as a tooltip in both themes and keeps AAA\n           contrast — near-white on the dark theme, near-black on the light one. */\n        background-color: var(--color-text-primary);\n        color: var(--color-surface);\n        padding: 0.5rem 0.75rem;\n        border-radius: var(--border-radius-md, 0.375rem);\n        font-size: var(--font-size-sm, 0.875rem);\n        line-height: 1.25rem;\n        max-width: 300px;\n        word-wrap: break-word;\n        box-shadow: var(--elevation-2);\n      }\n\n      .lc-tooltip-inner {\n        position: relative;\n      }\n    `,\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    class: 'lc-tooltip',\n    role: 'tooltip',\n  },\n})\nexport class TooltipContentComponent {\n  content = '';\n}\n\nconst POSITIONS: Record<TooltipPosition, ConnectedPosition> = {\n  top: {\n    originX: 'center',\n    originY: 'top',\n    overlayX: 'center',\n    overlayY: 'bottom',\n    offsetY: -8,\n    panelClass: 'lc-tooltip--top',\n  },\n  bottom: {\n    originX: 'center',\n    originY: 'bottom',\n    overlayX: 'center',\n    overlayY: 'top',\n    offsetY: 8,\n    panelClass: 'lc-tooltip--bottom',\n  },\n  left: {\n    originX: 'start',\n    originY: 'center',\n    overlayX: 'end',\n    overlayY: 'center',\n    offsetX: -8,\n    panelClass: 'lc-tooltip--left',\n  },\n  right: {\n    originX: 'end',\n    originY: 'center',\n    overlayX: 'start',\n    overlayY: 'center',\n    offsetX: 8,\n    panelClass: 'lc-tooltip--right',\n  },\n};\n\nconst POSITION_NAMES = Object.keys(POSITIONS) as TooltipPosition[];\n\n/** Fallback order when the preferred side does not fit the viewport. */\nconst FALLBACKS: Record<TooltipPosition, TooltipPosition[]> = {\n  top: ['bottom', 'right', 'left'],\n  bottom: ['top', 'right', 'left'],\n  left: ['right', 'top', 'bottom'],\n  right: ['left', 'top', 'bottom'],\n};\n\n/**\n * Tooltip directive for displaying contextual information.\n * Uses Angular CDK Overlay for positioning; flips to the opposite side when\n * the preferred one does not fit the viewport, and can be dismissed with\n * Escape (WCAG 1.4.13).\n *\n * The tooltip takes the `lang` of the host's closest `[lang]` (3.31).\n *\n * @example\n * ```html\n * <button lcTooltip=\"Click me!\" tooltipPosition=\"top\">\n *   Hover or focus\n * </button>\n * ```\n */\n@Directive({\n  selector: '[lcTooltip]',\n  standalone: true,\n})\nexport class TooltipDirective implements OnDestroy {\n  private static nextId = 0;\n\n  /**\n   * Tooltip content text\n   */\n  lcTooltip = input.required<string>();\n\n  /**\n   * Tooltip position\n   * @default 'top'\n   */\n  tooltipPosition = input<TooltipPosition>('top');\n\n  /**\n   * Show delay in milliseconds\n   * @default 0\n   */\n  tooltipShowDelay = input<number>(0);\n\n  /**\n   * Hide delay in milliseconds\n   * @default 0\n   */\n  tooltipHideDelay = input<number>(0);\n\n  /**\n   * Whether tooltip is disabled\n   * @default false\n   */\n  tooltipDisabled = input<boolean>(false);\n\n  /** Id of the tooltip element; the host's `aria-describedby` points at it while shown. */\n  readonly tooltipId = `lc-tooltip-${++TooltipDirective.nextId}`;\n\n  private overlayRef?: OverlayRef;\n  private tooltipRef?: ComponentRef<TooltipContentComponent>;\n  private positionSubscription?: Subscription;\n  private showTimeout?: number;\n  private hideTimeout?: number;\n  private escapeListener?: (event: KeyboardEvent) => void;\n\n  private readonly elementRef = inject<ElementRef<HTMLElement>>(ElementRef);\n  private readonly overlay = inject(Overlay);\n  private readonly viewContainerRef = inject(ViewContainerRef);\n  private readonly renderer = inject(Renderer2);\n  private readonly overlayStack = inject(OverlayStackService);\n\n  ngOnDestroy(): void {\n    this.hide();\n    this.cleanup();\n  }\n\n  @HostListener('mouseenter')\n  onMouseEnter(): void {\n    this.showWithDelay();\n  }\n\n  @HostListener('mouseleave')\n  onMouseLeave(): void {\n    this.hideWithDelay();\n  }\n\n  @HostListener('focus')\n  onFocus(): void {\n    this.showWithDelay();\n  }\n\n  @HostListener('blur')\n  onBlur(): void {\n    this.hideWithDelay();\n  }\n\n  /**\n   * Show tooltip programmatically\n   */\n  show(): void {\n    if (this.tooltipDisabled() || !this.lcTooltip()) {\n      return;\n    }\n\n    this.clearTimeouts();\n\n    if (!this.overlayRef) {\n      this.createOverlay();\n    }\n\n    if (!this.tooltipRef && this.overlayRef) {\n      const portal = new ComponentPortal(TooltipContentComponent, this.viewContainerRef);\n      this.tooltipRef = this.overlayRef.attach(portal) as ComponentRef<TooltipContentComponent>;\n      this.tooltipRef.instance.content = this.lcTooltip();\n\n      const tooltipEl = this.tooltipRef.location.nativeElement as HTMLElement;\n      // The id is what the host's aria-describedby points at\n      this.renderer.setAttribute(tooltipEl, 'id', this.tooltipId);\n      // The overlay renders under <body>, outside the host's lang (WCAG 3.1.2):\n      // the tooltip takes the host's closest [lang], read at every show\n      const lang = closestLang(this.elementRef.nativeElement);\n      if (lang !== null) this.renderer.setAttribute(tooltipEl, 'lang', lang);\n      this.addDescribedBy();\n      this.setPositionClass(this.tooltipPosition());\n\n      // Escape dismisses the tooltip (WCAG 1.4.13) — only when it is the\n      // top-most overlay, so a modal underneath is not closed by the same key\n      this.overlayStack.push(this.tooltipId);\n      if (typeof document !== 'undefined') {\n        this.escapeListener = (event: KeyboardEvent) => {\n          if (event.key !== 'Escape' || !this.overlayStack.claim(this.tooltipId, event)) return;\n          event.stopPropagation();\n          this.hide();\n        };\n        document.addEventListener('keydown', this.escapeListener);\n      }\n    }\n  }\n\n  /**\n   * Hide tooltip programmatically\n   */\n  hide(): void {\n    this.clearTimeouts();\n\n    if (this.escapeListener) {\n      document.removeEventListener('keydown', this.escapeListener);\n      this.escapeListener = undefined;\n    }\n    this.overlayStack.remove(this.tooltipId);\n\n    if (this.tooltipRef) {\n      this.tooltipRef.destroy();\n      this.tooltipRef = undefined;\n    }\n\n    if (this.overlayRef) {\n      this.overlayRef.detach();\n    }\n\n    this.removeDescribedBy();\n  }\n\n  /**\n   * Toggle tooltip visibility\n   */\n  toggle(): void {\n    if (this.tooltipRef) {\n      this.hide();\n    } else {\n      this.show();\n    }\n  }\n\n  private showWithDelay(): void {\n    this.clearTimeouts();\n    const delay = this.tooltipShowDelay();\n\n    if (delay > 0) {\n      this.showTimeout = window.setTimeout(() => this.show(), delay);\n    } else {\n      this.show();\n    }\n  }\n\n  private hideWithDelay(): void {\n    this.clearTimeouts();\n    const delay = this.tooltipHideDelay();\n\n    if (delay > 0) {\n      this.hideTimeout = window.setTimeout(() => this.hide(), delay);\n    } else {\n      this.hide();\n    }\n  }\n\n  private createOverlay(): void {\n    const positionStrategy = this.overlay\n      .position()\n      .flexibleConnectedTo(this.elementRef)\n      .withPositions(this.getPositions());\n\n    // Keep the tooltip element's position class in sync with the side the\n    // overlay actually chose (it flips at viewport edges)\n    this.positionSubscription = positionStrategy.positionChanges.subscribe((change) => {\n      const applied = POSITION_NAMES.find((p) => POSITIONS[p] === change.connectionPair);\n      if (applied) this.setPositionClass(applied);\n    });\n\n    this.overlayRef = this.overlay.create({\n      positionStrategy,\n      scrollStrategy: this.overlay.scrollStrategies.reposition(),\n    }) as OverlayRef;\n  }\n\n  /** Preferred position first, then the fallbacks the overlay may flip to. */\n  private getPositions(): ConnectedPosition[] {\n    const position = this.tooltipPosition();\n    return [position, ...FALLBACKS[position]].map((p) => POSITIONS[p]);\n  }\n\n  private setPositionClass(position: TooltipPosition): void {\n    const tooltipEl = this.tooltipRef?.location.nativeElement as HTMLElement | undefined;\n    if (!tooltipEl) return;\n    for (const p of POSITION_NAMES) {\n      this.renderer.removeClass(tooltipEl, `lc-tooltip--${p}`);\n    }\n    this.renderer.addClass(tooltipEl, `lc-tooltip--${position}`);\n  }\n\n  /** Append the tooltip id to the host's aria-describedby without clobbering ids the caller set. */\n  private addDescribedBy(): void {\n    const host = this.elementRef.nativeElement;\n    const ids = (host.getAttribute('aria-describedby') ?? '').split(/\\s+/).filter(Boolean);\n    if (!ids.includes(this.tooltipId)) ids.push(this.tooltipId);\n    this.renderer.setAttribute(host, 'aria-describedby', ids.join(' '));\n  }\n\n  private removeDescribedBy(): void {\n    const host = this.elementRef.nativeElement;\n    const ids = (host.getAttribute('aria-describedby') ?? '').split(/\\s+/).filter(Boolean);\n    if (!ids.includes(this.tooltipId)) return;\n    const rest = ids.filter((id) => id !== this.tooltipId);\n    if (rest.length) {\n      this.renderer.setAttribute(host, 'aria-describedby', rest.join(' '));\n    } else {\n      this.renderer.removeAttribute(host, 'aria-describedby');\n    }\n  }\n\n  private clearTimeouts(): void {\n    if (this.showTimeout) {\n      window.clearTimeout(this.showTimeout);\n      this.showTimeout = undefined;\n    }\n    if (this.hideTimeout) {\n      window.clearTimeout(this.hideTimeout);\n      this.hideTimeout = undefined;\n    }\n  }\n\n  private cleanup(): void {\n    this.clearTimeouts();\n    this.positionSubscription?.unsubscribe();\n    this.positionSubscription = undefined;\n    if (this.overlayRef) {\n      this.overlayRef.dispose();\n      this.overlayRef = undefined;\n    }\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"lifecorner-angular-ui-kit-tooltip.mjs","names":[],"sources":["../../../../libs/angular-ui-kit/src/lib/tooltip/tooltip.directive.ts"],"sourcesContent":["import {\n  Directive,\n  input,\n  ElementRef,\n  OnDestroy,\n  Renderer2,\n  ViewContainerRef,\n  ComponentRef,\n  HostListener,\n  Component,\n  ChangeDetectionStrategy,\n  inject,\n} from '@angular/core';\nimport { Overlay, OverlayRef, ConnectedPosition, FlexibleConnectedPositionStrategy } from '@angular/cdk/overlay';\nimport { ComponentPortal } from '@angular/cdk/portal';\nimport { Subscription } from 'rxjs';\nimport { OverlayStackService } from '@lifecorner/angular-ui-kit/internal/overlay';\nimport { closestLang } from '@lifecorner/angular-ui-kit/internal/a11y';\n\nexport type TooltipPosition = 'top' | 'bottom' | 'left' | 'right';\n\n/**\n * Internal tooltip content component\n */\n@Component({\n  selector: 'lc-tooltip-content',\n  standalone: true,\n  imports: [],\n  template: `<div class=\"lc-tooltip-inner\">{{ content }}</div>`,\n  styles: [\n    `\n      :host {\n        display: block;\n        /* Inverted surface: reads as a tooltip in both themes and keeps AAA\n           contrast — near-white on the dark theme, near-black on the light one. */\n        background-color: var(--color-text-primary);\n        color: var(--color-surface);\n        padding: 0.5rem 0.75rem;\n        border-radius: var(--border-radius-md, 0.375rem);\n        font-size: var(--font-size-sm, 0.875rem);\n        line-height: 1.25rem;\n        max-width: 300px;\n        word-wrap: break-word;\n        box-shadow: var(--elevation-2);\n      }\n\n      .lc-tooltip-inner {\n        position: relative;\n      }\n    `,\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    class: 'lc-tooltip',\n    role: 'tooltip',\n  },\n})\nexport class TooltipContentComponent {\n  content = '';\n}\n\nconst POSITIONS: Record<TooltipPosition, ConnectedPosition> = {\n  top: {\n    originX: 'center',\n    originY: 'top',\n    overlayX: 'center',\n    overlayY: 'bottom',\n    offsetY: -8,\n    panelClass: 'lc-tooltip--top',\n  },\n  bottom: {\n    originX: 'center',\n    originY: 'bottom',\n    overlayX: 'center',\n    overlayY: 'top',\n    offsetY: 8,\n    panelClass: 'lc-tooltip--bottom',\n  },\n  left: {\n    originX: 'start',\n    originY: 'center',\n    overlayX: 'end',\n    overlayY: 'center',\n    offsetX: -8,\n    panelClass: 'lc-tooltip--left',\n  },\n  right: {\n    originX: 'end',\n    originY: 'center',\n    overlayX: 'start',\n    overlayY: 'center',\n    offsetX: 8,\n    panelClass: 'lc-tooltip--right',\n  },\n};\n\nconst POSITION_NAMES = Object.keys(POSITIONS) as TooltipPosition[];\n\n/** Fallback order when the preferred side does not fit the viewport. */\nconst FALLBACKS: Record<TooltipPosition, TooltipPosition[]> = {\n  top: ['bottom', 'right', 'left'],\n  bottom: ['top', 'right', 'left'],\n  left: ['right', 'top', 'bottom'],\n  right: ['left', 'top', 'bottom'],\n};\n\n/**\n * What the tooltip describes (3.32, request 051): the host when it matches,\n * else the first element inside it that does (`lc-button`'s `<button>`).\n */\nconst CONTROL =\n  'a[href], button, input:not([type=hidden]), select, textarea, [tabindex]:not([tabindex=\"-1\"])';\n\n/**\n * Tooltip directive for displaying contextual information.\n * Uses Angular CDK Overlay for positioning; flips to the opposite side when\n * the preferred one does not fit the viewport, and can be dismissed with\n * Escape (WCAG 1.4.13).\n *\n * The tooltip takes the `lang` of the host's closest `[lang]` (3.31).\n *\n * Shows on hover and on keyboard focus of the host or of an element inside it\n * (3.32). On a wrapper such as `lc-button`, the tooltip describes and anchors\n * to the wrapped `<button>`.\n *\n * @example\n * ```html\n * <button lcTooltip=\"Click me!\" tooltipPosition=\"top\">\n *   Hover or focus\n * </button>\n * ```\n */\n@Directive({\n  selector: '[lcTooltip]',\n  standalone: true,\n})\nexport class TooltipDirective implements OnDestroy {\n  private static nextId = 0;\n\n  /**\n   * Tooltip content text\n   */\n  lcTooltip = input.required<string>();\n\n  /**\n   * Tooltip position\n   * @default 'top'\n   */\n  tooltipPosition = input<TooltipPosition>('top');\n\n  /**\n   * Show delay in milliseconds\n   * @default 0\n   */\n  tooltipShowDelay = input<number>(0);\n\n  /**\n   * Hide delay in milliseconds\n   * @default 0\n   */\n  tooltipHideDelay = input<number>(0);\n\n  /**\n   * Whether tooltip is disabled\n   * @default false\n   */\n  tooltipDisabled = input<boolean>(false);\n\n  /**\n   * Id of the tooltip element; while shown, the `aria-describedby` of the\n   * described element (the host, or the focusable element it wraps, such as\n   * `lc-button`'s `<button>`) points at it.\n   */\n  readonly tooltipId = `lc-tooltip-${++TooltipDirective.nextId}`;\n\n  private overlayRef?: OverlayRef;\n  private tooltipRef?: ComponentRef<TooltipContentComponent>;\n  private positionStrategy?: FlexibleConnectedPositionStrategy;\n  /** The element whose `aria-describedby` holds the tooltip id while shown. */\n  private describedEl?: HTMLElement;\n  private positionSubscription?: Subscription;\n  private showTimeout?: number;\n  private hideTimeout?: number;\n  private escapeListener?: (event: KeyboardEvent) => void;\n\n  private readonly elementRef = inject<ElementRef<HTMLElement>>(ElementRef);\n  private readonly overlay = inject(Overlay);\n  private readonly viewContainerRef = inject(ViewContainerRef);\n  private readonly renderer = inject(Renderer2);\n  private readonly overlayStack = inject(OverlayStackService);\n\n  ngOnDestroy(): void {\n    this.hide();\n    this.cleanup();\n  }\n\n  @HostListener('mouseenter')\n  onMouseEnter(): void {\n    this.showWithDelay();\n  }\n\n  @HostListener('mouseleave')\n  onMouseLeave(): void {\n    this.hideWithDelay();\n  }\n\n  @HostListener('focus')\n  onFocus(): void {\n    this.showWithDelay();\n  }\n\n  @HostListener('blur')\n  onBlur(): void {\n    this.hideWithDelay();\n  }\n\n  /**\n   * 3.32 (request 051, 050-f3): `focus` does not bubble, so focus on an\n   * element inside the host (`lc-button`'s `<button>`) arrives as `focusin`.\n   * The host's own focus is handled by `onFocus`, so it is skipped here.\n   */\n  @HostListener('focusin', ['$event'])\n  onFocusIn(event: FocusEvent): void {\n    if (event.target === this.elementRef.nativeElement) return;\n    this.showWithDelay();\n  }\n\n  /** Hides when focus leaves the host from an element inside it (not when it moves within). */\n  @HostListener('focusout', ['$event'])\n  onFocusOut(event: FocusEvent): void {\n    const host = this.elementRef.nativeElement;\n    if (event.target === host) return;\n    const next = event.relatedTarget as Node | null;\n    if (next && host.contains(next)) return;\n    this.hideWithDelay();\n  }\n\n  /**\n   * Show tooltip programmatically\n   */\n  show(): void {\n    if (this.tooltipDisabled() || !this.lcTooltip()) {\n      return;\n    }\n\n    this.clearTimeouts();\n\n    if (!this.overlayRef) {\n      this.createOverlay();\n    }\n\n    if (!this.tooltipRef && this.overlayRef) {\n      // Resolved at every show: the wrapped control is described, and it is\n      // the anchor when it is the host's only child (3.32, request 051)\n      const control = this.resolveControl();\n      this.positionStrategy?.setOrigin(this.resolveAnchor(control));\n\n      const portal = new ComponentPortal(TooltipContentComponent, this.viewContainerRef);\n      this.tooltipRef = this.overlayRef.attach(portal) as ComponentRef<TooltipContentComponent>;\n      this.tooltipRef.instance.content = this.lcTooltip();\n\n      const tooltipEl = this.tooltipRef.location.nativeElement as HTMLElement;\n      // The id is what the described element's aria-describedby points at\n      this.renderer.setAttribute(tooltipEl, 'id', this.tooltipId);\n      // The overlay renders under <body>, outside the host's lang (WCAG 3.1.2):\n      // the tooltip takes the host's closest [lang], read at every show\n      const lang = closestLang(this.elementRef.nativeElement);\n      if (lang !== null) this.renderer.setAttribute(tooltipEl, 'lang', lang);\n      this.addDescribedBy(control);\n      this.setPositionClass(this.tooltipPosition());\n\n      // Escape dismisses the tooltip (WCAG 1.4.13) — only when it is the\n      // top-most overlay, so a modal underneath is not closed by the same key\n      this.overlayStack.push(this.tooltipId);\n      if (typeof document !== 'undefined') {\n        this.escapeListener = (event: KeyboardEvent) => {\n          if (event.key !== 'Escape' || !this.overlayStack.claim(this.tooltipId, event)) return;\n          event.stopPropagation();\n          this.hide();\n        };\n        document.addEventListener('keydown', this.escapeListener);\n      }\n    }\n  }\n\n  /**\n   * Hide tooltip programmatically\n   */\n  hide(): void {\n    this.clearTimeouts();\n\n    if (this.escapeListener) {\n      document.removeEventListener('keydown', this.escapeListener);\n      this.escapeListener = undefined;\n    }\n    this.overlayStack.remove(this.tooltipId);\n\n    if (this.tooltipRef) {\n      this.tooltipRef.destroy();\n      this.tooltipRef = undefined;\n    }\n\n    if (this.overlayRef) {\n      this.overlayRef.detach();\n    }\n\n    this.removeDescribedBy();\n  }\n\n  /**\n   * Toggle tooltip visibility\n   */\n  toggle(): void {\n    if (this.tooltipRef) {\n      this.hide();\n    } else {\n      this.show();\n    }\n  }\n\n  private showWithDelay(): void {\n    this.clearTimeouts();\n    const delay = this.tooltipShowDelay();\n\n    if (delay > 0) {\n      this.showTimeout = window.setTimeout(() => this.show(), delay);\n    } else {\n      this.show();\n    }\n  }\n\n  private hideWithDelay(): void {\n    this.clearTimeouts();\n    const delay = this.tooltipHideDelay();\n\n    if (delay > 0) {\n      this.hideTimeout = window.setTimeout(() => this.hide(), delay);\n    } else {\n      this.hide();\n    }\n  }\n\n  private createOverlay(): void {\n    const positionStrategy = this.overlay\n      .position()\n      .flexibleConnectedTo(this.elementRef)\n      .withPositions(this.getPositions());\n    this.positionStrategy = positionStrategy;\n\n    // Keep the tooltip element's position class in sync with the side the\n    // overlay actually chose (it flips at viewport edges)\n    this.positionSubscription = positionStrategy.positionChanges.subscribe((change) => {\n      const applied = POSITION_NAMES.find((p) => POSITIONS[p] === change.connectionPair);\n      if (applied) this.setPositionClass(applied);\n    });\n\n    this.overlayRef = this.overlay.create({\n      positionStrategy,\n      scrollStrategy: this.overlay.scrollStrategies.reposition(),\n    }) as OverlayRef;\n  }\n\n  /** Preferred position first, then the fallbacks the overlay may flip to. */\n  private getPositions(): ConnectedPosition[] {\n    const position = this.tooltipPosition();\n    return [position, ...FALLBACKS[position]].map((p) => POSITIONS[p]);\n  }\n\n  private setPositionClass(position: TooltipPosition): void {\n    const tooltipEl = this.tooltipRef?.location.nativeElement as HTMLElement | undefined;\n    if (!tooltipEl) return;\n    for (const p of POSITION_NAMES) {\n      this.renderer.removeClass(tooltipEl, `lc-tooltip--${p}`);\n    }\n    this.renderer.addClass(tooltipEl, `lc-tooltip--${position}`);\n  }\n\n  /** The described element: the host if it is a control, else the first control inside it, else the host. */\n  private resolveControl(): HTMLElement {\n    const host = this.elementRef.nativeElement;\n    if (host.matches(CONTROL)) return host;\n    return host.querySelector<HTMLElement>(CONTROL) ?? host;\n  }\n\n  /** The overlay origin: the control when it is the host's only element child (a wrapper), else the host. */\n  private resolveAnchor(control: HTMLElement): HTMLElement {\n    const host = this.elementRef.nativeElement;\n    return control !== host && host.childElementCount === 1 && host.firstElementChild === control ? control : host;\n  }\n\n  /** Append the tooltip id to the element's aria-describedby without clobbering ids the caller set. */\n  private addDescribedBy(el: HTMLElement): void {\n    this.describedEl = el;\n    const ids = (el.getAttribute('aria-describedby') ?? '').split(/\\s+/).filter(Boolean);\n    if (!ids.includes(this.tooltipId)) ids.push(this.tooltipId);\n    this.renderer.setAttribute(el, 'aria-describedby', ids.join(' '));\n  }\n\n  /** Removes the tooltip id from the element it was added to, keeping the other ids. */\n  private removeDescribedBy(): void {\n    const el = this.describedEl ?? this.elementRef.nativeElement;\n    this.describedEl = undefined;\n    const ids = (el.getAttribute('aria-describedby') ?? '').split(/\\s+/).filter(Boolean);\n    if (!ids.includes(this.tooltipId)) return;\n    const rest = ids.filter((id) => id !== this.tooltipId);\n    if (rest.length) {\n      this.renderer.setAttribute(el, 'aria-describedby', rest.join(' '));\n    } else {\n      this.renderer.removeAttribute(el, 'aria-describedby');\n    }\n  }\n\n  private clearTimeouts(): void {\n    if (this.showTimeout) {\n      window.clearTimeout(this.showTimeout);\n      this.showTimeout = undefined;\n    }\n    if (this.hideTimeout) {\n      window.clearTimeout(this.hideTimeout);\n      this.hideTimeout = undefined;\n    }\n  }\n\n  private cleanup(): void {\n    this.clearTimeouts();\n    this.positionSubscription?.unsubscribe();\n    this.positionSubscription = undefined;\n    this.positionStrategy = undefined;\n    if (this.overlayRef) {\n      this.overlayRef.dispose();\n      this.overlayRef = undefined;\n    }\n  }\n}\n"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lifecorner/angular-ui-kit",
-  "version": "3.31.0",
+  "version": "3.32.0",
   "description": "LifeCorner Design System – Angular UI component library",
   "license": "MIT",
   "repository": {

package/src/styles/_theme-dark.scss

@@ -474,3 +474,12 @@
 .lc-header--dark {
   @include -dark-theme-colors;
 }
+
+// `<lc-sidenav theme="dark">` on a light page: its badges took the page's
+// light palette, light chips on the dark rail (request 051, 050-f2).
+// Re-declared on the badge host they match a dark page (min 5.63:1). Only the
+// badge: the collapsed rail's label tooltip floats over the page and keeps the
+// page palette. A root-level token override does not reach inside.
+.lc-sidenav-container--dark .lc-sidenav__nav-badge {
+  @include -dark-theme-colors;
+}

package/src/styles/_theme-light.scss

@@ -486,3 +486,12 @@
 .lc-header--light {
   @include -light-theme-colors;
 }
+
+// `<lc-sidenav theme="light">` on a dark page: the rail is light, but its
+// badges took the page's dark palette and measured 1.11–1.96:1 (request 051,
+// 050-f2). Re-declared on the badge host they match a light page (4.85–10.97:1).
+// Only the badge: the collapsed rail's label tooltip floats over the page and
+// keeps the page palette. A root-level token override does not reach inside.
+.lc-sidenav-container--light .lc-sidenav__nav-badge {
+  @include -light-theme-colors;
+}

package/src/styles/theme-modes.spec.ts

@@ -98,3 +98,47 @@ describe('Theme scope of a themed header', () => {
     expect(dark.indexOf('.lc-header--dark {')).toBeGreaterThan(dark.indexOf(':root.system {'));
   });
 });
+
+/**
+ * Request 051 (050-f2, design §1 B, D-3): a sidenav with `theme="light"` /
+ * `"dark"` re-declares every colour token of that theme on its badge hosts,
+ * so the badges take the rail's palette instead of the page's (1.11–1.96:1 on
+ * a light rail on a dark page before). Only the badge host: the collapsed
+ * rail's label tooltip keeps the page palette. On a matching page the values
+ * equal the root's, so the badge renders exactly as before (AC-4).
+ */
+describe('Theme scope of a themed sidenav rail badge (request 051)', () => {
+  const COLOUR = /^--(color-|gradient-|shadow-|elevation-|accent-line$|app-background-image$)/;
+  const colours = (tokens: Record<string, string>) =>
+    Object.fromEntries(Object.entries(tokens).filter(([name]) => COLOUR.test(name)));
+  const LIGHT_RAIL = '.lc-sidenav-container--light .lc-sidenav__nav-badge {';
+  const DARK_RAIL = '.lc-sidenav-container--dark .lc-sidenav__nav-badge {';
+
+  it('AC-3/AC-4: the light rail badge declares exactly the colour tokens of the light root (172), with the same values', () => {
+    const badge = tokensOf(light, `\n${LIGHT_RAIL}`);
+    expect(Object.keys(badge)).toHaveLength(172);
+    expect(badge).toEqual(colours(tokensOf(light, ':root,')));
+  });
+
+  it('AC-3/AC-4: the dark rail badge declares exactly the colour tokens of the dark root (172), with the same values', () => {
+    const badge = tokensOf(dark, `\n${DARK_RAIL}`);
+    expect(Object.keys(badge)).toHaveLength(172);
+    expect(badge).toEqual(colours(tokensOf(dark, ':root.dark,')));
+  });
+
+  it('emits each rail rule once, in its own theme file, after the header rule', () => {
+    expect(light.split(LIGHT_RAIL)).toHaveLength(2);
+    expect(dark.split(DARK_RAIL)).toHaveLength(2);
+    expect(light.includes('.lc-sidenav-container--dark')).toBe(false);
+    expect(dark.includes('.lc-sidenav-container--light')).toBe(false);
+    expect(light.indexOf(LIGHT_RAIL)).toBeGreaterThan(light.indexOf('.lc-header--light {'));
+    expect(dark.indexOf(DARK_RAIL)).toBeGreaterThan(dark.indexOf('.lc-header--dark {'));
+  });
+
+  it('scopes the badge host only, not the rail or its label tooltip', () => {
+    for (const css of [light, dark]) {
+      const selectors = [...css.matchAll(/(^|\n)([^\n{}]*lc-sidenav[^\n{}]*)\{/g)].map((m) => m[2].trim());
+      expect(selectors).toEqual([expect.stringMatching(/^\.lc-sidenav-container--(light|dark) \.lc-sidenav__nav-badge$/)]);
+    }
+  });
+});

package/types/lifecorner-angular-ui-kit-combobox.d.ts

@@ -76,6 +76,16 @@ export declare class ComboboxComponent implements ControlValueAccessor {
   readonly createOptionLabel: import("@angular/core").InputSignal<string>;
   /** Size */
   readonly size: import("@angular/core").InputSignal<ComboboxSize>;
+  /**
+   * Whether the list opens when the field gets focus (3.32, request 051).
+   * With `false`, focus alone (`focus()` from the page, Tab) leaves the list
+   * closed and `aria-expanded="false"`; a click or tap on the field, typing or
+   * ArrowDown opens it. Use it in forms that move focus into the field
+   * themselves, on open or to the first invalid field after a rejected save.
+   * Escape and choosing an option work as before.
+   * @default true
+   */
+  readonly openOnFocus: import("@angular/core").InputSignal<boolean>;
   /**
    * The `value` of the selected option, two-way (3.29, regeln row 2):
    * `[(selectedValue)]="month"`. Shows the matching option's label (from
@@ -162,10 +172,16 @@ export declare class ComboboxComponent implements ControlValueAccessor {
    * and its buttons keeps focus where it is (no blur, so the list stays open).
    */
   protected onFrameMousedown(event: MouseEvent): void;
-  /** A click on the frame beside the input and its buttons focuses the input. */
+  /**
+   * A click on the frame beside the input and its buttons focuses the input.
+   * With `openOnFocus` off (3.32, request 051), a click or tap on the input or
+   * the frame also opens the list, which focus alone no longer does.
+   */
   protected onFrameClick(event: MouseEvent): void;
   protected onInputChange(event: Event): void;
   protected onInputFocus(): void;
+  /** Opens the list when there is something to show: a long enough query, or options. */
+  private openIfAny;
   protected onInputBlur(): void;
   protected onKeydown(event: KeyboardEvent): void;
   protected selectOption(option: ComboboxOption): void;
@@ -254,6 +270,11 @@ export declare class ComboboxComponent implements ControlValueAccessor {
       "required": false;
       "isSignal": true;
     };
+    "openOnFocus": {
+      "alias": "openOnFocus";
+      "required": false;
+      "isSignal": true;
+    };
     "selectedValue": {
       "alias": "selectedValue";
       "required": false;

package/types/lifecorner-angular-ui-kit-tooltip.d.ts

@@ -17,6 +17,10 @@ export declare class TooltipContentComponent {
  *
  * The tooltip takes the `lang` of the host's closest `[lang]` (3.31).
  *
+ * Shows on hover and on keyboard focus of the host or of an element inside it
+ * (3.32). On a wrapper such as `lc-button`, the tooltip describes and anchors
+ * to the wrapped `<button>`.
+ *
  * @example
  * ```html
  * <button lcTooltip="Click me!" tooltipPosition="top">
@@ -50,10 +54,17 @@ export declare class TooltipDirective implements OnDestroy {
    * @default false
    */
   tooltipDisabled: import("@angular/core").InputSignal<boolean>;
-  /** Id of the tooltip element; the host's `aria-describedby` points at it while shown. */
+  /**
+   * Id of the tooltip element; while shown, the `aria-describedby` of the
+   * described element (the host, or the focusable element it wraps, such as
+   * `lc-button`'s `<button>`) points at it.
+   */
   readonly tooltipId: string;
   private overlayRef?;
   private tooltipRef?;
+  private positionStrategy?;
+  /** The element whose `aria-describedby` holds the tooltip id while shown. */
+  private describedEl?;
   private positionSubscription?;
   private showTimeout?;
   private hideTimeout?;
@@ -68,6 +79,14 @@ export declare class TooltipDirective implements OnDestroy {
   onMouseLeave(): void;
   onFocus(): void;
   onBlur(): void;
+  /**
+   * 3.32 (request 051, 050-f3): `focus` does not bubble, so focus on an
+   * element inside the host (`lc-button`'s `<button>`) arrives as `focusin`.
+   * The host's own focus is handled by `onFocus`, so it is skipped here.
+   */
+  onFocusIn(event: FocusEvent): void;
+  /** Hides when focus leaves the host from an element inside it (not when it moves within). */
+  onFocusOut(event: FocusEvent): void;
   /**
    * Show tooltip programmatically
    */
@@ -86,8 +105,13 @@ export declare class TooltipDirective implements OnDestroy {
   /** Preferred position first, then the fallbacks the overlay may flip to. */
   private getPositions;
   private setPositionClass;
-  /** Append the tooltip id to the host's aria-describedby without clobbering ids the caller set. */
+  /** The described element: the host if it is a control, else the first control inside it, else the host. */
+  private resolveControl;
+  /** The overlay origin: the control when it is the host's only element child (a wrapper), else the host. */
+  private resolveAnchor;
+  /** Append the tooltip id to the element's aria-describedby without clobbering ids the caller set. */
   private addDescribedBy;
+  /** Removes the tooltip id from the element it was added to, keeping the other ids. */
   private removeDescribedBy;
   private clearTimeouts;
   private cleanup;