@floegence/floe-webapp-core 0.39.2 → 0.39.4

package/dist/components/ui/dialogSurfaceScope.js

@@ -1,9 +1,9 @@
-const a = "data-floe-dialog-surface-host", y = a, p = "data-floe-surface-portal-layer", A = "data-floe-dialog-surface-boundary", g = 1600;
+const d = "data-floe-dialog-surface-host", y = d, p = "data-floe-surface-portal-layer", v = "data-floe-surface-floating-layer", _ = "data-floe-dialog-surface-boundary", g = 1600;
 let r = null, o = null;
 function E(t) {
   return typeof Element < "u" && t instanceof Element ? t : typeof Node < "u" && t instanceof Node ? t.parentElement : null;
 }
-function w(t) {
+function T(t) {
   const e = t?.activeElement;
   return e instanceof Element ? e : null;
 }
@@ -11,7 +11,7 @@ function l(t) {
   const e = typeof document < "u" ? document : null;
   r = {
     target: E(t),
-    activeElement: w(e),
+    activeElement: T(e),
     recordedAt: Date.now()
   };
 }
@@ -21,41 +21,41 @@ function c(t) {
 function f(t) {
   l(t.target);
 }
-function d(t) {
+function a(t) {
   l(t.target);
 }
 function s() {
-  T();
-}
-function T() {
-  typeof document > "u" || o !== document && (o && (o.removeEventListener("pointerdown", c, !0), o.removeEventListener("focusin", f, !0), o.removeEventListener("contextmenu", d, !0)), document.addEventListener("pointerdown", c, !0), document.addEventListener("focusin", f, !0), document.addEventListener("contextmenu", d, !0), o = document);
+  R();
 }
 function R() {
+  typeof document > "u" || o !== document && (o && (o.removeEventListener("pointerdown", c, !0), o.removeEventListener("focusin", f, !0), o.removeEventListener("contextmenu", a, !0)), document.addEventListener("pointerdown", c, !0), document.addEventListener("focusin", f, !0), document.addEventListener("contextmenu", a, !0), o = document);
+}
+function w() {
   return !r || Date.now() - r.recordedAt > g ? null : r;
 }
 function i(t) {
-  const e = t?.closest(`[${a}="true"]`);
+  const e = t?.closest(`[${d}="true"]`);
   return typeof HTMLElement > "u" ? null : e instanceof HTMLElement ? e : null;
 }
-function S(t) {
+function A(t) {
   if (!t) return null;
   const e = t.closest(`[${p}="true"]`);
   return typeof HTMLElement > "u" ? null : e instanceof HTMLElement ? e : null;
 }
 function L(t = {}) {
   s();
-  const e = R(), n = i(t.owner ?? null) ?? i(e?.target ?? null) ?? i(e?.activeElement ?? null);
+  const e = w(), n = i(t.owner ?? null) ?? i(e?.target ?? null) ?? i(e?.activeElement ?? null);
   return n ? {
     host: n,
     boundaryHost: n,
-    mountHost: S(n) ?? n,
+    mountHost: A(n) ?? n,
     mode: "surface"
   } : { host: null, boundaryHost: null, mountHost: null, mode: "global" };
 }
 function u(t) {
   return t.mode === "surface" && !!t.boundaryHost?.isConnected;
 }
-function v(t) {
+function S(t) {
   if (u(t))
     return t.mountHost ?? t.boundaryHost ?? void 0;
 }
@@ -76,7 +76,7 @@ function m() {
     height: window.innerHeight
   };
 }
-function _(t) {
+function b(t) {
   if (!u(t) || !t.boundaryHost)
     return m();
   const e = t.boundaryHost.getBoundingClientRect();
@@ -90,7 +90,7 @@ function _(t) {
   };
 }
 function h(t) {
-  const e = v(t);
+  const e = S(t);
   if (!e)
     return m();
   const n = e.getBoundingClientRect();
@@ -103,7 +103,7 @@ function h(t) {
     height: n.height
   };
 }
-function b(t, e) {
+function P(t, e) {
   if (!u(e))
     return t;
   const n = h(e);
@@ -112,7 +112,7 @@ function b(t, e) {
     y: t.y - n.top
   };
 }
-function P(t, e) {
+function C(t, e) {
   if (!u(e))
     return t;
   const n = h(e);
@@ -125,23 +125,24 @@ function P(t, e) {
     height: t.height
   };
 }
-function C() {
+function H() {
   r = null;
 }
 typeof document < "u" && s();
 export {
-  A as DIALOG_SURFACE_BOUNDARY_ATTR,
-  a as DIALOG_SURFACE_HOST_ATTR,
+  _ as DIALOG_SURFACE_BOUNDARY_ATTR,
+  d as DIALOG_SURFACE_HOST_ATTR,
+  v as SURFACE_FLOATING_LAYER_ATTR,
   y as SURFACE_PORTAL_HOST_ATTR,
   p as SURFACE_PORTAL_LAYER_ATTR,
-  C as __resetSurfacePortalScopeForTests,
+  H as __resetSurfacePortalScopeForTests,
   s as ensureDialogSurfaceInteractionTracking,
-  T as ensureSurfacePortalInteractionTracking,
+  R as ensureSurfacePortalInteractionTracking,
   u as isSurfacePortalMode,
-  b as projectSurfacePortalPosition,
-  P as projectSurfacePortalRect,
-  _ as resolveSurfacePortalBoundaryRect,
+  P as projectSurfacePortalPosition,
+  C as projectSurfacePortalRect,
+  b as resolveSurfacePortalBoundaryRect,
   L as resolveSurfacePortalHost,
-  v as resolveSurfacePortalMount,
+  S as resolveSurfacePortalMount,
   h as resolveSurfacePortalMountRect
 };

package/dist/components/ui/index.d.ts

@@ -4,6 +4,7 @@ export { Input, Textarea, NumberInput, AffixInput, type InputProps, type InputSi
 export { Dialog, ConfirmDialog, type DialogProps, type ConfirmDialogProps } from './Dialog';
 export { FloatingWindow, type FloatingWindowProps } from './FloatingWindow';
 export { createFloatingPresence, type FloatingPresence, type FloatingPresenceOptions, type FloatingPresenceState, } from './floatingPresence';
+export { MENU_ITEM_SELECTOR, focusMenuItem, getMenuItems, handleMenuKeyboardNavigation, moveMenuFocus, type MenuDismissReason, type MenuFocusMode, type MenuKeyboardNavigationOptions, } from './menuUtils';
 export { resolveFloatingWindowViewport, type FloatingWindowRect, type FloatingWindowViewport, type FloatingWindowViewportInsets, } from './floatingWindowGeometry';
 export { Dropdown, Select, type DropdownProps, type DropdownItem, type SelectProps, } from './Dropdown';
 export { SurfaceFloatingLayer, type SurfaceFloatingLayerPosition, type SurfaceFloatingLayerProps, type SurfaceFloatingLayerSize, } from './SurfaceFloatingLayer';

package/dist/components/ui/menuUtils.d.ts

@@ -9,6 +9,10 @@ export type MenuBoundaryRect = Readonly<{
     height: number;
 }>;
 export type MenuFocusMode = 'first' | 'last' | 'selected';
+export type MenuDismissReason = 'escape' | 'tab' | 'shift-tab';
+export type MenuKeyboardNavigationOptions = Readonly<{
+    onDismiss: (reason: MenuDismissReason) => void;
+}>;
 export declare function resolveViewportMenuBoundaryRect(): MenuBoundaryRect;
 export declare function clampMenuPosition(anchor: Readonly<{
     x: number;
@@ -32,3 +36,4 @@ export declare function getWrappedMenuItemIndex(length: number, currentIndex: nu
 export declare function getMenuItems(root: ParentNode | null | undefined): HTMLElement[];
 export declare function focusMenuItem(root: ParentNode | null | undefined, mode?: MenuFocusMode): boolean;
 export declare function moveMenuFocus(root: ParentNode | null | undefined, current: HTMLElement | null, delta: 1 | -1): boolean;
+export declare function handleMenuKeyboardNavigation(event: KeyboardEvent, options: MenuKeyboardNavigationOptions): boolean;

package/dist/components/ui/menuUtils.js

@@ -1,5 +1,5 @@
-const u = 8, M = '[role="menuitem"]:not([disabled]):not([aria-disabled="true"])';
-function a() {
+const E = 8, h = '[role="menuitem"]:not([disabled]):not([aria-disabled="true"])';
+function M() {
   return typeof window > "u" ? {
     left: 0,
     top: 0,
@@ -16,75 +16,97 @@ function a() {
     height: window.innerHeight
   };
 }
-function h(e) {
-  return e ?? a();
+function f(t) {
+  return t ?? M();
 }
-function E(e, t, f) {
-  const i = h(f);
-  let o = e.x, n = e.y;
-  return o + t.width > i.right - 8 && (o = i.right - t.width - 8), n + t.height > i.bottom - 8 && (n = i.bottom - t.height - 8), {
-    x: Math.max(i.left + 8, o),
-    y: Math.max(i.top + 8, n)
+function w(t, e, r) {
+  const n = f(r);
+  let o = t.x, i = t.y;
+  return o + e.width > n.right - 8 && (o = n.right - e.width - 8), i + e.height > n.bottom - 8 && (i = n.bottom - e.height - 8), {
+    x: Math.max(n.left + 8, o),
+    y: Math.max(n.top + 8, i)
   };
 }
-function A(e, t, f, i) {
-  const o = h(i);
-  let n;
-  switch (f) {
+function T(t, e, r, n) {
+  const o = f(n);
+  let i;
+  switch (r) {
     case "center":
-      n = e.left + e.width / 2 - t.width / 2;
+      i = t.left + t.width / 2 - e.width / 2;
       break;
     case "end":
-      n = e.right - t.width;
+      i = t.right - e.width;
       break;
     default:
-      n = e.left;
+      i = t.left;
   }
-  let r = e.bottom + 4;
-  if (n + t.width > o.right - 8 && (n = o.right - t.width - 8), n = Math.max(o.left + 8, n), r + t.height > o.bottom - 8) {
-    const I = e.top - o.top - 8, d = o.bottom - e.bottom - 8;
-    I > d && I >= t.height ? r = e.top - t.height - 4 : r = o.bottom - t.height - 8;
+  let a = t.bottom + 4;
+  if (i + e.width > o.right - 8 && (i = o.right - e.width - 8), i = Math.max(o.left + 8, i), a + e.height > o.bottom - 8) {
+    const s = t.top - o.top - 8, d = o.bottom - t.bottom - 8;
+    s > d && s >= e.height ? a = t.top - e.height - 4 : a = o.bottom - e.height - 8;
   }
-  return r = Math.max(o.top + 8, r), { x: n, y: r };
+  return a = Math.max(o.top + 8, a), { x: i, y: a };
 }
-function P(e, t, f) {
-  const i = h(f);
-  let o = e.right, n = e.top;
-  if (o + t.width > i.right - 8) {
-    const r = e.left - t.width;
-    r >= i.left + 8 ? o = r : o = i.right - t.width - 8;
+function A(t, e, r) {
+  const n = f(r);
+  let o = t.right, i = t.top;
+  if (o + e.width > n.right - 8) {
+    const a = t.left - e.width;
+    a >= n.left + 8 ? o = a : o = n.right - e.width - 8;
   }
-  return n + t.height > i.bottom - 8 && (n = i.bottom - t.height - 8), o = Math.max(i.left + 8, o), n = Math.max(i.top + 8, n), { x: o, y: n };
+  return i + e.height > n.bottom - 8 && (i = n.bottom - e.height - 8), o = Math.max(n.left + 8, o), i = Math.max(n.top + 8, i), { x: o, y: i };
 }
-function s(e, t, f) {
-  return e <= 0 ? null : t < 0 ? f > 0 ? 0 : e - 1 : (t + f + e) % e;
+function c(t, e, r) {
+  return t <= 0 ? null : e < 0 ? r > 0 ? 0 : t - 1 : (e + r + t) % t;
 }
-function l(e) {
-  return !e || typeof HTMLElement > "u" ? [] : Array.from(e.querySelectorAll(M)).filter(
-    (t) => t instanceof HTMLElement
+function I(t) {
+  return !t || typeof HTMLElement > "u" ? [] : Array.from(t.querySelectorAll(h)).filter(
+    (e) => e instanceof HTMLElement
   );
 }
-function T(e, t = "first") {
-  const f = l(e);
-  if (!f.length) return !1;
-  let i = f[0];
-  return t === "last" ? i = f[f.length - 1] : t === "selected" && (i = f.find((o) => o.getAttribute("data-floe-selected") === "true") ?? f[0]), i.focus(), !0;
+function l(t, e = "first") {
+  const r = I(t);
+  if (!r.length) return !1;
+  let n = r[0];
+  return e === "last" ? n = r[r.length - 1] : e === "selected" && (n = r.find((o) => o.getAttribute("data-floe-selected") === "true") ?? r[0]), n.focus(), !0;
 }
-function w(e, t, f) {
-  const i = l(e);
-  if (!i.length) return !1;
-  const o = t ? i.indexOf(t) : -1, n = s(i.length, o, f);
-  return n === null ? !1 : (i[n]?.focus(), !0);
+function u(t, e, r) {
+  const n = I(t);
+  if (!n.length) return !1;
+  const o = e ? n.indexOf(e) : -1, i = c(n.length, o, r);
+  return i === null ? !1 : (n[i]?.focus(), !0);
+}
+function P(t, e) {
+  const r = typeof HTMLElement < "u" && t.target instanceof HTMLElement ? t.target : null, n = r?.closest('[role="menu"]');
+  if (!n) return !1;
+  const o = r?.closest(h);
+  switch (t.key) {
+    case "ArrowDown":
+      return t.preventDefault(), u(n, o, 1), !0;
+    case "ArrowUp":
+      return t.preventDefault(), u(n, o, -1), !0;
+    case "Home":
+      return t.preventDefault(), l(n, "first"), !0;
+    case "End":
+      return t.preventDefault(), l(n, "last"), !0;
+    case "Escape":
+      return t.preventDefault(), t.stopPropagation(), e.onDismiss("escape"), !0;
+    case "Tab":
+      return e.onDismiss(t.shiftKey ? "shift-tab" : "tab"), !0;
+    default:
+      return !1;
+  }
 }
 export {
-  M as MENU_ITEM_SELECTOR,
-  u as VIEWPORT_MARGIN,
-  A as calculateMenuPosition,
-  P as calculateSubmenuPosition,
-  E as clampMenuPosition,
-  T as focusMenuItem,
-  l as getMenuItems,
-  s as getWrappedMenuItemIndex,
-  w as moveMenuFocus,
-  a as resolveViewportMenuBoundaryRect
+  h as MENU_ITEM_SELECTOR,
+  E as VIEWPORT_MARGIN,
+  T as calculateMenuPosition,
+  A as calculateSubmenuPosition,
+  w as clampMenuPosition,
+  l as focusMenuItem,
+  I as getMenuItems,
+  c as getWrappedMenuItemIndex,
+  P as handleMenuKeyboardNavigation,
+  u as moveMenuFocus,
+  M as resolveViewportMenuBoundaryRect
 };

package/dist/components/ui/surfacePortalScope.d.ts

@@ -1 +1 @@
-export { DIALOG_SURFACE_HOST_ATTR, SURFACE_PORTAL_HOST_ATTR, SURFACE_PORTAL_LAYER_ATTR, DIALOG_SURFACE_BOUNDARY_ATTR, ensureSurfacePortalInteractionTracking, resolveSurfacePortalHost, isSurfacePortalMode, resolveSurfacePortalMount, resolveSurfacePortalBoundaryRect, resolveSurfacePortalMountRect, projectSurfacePortalPosition, projectSurfacePortalRect, __resetSurfacePortalScopeForTests, type SurfacePortalInteractionSnapshot, type SurfacePortalHostResolutionOptions, type SurfacePortalMode, type ResolvedSurfacePortalHost, type SurfacePortalBoundaryRect, type SurfacePortalRect, } from './dialogSurfaceScope';
+export { DIALOG_SURFACE_HOST_ATTR, SURFACE_PORTAL_HOST_ATTR, SURFACE_PORTAL_LAYER_ATTR, SURFACE_FLOATING_LAYER_ATTR, DIALOG_SURFACE_BOUNDARY_ATTR, ensureSurfacePortalInteractionTracking, resolveSurfacePortalHost, isSurfacePortalMode, resolveSurfacePortalMount, resolveSurfacePortalBoundaryRect, resolveSurfacePortalMountRect, projectSurfacePortalPosition, projectSurfacePortalRect, __resetSurfacePortalScopeForTests, type SurfacePortalInteractionSnapshot, type SurfacePortalHostResolutionOptions, type SurfacePortalMode, type ResolvedSurfacePortalHost, type SurfacePortalBoundaryRect, type SurfacePortalRect, } from './dialogSurfaceScope';