@kerfjs/ui 5.0.0-beta.63 → 5.0.0-beta.64

package/dist/index.d.ts

@@ -29,7 +29,7 @@ export { SunkenPanel, SunkenPanelProps, SunkenPanelShape } from './sunken-panel.
 export { DialogSurface, DialogSurfacePresentation, DialogSurfaceProps, DialogSurfaceSize, PopupSurface, PopupSurfaceInset, PopupSurfaceProps, SurfaceInset } from './surface-scaffold.js';
 export { TabActivation, TabBar, TabBarAllocation, TabBarPresentation, TabBarProps, TabBarTrailingPlacement } from './tab-bar.js';
 export { Text, TextContent, TextFont, TextProps, TextSize, TextTone, TextVariant } from './text.js';
-export { T as TokenSearchEditorAttributes, a as TokenSearchField, b as TokenSearchFieldProps, c as TokenSearchFieldValue, d as TokenSearchModel, e as TokenSearchModelOptions, f as TokenSearchResolvedToken, g as TokenSearchRule, h as TokenSearchState, i as TokenSearchSuggestion, j as TokenSearchToken, k as createTokenSearchModel, p as placeTokenSearchCaret, r as readTokenSearchField } from './token-search-field-DvgFLhLL.js';
+export { T as TokenSearchEditorAttributes, a as TokenSearchField, b as TokenSearchFieldProps, c as TokenSearchFieldValue, d as TokenSearchModel, e as TokenSearchModelOptions, f as TokenSearchResolvedToken, g as TokenSearchRule, h as TokenSearchState, i as TokenSearchSuggestion, j as TokenSearchToken, k as TokenSearchTrailingAction, l as createTokenSearchModel, p as placeTokenSearchCaret, r as readTokenSearchField } from './token-search-field-Xk8jiw8Y.js';
 export { Toolbar, ToolbarConfig, ToolbarPosition, ToolbarProps } from './toolbar.js';
 export { ToolbarActionLink, ToolbarActionLinkProps, ToolbarControlGroup, ToolbarControlGroupAppearance, ToolbarControlGroupButtonAppearance, ToolbarControlGroupContent, ToolbarControlGroupDensity, ToolbarControlGroupMenuInset, ToolbarControlGroupOverflow, ToolbarControlGroupProps, ToolbarControlGroupSelectedChrome, ToolbarControlGroupSelectedTone, ToolbarControlGroupShape, ToolbarControlGroupSize, ToolbarControlGroupTone, ToolbarControlGroupVisibility } from './toolbar-control-group.js';
 export { HeadingLevel, ToolbarText, ToolbarTextProps, ToolbarTextSize } from './toolbar-text.js';

package/dist/index.js

@@ -1,9 +1,9 @@
-export { wireTokenSearchFields } from './chunk-R75GGNWY.js';
+export { wireTokenSearchFields } from './chunk-M5H2RMCH.js';
 export { wireResizableRegions } from './chunk-UIDKY4UB.js';
 
 export { wireScrollDividers } from './chunk-JCV4GXWB.js';
 export { reorderTabs, wireTabBars } from './chunk-UA6JW52D.js';
-export { TokenSearchField, placeTokenSearchCaret, readTokenSearchField } from './chunk-RTJNJTG3.js';
+export { TokenSearchField, placeTokenSearchCaret, readTokenSearchField } from './chunk-NSVLUDUW.js';
 export { createTokenSearchModel } from './chunk-4SQK27MR.js';
 export { ValueTable, ValueTableRow } from './chunk-P7D3EMXM.js';
 export { Spacer } from './chunk-MEY33VWB.js';
@@ -15,10 +15,10 @@ export { SegmentedControl } from './chunk-X5QSICJ3.js';
 export { Select } from './chunk-F7OCOBTG.js';
 export { ListInsetControl } from './chunk-5I7QGQVT.js';
 export { EmptyState } from './chunk-E36EVCKG.js';
-export { Grid } from './chunk-UCKKT6KO.js';
+export { Grid } from './chunk-2EKHENQK.js';
 export { ListActionRow } from './chunk-IAOAZUOO.js';
 export { AppTab } from './chunk-Q6YU3BT7.js';
-export { PopupMenu, closePopupMenu, openPopupMenuAt } from './chunk-ZRWXFDDS.js';
+export { PopupMenu, closePopupMenu, openPopupMenuAt } from './chunk-J3KGJ6P6.js';
 export { ResizableRegion, clampRegionSize, resizeRegionFromPointer } from './chunk-KLJKU6ZL.js';
 export { Row } from './chunk-VZOFZPSO.js';
 export { ListHeader } from './chunk-5IJ6UGNZ.js';
@@ -39,7 +39,7 @@ export { ToolbarActionLink, ToolbarControlGroup } from './chunk-NXWE5S57.js';
 export { Toolbar } from './chunk-RGS4WX2M.js';
 export { LucideIcon } from './chunk-MOSIE4Z2.js';
 export { LoadingSpinner } from './chunk-ZLWQZUGF.js';
-export { ContentItem } from './chunk-7AKGPBCC.js';
+export { ContentItem } from './chunk-SH6F3CCG.js';
 
 export { calc, colorVar, em, flex, foregroundColorVar, lengthVar, pct, plus, px, rem, space, uiColor } from './chunk-2G2ZJQYK.js';
 

package/dist/popup-menu-register.js

@@ -5,12 +5,50 @@ import WaDropdownItem from '@awesome.me/webawesome/dist/components/dropdown-item
 import '@awesome.me/webawesome/dist/components/tooltip/tooltip.js';
 import WaDropdown from '@awesome.me/webawesome/dist/components/dropdown/dropdown.js';
 
-// src/install-popup-menu-keyboard.ts
+// src/install-dropdown-show-focus.ts
 var installed = /* @__PURE__ */ new WeakSet();
-function installPopupMenuKeyboard(prototype) {
+var showEpoch = /* @__PURE__ */ new WeakMap();
+function installDropdownShowFocus(prototype) {
   if (installed.has(prototype)) return;
   installed.add(prototype);
   const target = prototype;
+  const showMenu = target.showMenu;
+  target.showMenu = async function() {
+    const scoped = this.classList.contains("kui-popup-menu") || this.closest(".kui-popup-surface") !== null;
+    if (!scoped) return showMenu.call(this);
+    const epoch = (showEpoch.get(this) ?? 0) + 1;
+    showEpoch.set(this, epoch);
+    let navigatedItem;
+    const rememberFocus = (event) => {
+      const item = event.target;
+      if (this.menu?.classList.contains("show") && item instanceof HTMLElement && item.localName === "wa-dropdown-item" && this.contains(item)) {
+        navigatedItem = item;
+      }
+    };
+    this.addEventListener("focusin", rememberFocus);
+    try {
+      await showMenu.call(this);
+    } finally {
+      this.removeEventListener("focusin", rememberFocus);
+    }
+    if (showEpoch.get(this) !== epoch || !this.open || !this.popup?.active || !navigatedItem?.isConnected || !this.contains(navigatedItem))
+      return;
+    const siblings = navigatedItem.slot === "submenu" ? Array.from(navigatedItem.parentElement?.children ?? []).filter(
+      (item) => item.localName === "wa-dropdown-item"
+    ) : this.getItems();
+    siblings.forEach((item) => {
+      item.active = item === navigatedItem;
+    });
+    navigatedItem.focus({ preventScroll: true });
+  };
+}
+
+// src/install-popup-menu-keyboard.ts
+var installed2 = /* @__PURE__ */ new WeakSet();
+function installPopupMenuKeyboard(prototype) {
+  if (installed2.has(prototype)) return;
+  installed2.add(prototype);
+  const target = prototype;
   const makeSelection = target.makeSelection;
   target.makeSelection = function(item, event) {
     if (event instanceof KeyboardEvent && this.classList.contains("kui-popup-menu") && !item.disabled) {
@@ -21,17 +59,70 @@ function installPopupMenuKeyboard(prototype) {
   };
 }
 
+// src/install-popup-menu-lifecycle.ts
+var installed3 = /* @__PURE__ */ new WeakSet();
+function installPopupMenuLifecycle(prototype) {
+  if (installed3.has(prototype)) return;
+  installed3.add(prototype);
+  const target = prototype;
+  const showMenu = target.showMenu;
+  const hideMenu = target.hideMenu;
+  const hiding = /* @__PURE__ */ new WeakMap();
+  target.showMenu = function() {
+    const transition = hiding.get(this);
+    if (transition && this.open && this.popup?.active && this.classList.contains("kui-popup-menu")) {
+      this.popup.active = false;
+      transition.reopened = true;
+    }
+    return showMenu.call(this);
+  };
+  target.hideMenu = async function() {
+    const scoped = this.classList.contains("kui-popup-menu");
+    const transition = { reopened: false };
+    if (scoped) hiding.set(this, transition);
+    await hideMenu.call(this);
+    if (scoped && hiding.get(this) === transition && this.open && this.isConnected && this.popup?.active && !transition.reopened) {
+      this.popup.active = false;
+      void this.showMenu();
+    }
+    if (hiding.get(this) === transition) hiding.delete(this);
+  };
+}
+
 // src/install-popup-menu-submenu-focus.ts
-var installed2 = /* @__PURE__ */ new WeakSet();
+var installed4 = /* @__PURE__ */ new WeakSet();
 function installPopupMenuSubmenuFocus(prototype) {
-  if (installed2.has(prototype)) return;
-  installed2.add(prototype);
+  if (installed4.has(prototype)) return;
+  installed4.add(prototype);
   const target = prototype;
   const openSubmenu = target.openSubmenu;
+  const closeSubmenu = target.closeSubmenu;
+  const submenuOpen = Object.getOwnPropertyDescriptor(prototype, "submenuOpen");
+  if (submenuOpen?.set) {
+    Object.defineProperty(prototype, "submenuOpen", {
+      ...submenuOpen,
+      set(value) {
+        const wasOpen = this.submenuOpen;
+        submenuOpen.set.call(this, value);
+        if (value && wasOpen && this.submenuElement?.hidden && this.closest("wa-dropdown.kui-popup-menu"))
+          void this.openSubmenu();
+      }
+    });
+  }
+  target.closeSubmenu = async function() {
+    const submenu = this.submenuElement;
+    await closeSubmenu.call(this);
+    if (this.submenuOpen && submenu?.hidden && this.isConnected && this.closest("wa-dropdown.kui-popup-menu"))
+      void this.openSubmenu();
+  };
   target.openSubmenu = async function() {
     const submenu = this.submenuElement;
     if (!this.closest("wa-dropdown.kui-popup-menu") || !submenu)
       return openSubmenu.call(this);
+    if (submenu.classList.contains("show")) {
+      if (!submenu.hidden) return;
+      submenu.classList.remove("show");
+    }
     let desired;
     const trackFocus = (event) => {
       const item = event.composedPath().find(
@@ -57,9 +148,94 @@ function installPopupMenuSubmenuFocus(prototype) {
   };
 }
 
+// src/install-popup-menu-submenu-placement.ts
+var installed5 = /* @__PURE__ */ new WeakSet();
+var phoneWidth = "(max-width: 480px)";
+var viewportInset = 8;
+var menuGap = 4;
+function phoneSubmenuPosition(parent, submenu, viewport, rtl) {
+  const width = Math.min(submenu.width, viewport.width - 2 * viewportInset);
+  const height = submenu.height;
+  const below = Math.max(
+    0,
+    viewport.height - parent.bottom - menuGap - viewportInset
+  );
+  const above = Math.max(0, parent.top - menuGap - viewportInset);
+  const useBelow = height <= below || height > above && below >= above;
+  const availableHeight = useBelow ? below : above;
+  const left = rtl ? parent.right - width : parent.left;
+  return {
+    left: Math.max(
+      viewportInset,
+      Math.min(left, viewport.width - viewportInset - width)
+    ),
+    top: useBelow ? parent.bottom + menuGap : parent.top - menuGap - Math.min(height, availableHeight),
+    maxHeight: availableHeight,
+    maxWidth: viewport.width - 2 * viewportInset
+  };
+}
+function clearPhoneStyles(submenu) {
+  for (const property of [
+    "position",
+    "left",
+    "top",
+    "max-width",
+    "max-height",
+    "box-sizing",
+    "overflow-y"
+  ])
+    submenu.style.removeProperty(property);
+}
+function installPopupMenuSubmenuPlacement(prototype) {
+  if (installed5.has(prototype)) return;
+  installed5.add(prototype);
+  const target = prototype;
+  const positionSubmenu = target.positionSubmenu;
+  target.positionSubmenu = function(item) {
+    if (!this.classList.contains("kui-popup-menu")) {
+      positionSubmenu.call(this, item);
+      return;
+    }
+    const submenu = item.submenuElement;
+    if (!window.matchMedia(phoneWidth).matches || !submenu || !this.menu) {
+      if (submenu) clearPhoneStyles(submenu);
+      positionSubmenu.call(this, item);
+      return;
+    }
+    window.queueMicrotask(() => {
+      if (!this.isConnected || !item.submenuOpen || !window.matchMedia(phoneWidth).matches || !this.menu || !submenu.isConnected)
+        return;
+      const parentItem = item.parentElement?.localName === "wa-dropdown-item" ? item.parentElement : void 0;
+      const parentMenu = parentItem?.submenuElement ?? this.menu;
+      submenu.style.position = "fixed";
+      submenu.style.maxWidth = `calc(100vw - ${2 * viewportInset}px)`;
+      submenu.style.maxHeight = "none";
+      submenu.style.boxSizing = "border-box";
+      submenu.style.overflowY = "auto";
+      const placement = phoneSubmenuPosition(
+        parentMenu.getBoundingClientRect(),
+        submenu.getBoundingClientRect(),
+        { width: window.innerWidth, height: window.innerHeight },
+        window.getComputedStyle(this).direction === "rtl"
+      );
+      submenu.style.left = `${placement.left}px`;
+      submenu.style.top = `${placement.top}px`;
+      submenu.style.maxHeight = `${placement.maxHeight}px`;
+      submenu.style.maxWidth = `${placement.maxWidth}px`;
+      submenu.setAttribute(
+        "data-placement",
+        placement.top >= parentMenu.getBoundingClientRect().bottom ? "bottom-start" : "top-start"
+      );
+    });
+  };
+}
+
 // src/popup-menu-register.ts
 installPopupMenuKeyboard(WaDropdown.prototype);
+installPopupMenuLifecycle(WaDropdown.prototype);
+installDropdownShowFocus(WaDropdown.prototype);
 installPopupMenuSubmenuFocus(WaDropdownItem.prototype);
+installPopupMenuSubmenuPlacement(WaDropdown.prototype);
 installHelpTags();
 var popupMenuElementsRegistered = true;
 

package/dist/popup-menu-register.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/install-popup-menu-keyboard.ts","../src/install-popup-menu-submenu-focus.ts","../src/popup-menu-register.ts"],"names":["installed"],"mappings":";;;;;;;;AAOA,IAAM,SAAA,uBAAgB,OAAA,EAAgB;AAW/B,SAAS,yBAAyB,SAAA,EAAyB;AAChE,EAAA,IAAI,SAAA,CAAU,GAAA,CAAI,SAAS,CAAA,EAAG;AAC9B,EAAA,SAAA,CAAU,IAAI,SAAS,CAAA;AACvB,EAAA,MAAM,MAAA,GAAS,SAAA;AACf,EAAA,MAAM,gBAAgB,MAAA,CAAO,aAAA;AAC7B,EAAA,MAAA,CAAO,aAAA,GAAgB,SAAmC,IAAA,EAAM,KAAA,EAAa;AAC3E,IAAA,IACE,KAAA,YAAiB,iBACjB,IAAA,CAAK,SAAA,CAAU,SAAS,gBAAgB,CAAA,IACxC,CAAC,IAAA,CAAK,QAAA,EACN;AACA,MAAA,IAAA,CAAK,KAAA,EAAM;AACX,MAAA;AAAA,IACF;AACA,IAAA,aAAA,CAAc,IAAA,CAAK,IAAA,EAAM,IAAA,EAAM,KAAK,CAAA;AAAA,EACtC,CAAA;AACF;;;ACvBA,IAAMA,UAAAA,uBAAgB,OAAA,EAAgB;AAG/B,SAAS,6BAA6B,SAAA,EAAyB;AACpE,EAAA,IAAIA,UAAAA,CAAU,GAAA,CAAI,SAAS,CAAA,EAAG;AAC9B,EAAAA,UAAAA,CAAU,IAAI,SAAS,CAAA;AACvB,EAAA,MAAM,MAAA,GAAS,SAAA;AACf,EAAA,MAAM,cAAc,MAAA,CAAO,WAAA;AAC3B,EAAA,MAAA,CAAO,cAAc,iBAEJ;AACf,IAAA,MAAM,UAAU,IAAA,CAAK,cAAA;AACrB,IAAA,IAAI,CAAC,IAAA,CAAK,OAAA,CAAQ,4BAA4B,KAAK,CAAC,OAAA;AAClD,MAAA,OAAO,WAAA,CAAY,KAAK,IAAI,CAAA;AAE9B,IAAA,IAAI,OAAA;AACJ,IAAA,MAAM,UAAA,GAAa,CAAC,KAAA,KAAsB;AACxC,MAAA,MAAM,IAAA,GAAO,KAAA,CACV,YAAA,EAAa,CACb,IAAA;AAAA,QACC,CAAC,IAAA,KACC,IAAA,YAAgB,WAAA,IAChB,IAAA,CAAK,cAAc,kBAAA,IACnB,IAAA,CAAK,YAAA,CAAa,MAAM,CAAA,KAAM;AAAA,OAClC;AACF,MAAA,IAAI,QAAQ,IAAA,CAAK,eAAA,GAAkB,QAAA,CAAS,IAAI,GAAG,OAAA,GAAU,IAAA;AAAA,IAC/D,CAAA;AACA,IAAA,OAAA,CAAQ,gBAAA,CAAiB,WAAW,UAAU,CAAA;AAC9C,IAAA,IAAI;AACF,MAAA,MAAM,WAAA,CAAY,KAAK,IAAI,CAAA;AAAA,IAC7B,CAAA,SAAE;AACA,MAAA,OAAA,CAAQ,mBAAA,CAAoB,WAAW,UAAU,CAAA;AAAA,IACnD;AAEA,IAAA,MAAM,KAAA,GAAQ,KAAK,eAAA,EAAgB;AACnC,IAAA,IAAI,CAAC,OAAA,IAAW,OAAA,KAAY,KAAA,CAAM,CAAC,CAAA,EAAG;AACtC,IAAA,MAAM,QAAA,GAAW,OAAA;AAIjB,IAAA,MAAA,CAAO,WAAW,MAAM;AACtB,MAAA,IACE,CAAC,IAAA,CAAK,WAAA,IACN,CAAC,IAAA,CAAK,WAAA,IACN,OAAA,CAAQ,MAAA,IACR,QAAA,CAAS,aAAA,KAAkB,KAAA,CAAM,CAAC,CAAA;AAElC,QAAA;AACF,MAAA,KAAA,CAAM,QAAQ,CAAC,IAAA,KAAU,IAAA,CAAK,MAAA,GAAS,SAAS,QAAS,CAAA;AACzD,MAAA,QAAA,CAAS,KAAA,CAAM,EAAE,aAAA,EAAe,IAAA,EAAM,CAAA;AAAA,IACxC,GAAG,CAAC,CAAA;AAAA,EACN,CAAA;AACF;;;ACnDA,wBAAA,CAAyB,WAAW,SAAS,CAAA;AAC7C,4BAAA,CAA6B,eAAe,SAAS,CAAA;AACrD,eAAA,EAAgB;AAQT,IAAM,2BAAA,GAA8B","file":"popup-menu-register.js","sourcesContent":["interface PopupMenuDropdown extends HTMLElement {\n  makeSelection(\n    item: HTMLElement & { disabled?: boolean },\n    event?: Event,\n  ): void;\n}\n\nconst installed = new WeakSet<object>();\n\n/**\n * Route a keyboard choice in a `PopupMenu` through the item's click. Web Awesome\n * selects a pointer choice from the item's click event but a keyboard choice\n * (Enter or Space) directly, so delegated `data-action` click handlers would\n * never run for keyboard users. Clicking the item makes Web Awesome select it\n * exactly as it does for a pointer — one `wa-select`, then close and focus\n * return — while the click reaches the application's delegation. Raw\n * `wa-dropdown`s outside `PopupMenu` are unaffected.\n */\nexport function installPopupMenuKeyboard(prototype: object): void {\n  if (installed.has(prototype)) return;\n  installed.add(prototype);\n  const target = prototype as PopupMenuDropdown;\n  const makeSelection = target.makeSelection;\n  target.makeSelection = function (this: PopupMenuDropdown, item, event): void {\n    if (\n      event instanceof KeyboardEvent &&\n      this.classList.contains('kui-popup-menu') &&\n      !item.disabled\n    ) {\n      item.click();\n      return;\n    }\n    makeSelection.call(this, item, event);\n  };\n}\n","interface SubmenuItem extends HTMLElement {\n  active: boolean;\n}\n\ninterface PopupMenuParentItem extends HTMLElement {\n  submenuElement?: HTMLElement;\n  submenuOpen: boolean;\n  getSubmenuItems(): SubmenuItem[];\n  openSubmenu(): Promise<void>;\n}\n\nconst installed = new WeakSet<object>();\n\n/** Preserve a rapid keyboard move past Web Awesome's late first-item focus. */\nexport function installPopupMenuSubmenuFocus(prototype: object): void {\n  if (installed.has(prototype)) return;\n  installed.add(prototype);\n  const target = prototype as PopupMenuParentItem;\n  const openSubmenu = target.openSubmenu;\n  target.openSubmenu = async function (\n    this: PopupMenuParentItem,\n  ): Promise<void> {\n    const submenu = this.submenuElement;\n    if (!this.closest('wa-dropdown.kui-popup-menu') || !submenu)\n      return openSubmenu.call(this);\n\n    let desired: SubmenuItem | undefined;\n    const trackFocus = (event: FocusEvent) => {\n      const item = event\n        .composedPath()\n        .find(\n          (node): node is SubmenuItem =>\n            node instanceof HTMLElement &&\n            node.localName === 'wa-dropdown-item' &&\n            node.getAttribute('slot') === 'submenu',\n        );\n      if (item && this.getSubmenuItems().includes(item)) desired = item;\n    };\n    submenu.addEventListener('focusin', trackFocus);\n    try {\n      await openSubmenu.call(this);\n    } finally {\n      submenu.removeEventListener('focusin', trackFocus);\n    }\n\n    const items = this.getSubmenuItems();\n    if (!desired || desired === items[0]) return;\n    const selected = desired;\n    // Web Awesome queues its first-item focus after the show animation. This\n    // timer follows that one, restoring a user's later arrow choice only if\n    // the queued focus actually reset it. Pointer/blur/close paths are left alone.\n    window.setTimeout(() => {\n      if (\n        !this.isConnected ||\n        !this.submenuOpen ||\n        submenu.hidden ||\n        document.activeElement !== items[0]\n      )\n        return;\n      items.forEach((item) => (item.active = item === selected));\n      selected.focus({ preventScroll: true });\n    }, 0);\n  };\n}\n","import '@awesome.me/webawesome/dist/components/button/button.js';\nimport '@awesome.me/webawesome/dist/components/divider/divider.js';\nimport '@awesome.me/webawesome/dist/components/dropdown-item/dropdown-item.js';\nimport '@awesome.me/webawesome/dist/components/tooltip/tooltip.js';\n\nimport WaDropdown from '@awesome.me/webawesome/dist/components/dropdown/dropdown.js';\nimport WaDropdownItem from '@awesome.me/webawesome/dist/components/dropdown-item/dropdown-item.js';\n\nimport { installHelpTags } from './install-help-tag.js';\nimport { installPopupMenuKeyboard } from './install-popup-menu-keyboard.js';\nimport { installPopupMenuSubmenuFocus } from './install-popup-menu-submenu-focus.js';\n\ninstallPopupMenuKeyboard(WaDropdown.prototype);\ninstallPopupMenuSubmenuFocus(WaDropdownItem.prototype);\ninstallHelpTags();\n\n/**\n * Marker export for tests and tooling; importing this module registers the\n * Web Awesome elements a `PopupMenu` renders (`wa-dropdown`,\n * `wa-dropdown-item`, `wa-button`, and `wa-divider`) and routes a keyboard\n * choice through the item's click so delegated `data-action`s run.\n */\nexport const popupMenuElementsRegistered = true;\n"]}
+{"version":3,"sources":["../src/install-dropdown-show-focus.ts","../src/install-popup-menu-keyboard.ts","../src/install-popup-menu-lifecycle.ts","../src/install-popup-menu-submenu-focus.ts","../src/install-popup-menu-submenu-placement.ts","../src/popup-menu-register.ts"],"names":["installed"],"mappings":";;;;;;;;AAYA,IAAM,SAAA,uBAAgB,OAAA,EAAgB;AACtC,IAAM,SAAA,uBAAgB,OAAA,EAAmC;AAGlD,SAAS,yBAAyB,SAAA,EAAyB;AAChE,EAAA,IAAI,SAAA,CAAU,GAAA,CAAI,SAAS,CAAA,EAAG;AAC9B,EAAA,SAAA,CAAU,IAAI,SAAS,CAAA;AACvB,EAAA,MAAM,MAAA,GAAS,SAAA;AACf,EAAA,MAAM,WAAW,MAAA,CAAO,QAAA;AACxB,EAAA,MAAA,CAAO,WAAW,iBAAwD;AACxE,IAAA,MAAM,MAAA,GACJ,KAAK,SAAA,CAAU,QAAA,CAAS,gBAAgB,CAAA,IACxC,IAAA,CAAK,OAAA,CAAQ,oBAAoB,CAAA,KAAM,IAAA;AACzC,IAAA,IAAI,CAAC,MAAA,EAAQ,OAAO,QAAA,CAAS,KAAK,IAAI,CAAA;AAEtC,IAAA,MAAM,KAAA,GAAA,CAAS,SAAA,CAAU,GAAA,CAAI,IAAI,KAAK,CAAA,IAAK,CAAA;AAC3C,IAAA,SAAA,CAAU,GAAA,CAAI,MAAM,KAAK,CAAA;AACzB,IAAA,IAAI,aAAA;AACJ,IAAA,MAAM,aAAA,GAAgB,CAAC,KAAA,KAAsB;AAC3C,MAAA,MAAM,OAAO,KAAA,CAAM,MAAA;AACnB,MAAA,IACE,IAAA,CAAK,IAAA,EAAM,SAAA,CAAU,QAAA,CAAS,MAAM,CAAA,IACpC,IAAA,YAAgB,WAAA,IAChB,IAAA,CAAK,SAAA,KAAc,kBAAA,IACnB,IAAA,CAAK,QAAA,CAAS,IAAI,CAAA,EAClB;AACA,QAAA,aAAA,GAAgB,IAAA;AAAA,MAClB;AAAA,IACF,CAAA;AACA,IAAA,IAAA,CAAK,gBAAA,CAAiB,WAAW,aAAa,CAAA;AAC9C,IAAA,IAAI;AACF,MAAA,MAAM,QAAA,CAAS,KAAK,IAAI,CAAA;AAAA,IAC1B,CAAA,SAAE;AACA,MAAA,IAAA,CAAK,mBAAA,CAAoB,WAAW,aAAa,CAAA;AAAA,IACnD;AACA,IAAA,IACE,UAAU,GAAA,CAAI,IAAI,MAAM,KAAA,IACxB,CAAC,KAAK,IAAA,IACN,CAAC,IAAA,CAAK,KAAA,EAAO,UACb,CAAC,aAAA,EAAe,eAChB,CAAC,IAAA,CAAK,SAAS,aAAa,CAAA;AAE5B,MAAA;AAEF,IAAA,MAAM,QAAA,GACJ,aAAA,CAAc,IAAA,KAAS,SAAA,GACnB,KAAA,CAAM,IAAA,CAAK,aAAA,CAAc,aAAA,EAAe,QAAA,IAAY,EAAE,CAAA,CAAE,MAAA;AAAA,MACtD,CAAC,IAAA,KACC,IAAA,CAAK,SAAA,KAAc;AAAA,KACvB,GACA,KAAK,QAAA,EAAS;AACpB,IAAA,QAAA,CAAS,OAAA,CAAQ,CAAC,IAAA,KAAS;AACzB,MAAA,IAAA,CAAK,SAAS,IAAA,KAAS,aAAA;AAAA,IACzB,CAAC,CAAA;AACD,IAAA,aAAA,CAAc,KAAA,CAAM,EAAE,aAAA,EAAe,IAAA,EAAM,CAAA;AAAA,EAC7C,CAAA;AACF;;;AC7DA,IAAMA,UAAAA,uBAAgB,OAAA,EAAgB;AAW/B,SAAS,yBAAyB,SAAA,EAAyB;AAChE,EAAA,IAAIA,UAAAA,CAAU,GAAA,CAAI,SAAS,CAAA,EAAG;AAC9B,EAAAA,UAAAA,CAAU,IAAI,SAAS,CAAA;AACvB,EAAA,MAAM,MAAA,GAAS,SAAA;AACf,EAAA,MAAM,gBAAgB,MAAA,CAAO,aAAA;AAC7B,EAAA,MAAA,CAAO,aAAA,GAAgB,SAAmC,IAAA,EAAM,KAAA,EAAa;AAC3E,IAAA,IACE,KAAA,YAAiB,iBACjB,IAAA,CAAK,SAAA,CAAU,SAAS,gBAAgB,CAAA,IACxC,CAAC,IAAA,CAAK,QAAA,EACN;AACA,MAAA,IAAA,CAAK,KAAA,EAAM;AACX,MAAA;AAAA,IACF;AACA,IAAA,aAAA,CAAc,IAAA,CAAK,IAAA,EAAM,IAAA,EAAM,KAAK,CAAA;AAAA,EACtC,CAAA;AACF;;;AC3BA,IAAMA,UAAAA,uBAAgB,OAAA,EAAgB;AAG/B,SAAS,0BAA0B,SAAA,EAAyB;AACjE,EAAA,IAAIA,UAAAA,CAAU,GAAA,CAAI,SAAS,CAAA,EAAG;AAC9B,EAAAA,UAAAA,CAAU,IAAI,SAAS,CAAA;AACvB,EAAA,MAAM,MAAA,GAAS,SAAA;AACf,EAAA,MAAM,WAAW,MAAA,CAAO,QAAA;AACxB,EAAA,MAAM,WAAW,MAAA,CAAO,QAAA;AACxB,EAAA,MAAM,MAAA,uBAAa,OAAA,EAAkD;AACrE,EAAA,MAAA,CAAO,WAAW,WAAkD;AAClE,IAAA,MAAM,UAAA,GAAa,MAAA,CAAO,GAAA,CAAI,IAAI,CAAA;AAClC,IAAA,IACE,UAAA,IACA,IAAA,CAAK,IAAA,IACL,IAAA,CAAK,KAAA,EAAO,UACZ,IAAA,CAAK,SAAA,CAAU,QAAA,CAAS,gBAAgB,CAAA,EACxC;AAGA,MAAA,IAAA,CAAK,MAAM,MAAA,GAAS,KAAA;AACpB,MAAA,UAAA,CAAW,QAAA,GAAW,IAAA;AAAA,IACxB;AACA,IAAA,OAAO,QAAA,CAAS,KAAK,IAAI,CAAA;AAAA,EAC3B,CAAA;AACA,EAAA,MAAA,CAAO,WAAW,iBAAwD;AACxE,IAAA,MAAM,MAAA,GAAS,IAAA,CAAK,SAAA,CAAU,QAAA,CAAS,gBAAgB,CAAA;AACvD,IAAA,MAAM,UAAA,GAAa,EAAE,QAAA,EAAU,KAAA,EAAM;AACrC,IAAA,IAAI,MAAA,EAAQ,MAAA,CAAO,GAAA,CAAI,IAAA,EAAM,UAAU,CAAA;AACvC,IAAA,MAAM,QAAA,CAAS,KAAK,IAAI,CAAA;AAIxB,IAAA,IACE,MAAA,IACA,MAAA,CAAO,GAAA,CAAI,IAAI,MAAM,UAAA,IACrB,IAAA,CAAK,IAAA,IACL,IAAA,CAAK,eACL,IAAA,CAAK,KAAA,EAAO,MAAA,IACZ,CAAC,WAAW,QAAA,EACZ;AACA,MAAA,IAAA,CAAK,MAAM,MAAA,GAAS,KAAA;AACpB,MAAA,KAAK,KAAK,QAAA,EAAS;AAAA,IACrB;AACA,IAAA,IAAI,OAAO,GAAA,CAAI,IAAI,MAAM,UAAA,EAAY,MAAA,CAAO,OAAO,IAAI,CAAA;AAAA,EACzD,CAAA;AACF;;;ACzCA,IAAMA,UAAAA,uBAAgB,OAAA,EAAgB;AAG/B,SAAS,6BAA6B,SAAA,EAAyB;AACpE,EAAA,IAAIA,UAAAA,CAAU,GAAA,CAAI,SAAS,CAAA,EAAG;AAC9B,EAAAA,UAAAA,CAAU,IAAI,SAAS,CAAA;AACvB,EAAA,MAAM,MAAA,GAAS,SAAA;AACf,EAAA,MAAM,cAAc,MAAA,CAAO,WAAA;AAC3B,EAAA,MAAM,eAAe,MAAA,CAAO,YAAA;AAC5B,EAAA,MAAM,WAAA,GAAc,MAAA,CAAO,wBAAA,CAAyB,SAAA,EAAW,aAAa,CAAA;AAC5E,EAAA,IAAI,aAAa,GAAA,EAAK;AACpB,IAAA,MAAA,CAAO,cAAA,CAAe,WAAW,aAAA,EAAe;AAAA,MAC9C,GAAG,WAAA;AAAA,MACH,IAA+B,KAAA,EAAgB;AAC7C,QAAA,MAAM,UAAU,IAAA,CAAK,WAAA;AACrB,QAAA,WAAA,CAAY,GAAA,CAAK,IAAA,CAAK,IAAA,EAAM,KAAK,CAAA;AAIjC,QAAA,IACE,SACA,OAAA,IACA,IAAA,CAAK,gBAAgB,MAAA,IACrB,IAAA,CAAK,QAAQ,4BAA4B,CAAA;AAEzC,UAAA,KAAK,KAAK,WAAA,EAAY;AAAA,MAC1B;AAAA,KACD,CAAA;AAAA,EACH;AACA,EAAA,MAAA,CAAO,eAAe,iBAEL;AACf,IAAA,MAAM,UAAU,IAAA,CAAK,cAAA;AACrB,IAAA,MAAM,YAAA,CAAa,KAAK,IAAI,CAAA;AAG5B,IAAA,IACE,IAAA,CAAK,eACL,OAAA,EAAS,MAAA,IACT,KAAK,WAAA,IACL,IAAA,CAAK,QAAQ,4BAA4B,CAAA;AAEzC,MAAA,KAAK,KAAK,WAAA,EAAY;AAAA,EAC1B,CAAA;AACA,EAAA,MAAA,CAAO,cAAc,iBAEJ;AACf,IAAA,MAAM,UAAU,IAAA,CAAK,cAAA;AACrB,IAAA,IAAI,CAAC,IAAA,CAAK,OAAA,CAAQ,4BAA4B,KAAK,CAAC,OAAA;AAClD,MAAA,OAAO,WAAA,CAAY,KAAK,IAAI,CAAA;AAK9B,IAAA,IAAI,OAAA,CAAQ,SAAA,CAAU,QAAA,CAAS,MAAM,CAAA,EAAG;AACtC,MAAA,IAAI,CAAC,QAAQ,MAAA,EAAQ;AACrB,MAAA,OAAA,CAAQ,SAAA,CAAU,OAAO,MAAM,CAAA;AAAA,IACjC;AAEA,IAAA,IAAI,OAAA;AACJ,IAAA,MAAM,UAAA,GAAa,CAAC,KAAA,KAAsB;AACxC,MAAA,MAAM,IAAA,GAAO,KAAA,CACV,YAAA,EAAa,CACb,IAAA;AAAA,QACC,CAAC,IAAA,KACC,IAAA,YAAgB,WAAA,IAChB,IAAA,CAAK,cAAc,kBAAA,IACnB,IAAA,CAAK,YAAA,CAAa,MAAM,CAAA,KAAM;AAAA,OAClC;AACF,MAAA,IAAI,QAAQ,IAAA,CAAK,eAAA,GAAkB,QAAA,CAAS,IAAI,GAAG,OAAA,GAAU,IAAA;AAAA,IAC/D,CAAA;AACA,IAAA,OAAA,CAAQ,gBAAA,CAAiB,WAAW,UAAU,CAAA;AAC9C,IAAA,IAAI;AACF,MAAA,MAAM,WAAA,CAAY,KAAK,IAAI,CAAA;AAAA,IAC7B,CAAA,SAAE;AACA,MAAA,OAAA,CAAQ,mBAAA,CAAoB,WAAW,UAAU,CAAA;AAAA,IACnD;AAEA,IAAA,MAAM,KAAA,GAAQ,KAAK,eAAA,EAAgB;AACnC,IAAA,IAAI,CAAC,OAAA,IAAW,OAAA,KAAY,KAAA,CAAM,CAAC,CAAA,EAAG;AACtC,IAAA,MAAM,QAAA,GAAW,OAAA;AAIjB,IAAA,MAAA,CAAO,WAAW,MAAM;AACtB,MAAA,IACE,CAAC,IAAA,CAAK,WAAA,IACN,CAAC,IAAA,CAAK,WAAA,IACN,OAAA,CAAQ,MAAA,IACR,QAAA,CAAS,aAAA,KAAkB,KAAA,CAAM,CAAC,CAAA;AAElC,QAAA;AACF,MAAA,KAAA,CAAM,QAAQ,CAAC,IAAA,KAAU,IAAA,CAAK,MAAA,GAAS,SAAS,QAAS,CAAA;AACzD,MAAA,QAAA,CAAS,KAAA,CAAM,EAAE,aAAA,EAAe,IAAA,EAAM,CAAA;AAAA,IACxC,GAAG,CAAC,CAAA;AAAA,EACN,CAAA;AACF;;;AClGA,IAAMA,UAAAA,uBAAgB,OAAA,EAAgB;AACtC,IAAM,UAAA,GAAa,oBAAA;AACnB,IAAM,aAAA,GAAgB,CAAA;AACtB,IAAM,OAAA,GAAU,CAAA;AAGT,SAAS,oBAAA,CACd,MAAA,EACA,OAAA,EACA,QAAA,EACA,GAAA,EACA;AACA,EAAA,MAAM,KAAA,GAAQ,KAAK,GAAA,CAAI,OAAA,CAAQ,OAAO,QAAA,CAAS,KAAA,GAAQ,IAAI,aAAa,CAAA;AACxE,EAAA,MAAM,SAAS,OAAA,CAAQ,MAAA;AACvB,EAAA,MAAM,QAAQ,IAAA,CAAK,GAAA;AAAA,IACjB,CAAA;AAAA,IACA,QAAA,CAAS,MAAA,GAAS,MAAA,CAAO,MAAA,GAAS,OAAA,GAAU;AAAA,GAC9C;AACA,EAAA,MAAM,QAAQ,IAAA,CAAK,GAAA,CAAI,GAAG,MAAA,CAAO,GAAA,GAAM,UAAU,aAAa,CAAA;AAC9D,EAAA,MAAM,QAAA,GAAW,MAAA,IAAU,KAAA,IAAU,MAAA,GAAS,SAAS,KAAA,IAAS,KAAA;AAChE,EAAA,MAAM,eAAA,GAAkB,WAAW,KAAA,GAAQ,KAAA;AAC3C,EAAA,MAAM,IAAA,GAAO,GAAA,GAAM,MAAA,CAAO,KAAA,GAAQ,QAAQ,MAAA,CAAO,IAAA;AACjD,EAAA,OAAO;AAAA,IACL,MAAM,IAAA,CAAK,GAAA;AAAA,MACT,aAAA;AAAA,MACA,KAAK,GAAA,CAAI,IAAA,EAAM,QAAA,CAAS,KAAA,GAAQ,gBAAgB,KAAK;AAAA,KACvD;AAAA,IACA,GAAA,EAAK,QAAA,GACD,MAAA,CAAO,MAAA,GAAS,OAAA,GAChB,MAAA,CAAO,GAAA,GAAM,OAAA,GAAU,IAAA,CAAK,GAAA,CAAI,MAAA,EAAQ,eAAe,CAAA;AAAA,IAC3D,SAAA,EAAW,eAAA;AAAA,IACX,QAAA,EAAU,QAAA,CAAS,KAAA,GAAQ,CAAA,GAAI;AAAA,GACjC;AACF;AAEA,SAAS,iBAAiB,OAAA,EAAsB;AAC9C,EAAA,KAAA,MAAW,QAAA,IAAY;AAAA,IACrB,UAAA;AAAA,IACA,MAAA;AAAA,IACA,KAAA;AAAA,IACA,WAAA;AAAA,IACA,YAAA;AAAA,IACA,YAAA;AAAA,IACA;AAAA,GACF;AACE,IAAA,OAAA,CAAQ,KAAA,CAAM,eAAe,QAAQ,CAAA;AACzC;AAQO,SAAS,iCAAiC,SAAA,EAAyB;AACxE,EAAA,IAAIA,UAAAA,CAAU,GAAA,CAAI,SAAS,CAAA,EAAG;AAC9B,EAAAA,UAAAA,CAAU,IAAI,SAAS,CAAA;AACvB,EAAA,MAAM,MAAA,GAAS,SAAA;AACf,EAAA,MAAM,kBAAkB,MAAA,CAAO,eAAA;AAC/B,EAAA,MAAA,CAAO,eAAA,GAAkB,SAAmC,IAAA,EAAY;AACtE,IAAA,IAAI,CAAC,IAAA,CAAK,SAAA,CAAU,QAAA,CAAS,gBAAgB,CAAA,EAAG;AAC9C,MAAA,eAAA,CAAgB,IAAA,CAAK,MAAM,IAAI,CAAA;AAC/B,MAAA;AAAA,IACF;AACA,IAAA,MAAM,UAAU,IAAA,CAAK,cAAA;AACrB,IAAA,IAAI,CAAC,MAAA,CAAO,UAAA,CAAW,UAAU,CAAA,CAAE,WAAW,CAAC,OAAA,IAAW,CAAC,IAAA,CAAK,IAAA,EAAM;AACpE,MAAA,IAAI,OAAA,mBAA0B,OAAO,CAAA;AACrC,MAAA,eAAA,CAAgB,IAAA,CAAK,MAAM,IAAI,CAAA;AAC/B,MAAA;AAAA,IACF;AAIA,IAAA,MAAA,CAAO,eAAe,MAAM;AAC1B,MAAA,IACE,CAAC,IAAA,CAAK,WAAA,IACN,CAAC,IAAA,CAAK,eACN,CAAC,MAAA,CAAO,UAAA,CAAW,UAAU,EAAE,OAAA,IAC/B,CAAC,IAAA,CAAK,IAAA,IACN,CAAC,OAAA,CAAQ,WAAA;AAET,QAAA;AACF,MAAA,MAAM,aACJ,IAAA,CAAK,aAAA,EAAe,SAAA,KAAc,kBAAA,GAC7B,KAAK,aAAA,GACN,MAAA;AACN,MAAA,MAAM,UAAA,GAAa,UAAA,EAAY,cAAA,IAAkB,IAAA,CAAK,IAAA;AACtD,MAAA,OAAA,CAAQ,MAAM,QAAA,GAAW,OAAA;AACzB,MAAA,OAAA,CAAQ,KAAA,CAAM,QAAA,GAAW,CAAA,aAAA,EAAgB,CAAA,GAAI,aAAa,CAAA,GAAA,CAAA;AAC1D,MAAA,OAAA,CAAQ,MAAM,SAAA,GAAY,MAAA;AAC1B,MAAA,OAAA,CAAQ,MAAM,SAAA,GAAY,YAAA;AAC1B,MAAA,OAAA,CAAQ,MAAM,SAAA,GAAY,MAAA;AAC1B,MAAA,MAAM,SAAA,GAAY,oBAAA;AAAA,QAChB,WAAW,qBAAA,EAAsB;AAAA,QACjC,QAAQ,qBAAA,EAAsB;AAAA,QAC9B,EAAE,KAAA,EAAO,MAAA,CAAO,UAAA,EAAY,MAAA,EAAQ,OAAO,WAAA,EAAY;AAAA,QACvD,MAAA,CAAO,gBAAA,CAAiB,IAAI,CAAA,CAAE,SAAA,KAAc;AAAA,OAC9C;AACA,MAAA,OAAA,CAAQ,KAAA,CAAM,IAAA,GAAO,CAAA,EAAG,SAAA,CAAU,IAAI,CAAA,EAAA,CAAA;AACtC,MAAA,OAAA,CAAQ,KAAA,CAAM,GAAA,GAAM,CAAA,EAAG,SAAA,CAAU,GAAG,CAAA,EAAA,CAAA;AACpC,MAAA,OAAA,CAAQ,KAAA,CAAM,SAAA,GAAY,CAAA,EAAG,SAAA,CAAU,SAAS,CAAA,EAAA,CAAA;AAChD,MAAA,OAAA,CAAQ,KAAA,CAAM,QAAA,GAAW,CAAA,EAAG,SAAA,CAAU,QAAQ,CAAA,EAAA,CAAA;AAC9C,MAAA,OAAA,CAAQ,YAAA;AAAA,QACN,gBAAA;AAAA,QACA,UAAU,GAAA,IAAO,UAAA,CAAW,qBAAA,EAAsB,CAAE,SAChD,cAAA,GACA;AAAA,OACN;AAAA,IACF,CAAC,CAAA;AAAA,EACH,CAAA;AACF;;;ACzGA,wBAAA,CAAyB,WAAW,SAAS,CAAA;AAC7C,yBAAA,CAA0B,WAAW,SAAS,CAAA;AAC9C,wBAAA,CAAyB,WAAW,SAAS,CAAA;AAC7C,4BAAA,CAA6B,eAAe,SAAS,CAAA;AACrD,gCAAA,CAAiC,WAAW,SAAS,CAAA;AACrD,eAAA,EAAgB;AAQT,IAAM,2BAAA,GAA8B","file":"popup-menu-register.js","sourcesContent":["interface FocusableDropdownItem extends HTMLElement {\n  active: boolean;\n}\n\ninterface FocusableDropdown extends HTMLElement {\n  open: boolean;\n  popup?: { active: boolean };\n  menu?: HTMLElement;\n  getItems(): FocusableDropdownItem[];\n  showMenu(): Promise<void>;\n}\n\nconst installed = new WeakSet<object>();\nconst showEpoch = new WeakMap<FocusableDropdown, number>();\n\n/** Preserve item navigation that Web Awesome receives during its show animation. */\nexport function installDropdownShowFocus(prototype: object): void {\n  if (installed.has(prototype)) return;\n  installed.add(prototype);\n  const target = prototype as FocusableDropdown;\n  const showMenu = target.showMenu;\n  target.showMenu = async function (this: FocusableDropdown): Promise<void> {\n    const scoped =\n      this.classList.contains('kui-popup-menu') ||\n      this.closest('.kui-popup-surface') !== null;\n    if (!scoped) return showMenu.call(this);\n\n    const epoch = (showEpoch.get(this) ?? 0) + 1;\n    showEpoch.set(this, epoch);\n    let navigatedItem: FocusableDropdownItem | undefined;\n    const rememberFocus = (event: FocusEvent) => {\n      const item = event.target;\n      if (\n        this.menu?.classList.contains('show') &&\n        item instanceof HTMLElement &&\n        item.localName === 'wa-dropdown-item' &&\n        this.contains(item)\n      ) {\n        navigatedItem = item as FocusableDropdownItem;\n      }\n    };\n    this.addEventListener('focusin', rememberFocus);\n    try {\n      await showMenu.call(this);\n    } finally {\n      this.removeEventListener('focusin', rememberFocus);\n    }\n    if (\n      showEpoch.get(this) !== epoch ||\n      !this.open ||\n      !this.popup?.active ||\n      !navigatedItem?.isConnected ||\n      !this.contains(navigatedItem)\n    )\n      return;\n\n    const siblings =\n      navigatedItem.slot === 'submenu'\n        ? Array.from(navigatedItem.parentElement?.children ?? []).filter(\n            (item): item is FocusableDropdownItem =>\n              item.localName === 'wa-dropdown-item',\n          )\n        : this.getItems();\n    siblings.forEach((item) => {\n      item.active = item === navigatedItem;\n    });\n    navigatedItem.focus({ preventScroll: true });\n  };\n}\n","interface PopupMenuDropdown extends HTMLElement {\n  makeSelection(\n    item: HTMLElement & { disabled?: boolean },\n    event?: Event,\n  ): void;\n}\n\nconst installed = new WeakSet<object>();\n\n/**\n * Route a keyboard choice in a `PopupMenu` through the item's click. Web Awesome\n * selects a pointer choice from the item's click event but a keyboard choice\n * (Enter or Space) directly, so delegated `data-action` click handlers would\n * never run for keyboard users. Clicking the item makes Web Awesome select it\n * exactly as it does for a pointer — one `wa-select`, then close and focus\n * return — while the click reaches the application's delegation. Raw\n * `wa-dropdown`s outside `PopupMenu` are unaffected.\n */\nexport function installPopupMenuKeyboard(prototype: object): void {\n  if (installed.has(prototype)) return;\n  installed.add(prototype);\n  const target = prototype as PopupMenuDropdown;\n  const makeSelection = target.makeSelection;\n  target.makeSelection = function (this: PopupMenuDropdown, item, event): void {\n    if (\n      event instanceof KeyboardEvent &&\n      this.classList.contains('kui-popup-menu') &&\n      !item.disabled\n    ) {\n      item.click();\n      return;\n    }\n    makeSelection.call(this, item, event);\n  };\n}\n","interface PopupMenuDropdown extends HTMLElement {\n  open: boolean;\n  popup?: { active: boolean };\n  showMenu(): Promise<void>;\n  hideMenu(): Promise<void>;\n}\n\nconst installed = new WeakSet<object>();\n\n/** Restore Web Awesome dismissal listeners after a rapid close/reopen. */\nexport function installPopupMenuLifecycle(prototype: object): void {\n  if (installed.has(prototype)) return;\n  installed.add(prototype);\n  const target = prototype as PopupMenuDropdown;\n  const showMenu = target.showMenu;\n  const hideMenu = target.hideMenu;\n  const hiding = new WeakMap<PopupMenuDropdown, { reopened: boolean }>();\n  target.showMenu = function (this: PopupMenuDropdown): Promise<void> {\n    const transition = hiding.get(this);\n    if (\n      transition &&\n      this.open &&\n      this.popup?.active &&\n      this.classList.contains('kui-popup-menu')\n    ) {\n      // Native showMenu would return early while the old popup is active,\n      // leaving its document pointer listener absent during the hide.\n      this.popup.active = false;\n      transition.reopened = true;\n    }\n    return showMenu.call(this);\n  };\n  target.hideMenu = async function (this: PopupMenuDropdown): Promise<void> {\n    const scoped = this.classList.contains('kui-popup-menu');\n    const transition = { reopened: false };\n    if (scoped) hiding.set(this, transition);\n    await hideMenu.call(this);\n    // WA removes its document listeners before awaiting the hide animation.\n    // If Lit coalesces the intervening open request, restore the listeners\n    // after hide; an explicit showMenu above has already done so immediately.\n    if (\n      scoped &&\n      hiding.get(this) === transition &&\n      this.open &&\n      this.isConnected &&\n      this.popup?.active &&\n      !transition.reopened\n    ) {\n      this.popup.active = false;\n      void this.showMenu();\n    }\n    if (hiding.get(this) === transition) hiding.delete(this);\n  };\n}\n","interface SubmenuItem extends HTMLElement {\n  active: boolean;\n}\n\ninterface PopupMenuParentItem extends HTMLElement {\n  submenuElement?: HTMLElement;\n  submenuOpen: boolean;\n  getSubmenuItems(): SubmenuItem[];\n  openSubmenu(): Promise<void>;\n  closeSubmenu(): Promise<void>;\n}\n\nconst installed = new WeakSet<object>();\n\n/** Preserve a rapid keyboard move past Web Awesome's late first-item focus. */\nexport function installPopupMenuSubmenuFocus(prototype: object): void {\n  if (installed.has(prototype)) return;\n  installed.add(prototype);\n  const target = prototype as PopupMenuParentItem;\n  const openSubmenu = target.openSubmenu;\n  const closeSubmenu = target.closeSubmenu;\n  const submenuOpen = Object.getOwnPropertyDescriptor(prototype, 'submenuOpen');\n  if (submenuOpen?.set) {\n    Object.defineProperty(prototype, 'submenuOpen', {\n      ...submenuOpen,\n      set(this: PopupMenuParentItem, value: boolean) {\n        const wasOpen = this.submenuOpen;\n        submenuOpen.set!.call(this, value);\n        // Web Awesome's pointer, click, and ArrowRight paths assign true. A\n        // repeated assignment does not schedule updated(), so repair a stale\n        // open flag over a hidden submenu at the point of that user action.\n        if (\n          value &&\n          wasOpen &&\n          this.submenuElement?.hidden &&\n          this.closest('wa-dropdown.kui-popup-menu')\n        )\n          void this.openSubmenu();\n      },\n    });\n  }\n  target.closeSubmenu = async function (\n    this: PopupMenuParentItem,\n  ): Promise<void> {\n    const submenu = this.submenuElement;\n    await closeSubmenu.call(this);\n    // A new open can start while Web Awesome awaits its hide animation. Its\n    // late completion must not leave submenuOpen=true over a hidden submenu.\n    if (\n      this.submenuOpen &&\n      submenu?.hidden &&\n      this.isConnected &&\n      this.closest('wa-dropdown.kui-popup-menu')\n    )\n      void this.openSubmenu();\n  };\n  target.openSubmenu = async function (\n    this: PopupMenuParentItem,\n  ): Promise<void> {\n    const submenu = this.submenuElement;\n    if (!this.closest('wa-dropdown.kui-popup-menu') || !submenu)\n      return openSubmenu.call(this);\n\n    // WA's animation helper never resolves if asked to add an animation class\n    // already on the element. A second open while showing needs no new show;\n    // a stale hidden popup needs the old show canceled before reopening.\n    if (submenu.classList.contains('show')) {\n      if (!submenu.hidden) return;\n      submenu.classList.remove('show');\n    }\n\n    let desired: SubmenuItem | undefined;\n    const trackFocus = (event: FocusEvent) => {\n      const item = event\n        .composedPath()\n        .find(\n          (node): node is SubmenuItem =>\n            node instanceof HTMLElement &&\n            node.localName === 'wa-dropdown-item' &&\n            node.getAttribute('slot') === 'submenu',\n        );\n      if (item && this.getSubmenuItems().includes(item)) desired = item;\n    };\n    submenu.addEventListener('focusin', trackFocus);\n    try {\n      await openSubmenu.call(this);\n    } finally {\n      submenu.removeEventListener('focusin', trackFocus);\n    }\n\n    const items = this.getSubmenuItems();\n    if (!desired || desired === items[0]) return;\n    const selected = desired;\n    // Web Awesome queues its first-item focus after the show animation. This\n    // timer follows that one, restoring a user's later arrow choice only if\n    // the queued focus actually reset it. Pointer/blur/close paths are left alone.\n    window.setTimeout(() => {\n      if (\n        !this.isConnected ||\n        !this.submenuOpen ||\n        submenu.hidden ||\n        document.activeElement !== items[0]\n      )\n        return;\n      items.forEach((item) => (item.active = item === selected));\n      selected.focus({ preventScroll: true });\n    }, 0);\n  };\n}\n","interface SubmenuItem extends HTMLElement {\n  submenuElement?: HTMLElement;\n  submenuOpen: boolean;\n}\n\ninterface PopupMenuDropdown extends HTMLElement {\n  menu?: HTMLElement;\n  positionSubmenu(item: SubmenuItem): void;\n}\n\nconst installed = new WeakSet<object>();\nconst phoneWidth = '(max-width: 480px)';\nconst viewportInset = 8;\nconst menuGap = 4;\n\n/** Place a phone-width submenu beside its parent menu in the vertical axis. */\nexport function phoneSubmenuPosition(\n  parent: DOMRect,\n  submenu: DOMRect,\n  viewport: { width: number; height: number },\n  rtl: boolean,\n) {\n  const width = Math.min(submenu.width, viewport.width - 2 * viewportInset);\n  const height = submenu.height;\n  const below = Math.max(\n    0,\n    viewport.height - parent.bottom - menuGap - viewportInset,\n  );\n  const above = Math.max(0, parent.top - menuGap - viewportInset);\n  const useBelow = height <= below || (height > above && below >= above);\n  const availableHeight = useBelow ? below : above;\n  const left = rtl ? parent.right - width : parent.left;\n  return {\n    left: Math.max(\n      viewportInset,\n      Math.min(left, viewport.width - viewportInset - width),\n    ),\n    top: useBelow\n      ? parent.bottom + menuGap\n      : parent.top - menuGap - Math.min(height, availableHeight),\n    maxHeight: availableHeight,\n    maxWidth: viewport.width - 2 * viewportInset,\n  };\n}\n\nfunction clearPhoneStyles(submenu: HTMLElement) {\n  for (const property of [\n    'position',\n    'left',\n    'top',\n    'max-width',\n    'max-height',\n    'box-sizing',\n    'overflow-y',\n  ])\n    submenu.style.removeProperty(property);\n}\n\n/**\n * Web Awesome's horizontal flip can place a submenu over the parent menu on a\n * phone. Its own auto-update loop calls this method on scroll and resize, so\n * override only PopupMenu's narrow placement and leave native menu navigation\n * and selection intact.\n */\nexport function installPopupMenuSubmenuPlacement(prototype: object): void {\n  if (installed.has(prototype)) return;\n  installed.add(prototype);\n  const target = prototype as PopupMenuDropdown;\n  const positionSubmenu = target.positionSubmenu;\n  target.positionSubmenu = function (this: PopupMenuDropdown, item): void {\n    if (!this.classList.contains('kui-popup-menu')) {\n      positionSubmenu.call(this, item);\n      return;\n    }\n    const submenu = item.submenuElement;\n    if (!window.matchMedia(phoneWidth).matches || !submenu || !this.menu) {\n      if (submenu) clearPhoneStyles(submenu);\n      positionSubmenu.call(this, item);\n      return;\n    }\n\n    // The opening event starts positioning before Web Awesome unhides the\n    // submenu. Measure in the next microtask, after showPopover has run.\n    window.queueMicrotask(() => {\n      if (\n        !this.isConnected ||\n        !item.submenuOpen ||\n        !window.matchMedia(phoneWidth).matches ||\n        !this.menu ||\n        !submenu.isConnected\n      )\n        return;\n      const parentItem =\n        item.parentElement?.localName === 'wa-dropdown-item'\n          ? (item.parentElement as SubmenuItem)\n          : undefined;\n      const parentMenu = parentItem?.submenuElement ?? this.menu;\n      submenu.style.position = 'fixed';\n      submenu.style.maxWidth = `calc(100vw - ${2 * viewportInset}px)`;\n      submenu.style.maxHeight = 'none';\n      submenu.style.boxSizing = 'border-box';\n      submenu.style.overflowY = 'auto';\n      const placement = phoneSubmenuPosition(\n        parentMenu.getBoundingClientRect(),\n        submenu.getBoundingClientRect(),\n        { width: window.innerWidth, height: window.innerHeight },\n        window.getComputedStyle(this).direction === 'rtl',\n      );\n      submenu.style.left = `${placement.left}px`;\n      submenu.style.top = `${placement.top}px`;\n      submenu.style.maxHeight = `${placement.maxHeight}px`;\n      submenu.style.maxWidth = `${placement.maxWidth}px`;\n      submenu.setAttribute(\n        'data-placement',\n        placement.top >= parentMenu.getBoundingClientRect().bottom\n          ? 'bottom-start'\n          : 'top-start',\n      );\n    });\n  };\n}\n","import '@awesome.me/webawesome/dist/components/button/button.js';\nimport '@awesome.me/webawesome/dist/components/divider/divider.js';\nimport '@awesome.me/webawesome/dist/components/dropdown-item/dropdown-item.js';\nimport '@awesome.me/webawesome/dist/components/tooltip/tooltip.js';\n\nimport WaDropdown from '@awesome.me/webawesome/dist/components/dropdown/dropdown.js';\nimport WaDropdownItem from '@awesome.me/webawesome/dist/components/dropdown-item/dropdown-item.js';\n\nimport { installDropdownShowFocus } from './install-dropdown-show-focus.js';\nimport { installHelpTags } from './install-help-tag.js';\nimport { installPopupMenuKeyboard } from './install-popup-menu-keyboard.js';\nimport { installPopupMenuLifecycle } from './install-popup-menu-lifecycle.js';\nimport { installPopupMenuSubmenuFocus } from './install-popup-menu-submenu-focus.js';\nimport { installPopupMenuSubmenuPlacement } from './install-popup-menu-submenu-placement.js';\n\ninstallPopupMenuKeyboard(WaDropdown.prototype);\ninstallPopupMenuLifecycle(WaDropdown.prototype);\ninstallDropdownShowFocus(WaDropdown.prototype);\ninstallPopupMenuSubmenuFocus(WaDropdownItem.prototype);\ninstallPopupMenuSubmenuPlacement(WaDropdown.prototype);\ninstallHelpTags();\n\n/**\n * Marker export for tests and tooling; importing this module registers the\n * Web Awesome elements a `PopupMenu` renders (`wa-dropdown`,\n * `wa-dropdown-item`, `wa-button`, and `wa-divider`) and routes a keyboard\n * choice through the item's click so delegated `data-action`s run.\n */\nexport const popupMenuElementsRegistered = true;\n"]}

package/dist/popup-menu.d.ts

@@ -92,7 +92,8 @@ declare function closePopupMenu(menu: PopupMenuElement): void;
  * `nestedDropdown`) or a `PopupSurface` sizes and insets it as usual. Items
  * dispatch through delegated `data-action`s; the app owns the commands and any
  * open-state reaction. Import `@kerfjs/ui/popup-menu/register` once to register
- * the Web Awesome elements.
+ * the Web Awesome elements. At viewport widths up to 480px, submenus appear
+ * above or below their parent menu so their rows do not cover the parent list.
  */
 declare function PopupMenu({ text, label, icon, items, placement, caret, disabled, rootAttributes, slot, context, }: PopupMenuProps): SafeHtml;
 

package/dist/popup-menu.js

@@ -1,3 +1,3 @@
-export { PopupMenu, closePopupMenu, openPopupMenuAt } from './chunk-ZRWXFDDS.js';
+export { PopupMenu, closePopupMenu, openPopupMenuAt } from './chunk-J3KGJ6P6.js';
 
 //# sourceMappingURL=popup-menu.js.map

package/dist/styles/catalog/components/catalog-example.css

@@ -162,3 +162,7 @@
   --kui-catalog-example-align: 0.5rem;
   margin-inline-start: var(--kui-catalog-example-align);
 }
+
+.kui-catalog-example[data-align="text-trigger"] > wa-dropdown > wa-button {
+  margin-inline-start: 0.5rem;
+}

package/dist/styles/content-item.css

@@ -23,6 +23,11 @@
   );
 }
 
+.kui-content-item--flush {
+  padding-block: 0;
+  border-block-width: 0;
+}
+
 /* A visible frame for a content item that marks a real distinction: the
    standard neutral border, same geometry (the border is always reserved). */
 .kui-content-item--framed {
@@ -42,11 +47,15 @@
     [data-selected="true"]
   ) {
   --kui-content-item-border: var(--kui-color-neutral-border-normal);
-  --kui-content-item-background: var(--kui-color-neutral-fill-quiet);
+  --kui-content-item-background: var(--kui-color-neutral-fill-normal);
 }
 
 .kui-content-item[data-interactive="true"]:active:not([data-disabled="true"]) {
-  --kui-content-item-background: var(--kui-color-neutral-fill-normal);
+  --kui-content-item-background: color-mix(
+    in srgb,
+    var(--kui-color-neutral-fill-normal) 75%,
+    var(--kui-color-neutral-fill-loud)
+  );
 }
 
 .kui-content-item[data-interactive="true"][data-selected="true"] {

package/dist/styles/grid.css

@@ -21,6 +21,13 @@
   );
 }
 
+.kui-grid[data-auto-fill="true"] {
+  grid-template-columns: repeat(
+    auto-fill,
+    minmax(min(100%, var(--_kui-grid-min-column-width)), 1fr)
+  );
+}
+
 /* `fill`: the layout root of a definite-height parent (an app root or a
    fixed-height frame) takes its full height. Inside a flex layout use `flex`. */
 .kui-grid[data-fill="true"] {

package/dist/styles/popup-menu.css

@@ -48,6 +48,15 @@
       var(--_kui-popup-row-check-width)
   );
 }
+/* Web Awesome's nested submenu owns its item host padding. Move its exposed
+   checkmark inside the panel and leave room for the label beside it. */
+.kui-popup-menu
+  wa-dropdown-item[slot="submenu"][type="checkbox"]::part(checkmark) {
+  margin-inline-start: 0;
+}
+.kui-popup-menu wa-dropdown-item[slot="submenu"][type="checkbox"]::part(label) {
+  padding-inline-start: 1em;
+}
 .kui-popup-menu wa-dropdown-item::part(label) {
   padding-block: var(--_kui-popup-row-label-padding-block);
   line-height: var(--_kui-popup-row-label-line-height);

package/dist/styles/segmented-control.css

@@ -119,6 +119,9 @@
   line-height: 1;
   white-space: nowrap;
   cursor: pointer;
+  /* Web Awesome's native button transition includes color. During a theme
+     switch that briefly puts the old text tone on the new filled track. */
+  transition-property: background, border, box-shadow;
 }
 
 .kui-segmented-control[data-size="small"] .kui-segmented-control__item {

package/dist/styles/token-search-field.css

@@ -85,7 +85,8 @@
 }
 
 .kui-token-search__token button,
-.kui-token-search__clear {
+.kui-token-search__clear,
+.kui-token-search__trailing-action {
   appearance: none;
   display: inline-grid;
   padding: 0;
@@ -110,12 +111,15 @@
 .kui-token-search__token-remove:hover,
 .kui-token-search__token-remove:focus-visible,
 .kui-token-search__clear:hover,
-.kui-token-search__clear:focus-visible {
+.kui-token-search__clear:focus-visible,
+.kui-token-search__trailing-action:hover,
+.kui-token-search__trailing-action:focus-visible {
   background: color-mix(in srgb, currentColor 12%, transparent);
 }
 
 .kui-token-search__token button:focus-visible,
-.kui-token-search__clear:focus-visible {
+.kui-token-search__clear:focus-visible,
+.kui-token-search__trailing-action:focus-visible {
   outline: var(--kui-focus-ring);
   outline-offset: 1px;
 }
@@ -130,7 +134,8 @@
 }
 
 .kui-token-search__clear,
-.kui-token-search__trailing {
+.kui-token-search__trailing,
+.kui-token-search__trailing-action {
   display: inline-grid;
   width: 1.5rem;
   height: var(--kui-token-search-line-size);
@@ -147,6 +152,11 @@
   grid-column: 4;
 }
 
+.kui-token-search__trailing-action {
+  grid-column: 4;
+  border-radius: var(--kui-radius-pill);
+}
+
 .kui-token-search__suggestions {
   display: grid;
   position: absolute;
@@ -178,6 +188,7 @@
   background: transparent;
   font: inherit;
   text-align: start;
+  justify-content: flex-start;
   cursor: pointer;
 }
 
@@ -192,7 +203,8 @@
 }
 
 .kui-token-search__clear svg,
-.kui-token-search__trailing svg {
+.kui-token-search__trailing svg,
+.kui-token-search__trailing-action svg {
   width: 0.85rem;
   height: 0.85rem;
 }
@@ -213,6 +225,11 @@
     border-color 0.2s ease;
 }
 
+.kui-token-search[data-collapsible="true"][data-expanded="true"][data-fill="true"] {
+  width: 100%;
+  flex: 1 1 auto;
+}
+
 .kui-token-search[data-collapsible="true"][data-expanded="true"]:has(
     .kui-token-search__suggestions
   ) {

package/dist/styles/toolbar-control-group.css

@@ -156,6 +156,13 @@
     border-color 0.2s ease;
 }
 
+.kui-toolbar-control-group[data-content="search"]:has(
+    > .kui-token-search[data-expanded="true"][data-fill="true"]
+  ) {
+  width: 100%;
+  flex: 1 1 auto;
+}
+
 .kui-toolbar-control-group[data-content="search"]:has(
     .kui-token-search__suggestions
   ) {
@@ -165,6 +172,13 @@
   width: var(--kui-toolbar-group-size, calc(2px + 2.625rem));
   flex: 0 0 auto;
 }
+
+.kui-toolbar-control-group[data-content="search"]:has(
+    > .kui-token-search[data-expanded="false"][data-fill="true"]
+  ) {
+  width: var(--kui-toolbar-group-size, calc(2px + 2.625rem));
+  flex: 0 0 auto;
+}
 .kui-toolbar-control-group[data-content="text"]
   > :is(button, wa-button, .kui-toolbar-action-link),
 .kui-toolbar-control-group[data-content="mixed"]

package/dist/styles/workbench.css

@@ -669,17 +669,11 @@
   display: none;
 }
 
-.kui-workbench:has(
-    > .kui-workbench__rail--left[data-responsive-overlay-active="true"]
-  )
-  > .kui-workbench__center {
+.kui-workbench[data-numeric-overlays~="left"] > .kui-workbench__center {
   --kui-edge-inset-inline-start: var(--_kui-workbench-safe-inline-start);
 }
 
-.kui-workbench:has(
-    > .kui-workbench__rail--right[data-responsive-overlay-active="true"]
-  )
-  > .kui-workbench__center {
+.kui-workbench[data-numeric-overlays~="right"] > .kui-workbench__center {
   --kui-edge-inset-inline-end: var(--_kui-workbench-safe-inline-end);
 }
 
@@ -701,21 +695,13 @@
   background: var(--kui-color-surface);
 }
 
-.kui-workbench__main:has(
-  + .kui-workbench__drawer[data-responsive-overlay-active="true"]
-) {
+.kui-workbench[data-numeric-overlays~="drawer"]
+  > .kui-workbench__center
+  > .kui-workbench__main {
   --_kui-workbench-content-edge-block-end: var(--_kui-workbench-safe-block-end);
 }
 
-.kui-workbench[data-overlay-backdrop="true"]:has(
-    > .kui-workbench__rail[data-responsive-overlay-active="true"]:not(
-        [data-collapsed="true"]
-      ),
-    > .kui-workbench__center
-      > .kui-workbench__drawer[data-responsive-overlay-active="true"]:not(
-        [data-collapsed="true"]
-      )
-  )
+.kui-workbench[data-overlay-backdrop="true"][data-numeric-overlays~="open"]
   > .kui-workbench__backdrop {
   display: block;
 }
@@ -1024,11 +1010,7 @@
   --_kui-workbench-covered: hidden;
 }
 
-.kui-workbench:has(
-    > .kui-workbench__rail[data-responsive-overlay-active="true"]:not(
-        [data-collapsed="true"]
-      )
-  )
+.kui-workbench[data-numeric-overlays~="rail-open"]
   > :is(.kui-workbench__center, .kui-workbench__restore) {
   --_kui-workbench-covered: hidden;
 }