@tcn/ui 0.2.0 → 0.3.1

package/dist/layouts/utility_bar/utility_bar.js

@@ -1,23 +1,23 @@
-import { jsx as e } from "react/jsx-runtime";
-import l from "react";
+import { jsx as s } from "react/jsx-runtime";
+import c from "react";
 import { clsx as y } from "clsx";
 import { HStack as m } from "../../stacks/h_stack.js";
-import '../../utility_bar.css';const u = "_utility-bar_3a92315", n = { "utility-bar": u }, x = l.forwardRef(
+import '../../utility_bar.css';const u = "_utility-bar_3a92315", f = { "utility-bar": u }, h = c.forwardRef(
   function({
     hierarchy: t = "secondary",
     height: r = "auto",
     children: a,
     className: i,
     size: o = "md",
-    ...s
-  }, c) {
-    return /* @__PURE__ */ e(
+    ...e
+  }, l) {
+    return /* @__PURE__ */ s(
       m,
       {
-        ref: c,
+        ref: l,
         as: "header",
         className: y(
-          n["utility-bar"],
+          f["utility-bar"],
           i,
           "utility-bar",
           "tcn-utility-bar"
@@ -25,13 +25,13 @@ import '../../utility_bar.css';const u = "_utility-bar_3a92315", n = { "utility-
         "data-hierarchy": t,
         "data-size": o,
         height: r,
-        ...s,
+        ...e,
         children: a
       }
     );
   }
 );
 export {
-  x as UtilityBar
+  h as UtilityBar
 };
 //# sourceMappingURL=utility_bar.js.map

package/dist/modal.css

@@ -1 +1 @@
-._modal_473c6ef{width:100%;height:100%}
+._modal_473c6ef{width:auto;height:auto}

package/dist/overlay/frame/frame.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"frame.d.ts","sourceRoot":"","sources":["../../../src/overlay/frame/frame.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAIjE,MAAM,WAAW,aAAa;IAC5B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,MAAM,MAAM,UAAU,GAAG,WAAW,GAAG,aAAa,CAAC;AAErD,eAAO,MAAM,KAAK,oHAmBhB,CAAC"}
+{"version":3,"file":"frame.d.ts","sourceRoot":"","sources":["../../../src/overlay/frame/frame.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAQjE,MAAM,WAAW,aAAa;IAC5B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,MAAM,MAAM,UAAU,GAAG,WAAW,GAAG,aAAa,CAAC;AAErD,eAAO,MAAM,KAAK,oHA+BhB,CAAC"}

package/dist/overlay/frame/frame.js

@@ -1,5 +1,5 @@
 import { jsx as r } from "react/jsx-runtime";
-import p from "react";
+import c from "react";
 import "../../stacks/box/box.js";
 import "../../stacks/h_collapsible_box.js";
 import "../../stacks/h_stack.js";
@@ -7,12 +7,29 @@ import "../../stacks/spacer.js";
 import "../../stacks/v_collapsible_box.js";
 import "../../stacks/v_stack.js";
 import { ZStack as t } from "../../stacks/z_stack.js";
-import { Portal as l } from "../portal/portal.js";
+import { Portal as s } from "../portal/portal.js";
 import { Draggable as n } from "../../utils/dnd/draggable/draggable.js";
-const k = p.forwardRef(function({ children: o, isOpen: i = !1, draggable: m = !0, veil: e = !1, ...a }, f) {
-  return i ? /* @__PURE__ */ r(l, { children: /* @__PURE__ */ r(t, { width: "100%", height: "100%", "data-is-veil": e, className: "tcn-frame", children: /* @__PURE__ */ r(n, { draggable: m, children: /* @__PURE__ */ r(t, { ref: f, ...a, children: o }) }) }) }) : null;
+import { clsx as p } from "clsx";
+import '../../frame.css';const d = "_frame_ce82001", h = { frame: d }, D = c.forwardRef(function({
+  children: e,
+  isOpen: m = !1,
+  draggable: o = !0,
+  veil: a = !1,
+  className: i,
+  ...f
+}, l) {
+  return m ? /* @__PURE__ */ r(s, { children: /* @__PURE__ */ r(t, { width: "100%", height: "100%", "data-is-veil": a, className: "tcn-frame-veil", children: /* @__PURE__ */ r(n, { draggable: o, children: /* @__PURE__ */ r(
+    t,
+    {
+      as: "dialog",
+      ref: l,
+      className: p(h.frame, "tcn-frame", i),
+      ...f,
+      children: e
+    }
+  ) }) }) }) : null;
 });
 export {
-  k as Frame
+  D as Frame
 };
 //# sourceMappingURL=frame.js.map

package/dist/overlay/frame/frame.js.map

@@ -1 +1 @@
-{"version":3,"file":"frame.js","sources":["../../../src/overlay/frame/frame.tsx"],"sourcesContent":["import React from 'react';\nimport { ZStack, type ZStackProps } from '../../stacks/index.js';\nimport { Portal } from '../portal/portal.js';\nimport { Draggable } from '../../utils/dnd/draggable/draggable.js';\n\nexport interface FrameOwnProps {\n  isOpen?: boolean;\n  children?: React.ReactNode;\n  draggable?: boolean;\n  veil?: boolean;\n}\n\nexport type FrameProps = ZStackProps & FrameOwnProps;\n\nexport const Frame = React.forwardRef<HTMLDialogElement, FrameProps>(function Frame(\n  { children, isOpen = false, draggable = true, veil = false, ...rest }: FrameProps,\n  ref\n) {\n  if (!isOpen) {\n    return null;\n  }\n\n  return (\n    <Portal>\n      <ZStack width=\"100%\" height=\"100%\" data-is-veil={veil} className=\"tcn-frame\">\n        <Draggable draggable={draggable}>\n          <ZStack ref={ref} {...rest}>\n            {children}\n          </ZStack>\n        </Draggable>\n      </ZStack>\n    </Portal>\n  );\n});\n"],"names":["Frame","React","children","isOpen","draggable","veil","rest","ref","jsx","Portal","ZStack","Draggable"],"mappings":";;;;;;;;;;;AAcO,MAAMA,IAAQC,EAAM,WAA0C,SACnE,EAAE,UAAAC,GAAU,QAAAC,IAAS,IAAO,WAAAC,IAAY,IAAM,MAAAC,IAAO,IAAO,GAAGC,EAAA,GAC/DC,GACA;AACA,SAAKJ,IAKH,gBAAAK,EAACC,KACC,UAAA,gBAAAD,EAACE,GAAA,EAAO,OAAM,QAAO,QAAO,QAAO,gBAAcL,GAAM,WAAU,aAC/D,UAAA,gBAAAG,EAACG,GAAA,EAAU,WAAAP,GACT,UAAA,gBAAAI,EAACE,GAAA,EAAO,KAAAH,GAAW,GAAGD,GACnB,UAAAJ,EAAA,CACH,EAAA,CACF,EAAA,CACF,EAAA,CACF,IAZO;AAcX,CAAC;"}
+{"version":3,"file":"frame.js","sources":["../../../src/overlay/frame/frame.tsx"],"sourcesContent":["import React from 'react';\nimport { ZStack, type ZStackProps } from '../../stacks/index.js';\nimport { Portal } from '../portal/portal.js';\nimport { Draggable } from '../../utils/dnd/draggable/draggable.js';\n\n// Styles\nimport styles from './frame.module.css';\nimport { clsx } from 'clsx';\n\nexport interface FrameOwnProps {\n  isOpen?: boolean;\n  children?: React.ReactNode;\n  draggable?: boolean;\n  veil?: boolean;\n}\n\nexport type FrameProps = ZStackProps & FrameOwnProps;\n\nexport const Frame = React.forwardRef<HTMLDialogElement, FrameProps>(function Frame(\n  {\n    children,\n    isOpen = false,\n    draggable = true,\n    veil = false,\n    className,\n    ...rest\n  }: FrameProps,\n  ref\n) {\n  if (!isOpen) {\n    return null;\n  }\n\n  return (\n    <Portal>\n      <ZStack width=\"100%\" height=\"100%\" data-is-veil={veil} className=\"tcn-frame-veil\">\n        <Draggable draggable={draggable}>\n          <ZStack\n            as=\"dialog\"\n            ref={ref}\n            className={clsx(styles['frame'], 'tcn-frame', className)}\n            {...rest}\n          >\n            {children}\n          </ZStack>\n        </Draggable>\n      </ZStack>\n    </Portal>\n  );\n});\n"],"names":["Frame","React","children","isOpen","draggable","veil","className","rest","ref","jsx","Portal","ZStack","Draggable","clsx","styles"],"mappings":";;;;;;;;;;;;8CAkBaA,IAAQC,EAAM,WAA0C,SACnE;AAAA,EACE,UAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,WAAAC,IAAY;AAAA,EACZ,MAAAC,IAAO;AAAA,EACP,WAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,SAAKL,IAKH,gBAAAM,EAACC,GAAA,EACC,UAAA,gBAAAD,EAACE,GAAA,EAAO,OAAM,QAAO,QAAO,QAAO,gBAAcN,GAAM,WAAU,kBAC/D,UAAA,gBAAAI,EAACG,KAAU,WAAAR,GACT,UAAA,gBAAAK;AAAA,IAACE;AAAA,IAAA;AAAA,MACC,IAAG;AAAA,MACH,KAAAH;AAAA,MACA,WAAWK,EAAKC,EAAO,OAAU,aAAaR,CAAS;AAAA,MACtD,GAAGC;AAAA,MAEH,UAAAL;AAAA,IAAA;AAAA,EAAA,EACH,CACF,GACF,GACF,IAjBO;AAmBX,CAAC;"}

package/dist/overlay/index.d.ts

@@ -1,7 +1,14 @@
 export * from './portal/portal.js';
 export * from './context_menu/context_menu.js';
 export * from './menu/menu.js';
-export * from './tooltip/tooltip.js';
-export * from './popper/popper.js';
 export { Frame, type FrameOwnProps, type FrameProps } from './frame/frame.js';
+export { ElementTethered, type ElementTetheredProps, } from './tethered/element_tethered.js';
+export { Tethered, type TetheredProps } from './tethered/tethered.js';
+export { type HorizontalTether, type VerticalTether } from './tethered/types.js';
+export * from './popper/legacy/popper.js';
+export { PopperDismissal, type PopperDismissalDecoratorProps, } from './popper/base/dismissal_decorator.js';
+export { PreviewPopper, type PreviewPopperProps, } from './popper/preview_popper.js';
+export { ContextPopper, type ContextPopperProps, } from './popper/context_popper.js';
+export { ElementPopper, type ElementPopperProps, } from './popper/element_popper.js';
+export { type BasePopperOwnProps, type BasePopperProps, BasePopper, } from './popper/base/base_popper.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/overlay/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/overlay/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,gBAAgB,CAAC;AAC/B,cAAc,sBAAsB,CAAC;AACrC,cAAc,oBAAoB,CAAC;AACnC,OAAO,EAAE,KAAK,EAAE,KAAK,aAAa,EAAE,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/overlay/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,gBAAgB,CAAC;AAE/B,OAAO,EAAE,KAAK,EAAE,KAAK,aAAa,EAAE,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9E,OAAO,EACL,eAAe,EACf,KAAK,oBAAoB,GAC1B,MAAM,gCAAgC,CAAC;AACxC,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EAAE,KAAK,gBAAgB,EAAE,KAAK,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACjF,cAAc,2BAA2B,CAAC;AAC1C,OAAO,EACL,eAAe,EACf,KAAK,6BAA6B,GACnC,MAAM,sCAAsC,CAAC;AAC9C,OAAO,EACL,aAAa,EACb,KAAK,kBAAkB,GACxB,MAAM,4BAA4B,CAAC;AACpC,OAAO,EACL,aAAa,EACb,KAAK,kBAAkB,GACxB,MAAM,4BAA4B,CAAC;AACpC,OAAO,EACL,aAAa,EACb,KAAK,kBAAkB,GACxB,MAAM,4BAA4B,CAAC;AACpC,OAAO,EACL,KAAK,kBAAkB,EACvB,KAAK,eAAe,EACpB,UAAU,GACX,MAAM,8BAA8B,CAAC"}

package/dist/overlay/index.js

@@ -1,16 +1,28 @@
-import { Portal as e } from "./portal/portal.js";
-import { ContextMenu as p } from "./context_menu/context_menu.js";
+import { Portal as o } from "./portal/portal.js";
+import { ContextMenu as t } from "./context_menu/context_menu.js";
 import { Menu as x, MenuItem as f } from "./menu/menu.js";
-import { Tooltip as u } from "./tooltip/tooltip.js";
-import { Popper as a } from "./popper/popper.js";
-import { Frame as P } from "./frame/frame.js";
+import { Frame as n } from "./frame/frame.js";
+import { ElementTethered as l } from "./tethered/element_tethered.js";
+import { Tethered as i } from "./tethered/tethered.js";
+import { Popper as M } from "./popper/legacy/popper.js";
+import { PopperDismissal as h } from "./popper/base/dismissal_decorator.js";
+import { PreviewPopper as E } from "./popper/preview_popper.js";
+import { ContextPopper as v } from "./popper/context_popper.js";
+import { ElementPopper as B } from "./popper/element_popper.js";
+import { BasePopper as F } from "./popper/base/base_popper.js";
 export {
-  p as ContextMenu,
-  P as Frame,
+  F as BasePopper,
+  t as ContextMenu,
+  v as ContextPopper,
+  B as ElementPopper,
+  l as ElementTethered,
+  n as Frame,
   x as Menu,
   f as MenuItem,
-  a as Popper,
-  e as Portal,
-  u as Tooltip
+  M as Popper,
+  h as PopperDismissal,
+  o as Portal,
+  E as PreviewPopper,
+  i as Tethered
 };
 //# sourceMappingURL=index.js.map

package/dist/overlay/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}

package/dist/overlay/menu/menu.d.ts

@@ -1,6 +1,6 @@
 import { HStackProps } from '../../stacks/h_stack.js';
 import { VStackProps } from '../../stacks/v_stack.js';
-import { PopperProps } from '../../overlay/popper/popper.js';
+import { PopperProps } from '../popper/legacy/popper.js';
 import { default as React } from 'react';
 export type MenuProps = Omit<PopperProps & VStackProps, 'children'> & {
     children?: React.ReactNode;

package/dist/overlay/menu/menu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../../src/overlay/menu/menu.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC1E,OAAO,KAA4C,MAAM,OAAO,CAAC;AAIjE,MAAM,MAAM,SAAS,GAAG,IAAI,CAAC,WAAW,GAAG,WAAW,EAAE,UAAU,CAAC,GAAG;IACpE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,eAAe,CAAC,EAAE,CAAC,aAAa,EAAE,OAAO,KAAK,IAAI,CAAC;IACnD,SAAS,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;CAC3B,CAAC;AAEF,eAAO,MAAM,IAAI;eALJ,KAAK,CAAC,SAAS;sBACR,CAAC,aAAa,EAAE,OAAO,KAAK,IAAI;gBACtC,IAAI,GAAG,MAAM;wCAkGzB,CAAC;AAEH,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,WAAW,EAAE,UAAU,CAAC;IAClE,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,EAAE,CAAC;IAC/C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,SAAS,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IAC1B,cAAc,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAC;IAC7C,cAAc,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAC;IAC7C,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gBAAgB,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,KAAK,CAAC;IAC9C,gBAAgB,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,KAAK,CAAC;IAC9C,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED,eAAO,MAAM,QAAQ,sFA0InB,CAAC"}
+{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../../src/overlay/menu/menu.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,4BAA4B,CAAC;AACtE,OAAO,KAA4C,MAAM,OAAO,CAAC;AAIjE,MAAM,MAAM,SAAS,GAAG,IAAI,CAAC,WAAW,GAAG,WAAW,EAAE,UAAU,CAAC,GAAG;IACpE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,eAAe,CAAC,EAAE,CAAC,aAAa,EAAE,OAAO,KAAK,IAAI,CAAC;IACnD,SAAS,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;CAC3B,CAAC;AAEF,eAAO,MAAM,IAAI;eALJ,KAAK,CAAC,SAAS;sBACR,CAAC,aAAa,EAAE,OAAO,KAAK,IAAI;gBACtC,IAAI,GAAG,MAAM;wCAkGzB,CAAC;AAEH,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,WAAW,EAAE,UAAU,CAAC;IAClE,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,EAAE,CAAC;IAC/C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,SAAS,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IAC1B,cAAc,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAC;IAC7C,cAAc,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAC;IAC7C,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gBAAgB,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,KAAK,CAAC;IAC9C,gBAAgB,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,KAAK,CAAC;IAC9C,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED,eAAO,MAAM,QAAQ,sFA0InB,CAAC"}

package/dist/overlay/menu/menu.js

@@ -1,34 +1,34 @@
 import { jsx as g, jsxs as W, Fragment as q } from "react/jsx-runtime";
 import { BodyText as O } from "../../typography/body_text/body_text.js";
-import "../../utils/focus_redirect.js";
 import "../../utils/click_away_listener.js";
+import "../../utils/focus_redirect.js";
 import "../../utils/scroll_away_listener.js";
-import f, { useState as F, useLayoutEffect as _, useRef as M } from "react";
+import f, { useState as F, useLayoutEffect as V, useRef as M } from "react";
 import { useForkRef as T } from "../../utils/hooks/use_fork_ref.js";
 import "../../utils/hooks/use_resize_observer.js";
 import { HStack as G } from "../../stacks/h_stack.js";
 import { VStack as J } from "../../stacks/v_stack.js";
-import { Popper as K } from "../popper/popper.js";
+import { Popper as K } from "../popper/legacy/popper.js";
 import { clsx as L } from "clsx";
 import '../../menu.css';const Q = "_menu_9ce21e3", U = "_menu-item_68b387f", j = { menu: Q, "menu-item": U }, Z = f.forwardRef(function({
   anchorElement: R,
-  verticalAnchor: y,
+  verticalAnchor: d,
   verticalOrigin: S,
   verticalOffset: i,
   horizontalAnchor: C,
   horizontalOrigin: X,
   horizontalOffset: h,
-  direction: m,
-  open: d,
+  direction: l,
+  open: y,
   onClose: x,
   restoreFocus: Y,
   veil: s,
   onActivatedMenu: c,
-  children: b = [],
+  children: _ = [],
   className: E,
-  ...I
-}, z) {
-  const [P, r] = F(-1), l = f.Children.toArray(b).map((t, a) => {
+  ...b
+}, I) {
+  const [z, r] = F(-1), m = f.Children.toArray(_).map((t, a) => {
     if (!f.isValidElement(t))
       return t;
     if (t.type !== D)
@@ -41,13 +41,13 @@ import '../../menu.css';const Q = "_menu_9ce21e3", U = "_menu-item_68b387f", j =
     const k = {
       ...t.props,
       key: a,
-      verticalAnchor: m === "up" ? "bottom" : "top",
-      verticalOrigin: m === "up" ? "bottom" : "top",
+      verticalAnchor: l === "up" ? "bottom" : "top",
+      verticalOrigin: l === "up" ? "bottom" : "top",
       verticalOffset: i,
       horizontalAnchor: "end",
       horizontalOrigin: "start",
       horizontalOffset: h,
-      direction: m,
+      direction: l,
       onClick: (e) => {
         t.props.children == null && x && x(), t.props.onClick && t.props.onClick(e);
       },
@@ -55,53 +55,53 @@ import '../../menu.css';const Q = "_menu_9ce21e3", U = "_menu-item_68b387f", j =
         r(a), c && c(!0), t.props.onMouseEnter && t.props.onMouseEnter(e);
       }
     };
-    return t.type === D && (k.open = P === a), f.cloneElement(t, k);
+    return t.type === D && (k.open = z === a), f.cloneElement(t, k);
   });
-  return m === "up" && l.reverse(), _(() => {
-    d || (r(-1), c && c(!1));
-  }, [d, c]), /* @__PURE__ */ g(
+  return l === "up" && m.reverse(), V(() => {
+    y || (r(-1), c && c(!1));
+  }, [y, c]), /* @__PURE__ */ g(
     K,
     {
       anchorElement: R,
-      verticalAnchor: y,
+      verticalAnchor: d,
       verticalOrigin: S,
       verticalOffset: i,
       horizontalAnchor: C || "end",
       horizontalOrigin: X || "end",
       horizontalOffset: h,
-      open: d,
+      open: y,
       onClose: x,
       restoreFocus: Y,
       veil: s,
-      children: /* @__PURE__ */ g(J, { ref: z, className: L(j.menu, E, "menu"), ...I, children: l })
+      children: /* @__PURE__ */ g(J, { ref: I, className: L(j.menu, E, "menu"), ...b, children: m })
     }
   );
 }), D = f.forwardRef(function({
   selected: R,
-  label: y,
+  label: d,
   className: S,
   children: i,
   direction: C = "down",
   verticalAnchor: X = "top",
   verticalOrigin: h = "top",
-  verticalOffset: m,
-  horizontalAnchor: d = "end",
+  verticalOffset: l,
+  horizontalAnchor: y = "end",
   horizontalOrigin: x = "start",
   horizontalOffset: Y,
   open: s = !1,
   ...c
-}, b) {
-  const E = M(!1), I = M({ x: -1, y: -1 }), z = M({ x: -1, y: -1 }), [P, r] = F(!1), l = M(null), t = T(b, l), a = i != null && i.length > 0;
+}, _) {
+  const E = M(!1), b = M({ x: -1, y: -1 }), I = M({ x: -1, y: -1 }), [z, r] = F(!1), m = M(null), t = T(_, m), a = i != null && i.length > 0;
   function k() {
     r(!1);
   }
-  return _(() => {
-    const e = l.current;
+  return V(() => {
+    const e = m.current;
     if (e && a && s) {
-      const u = window.getComputedStyle(e).direction, o = I.current, p = z.current, B = (n) => {
+      const u = window.getComputedStyle(e).direction, o = b.current, p = I.current, B = (n) => {
         o.x === -1 && (o.x = n.clientX, o.y = n.clientY);
-        const V = n.clientX - o.x, w = n.clientY - o.y;
-        if (p.x = Math.max(Math.abs(V), 1e-3), p.y = Math.max(Math.abs(w), 1e-3), (V < 0 || u === "down" && w < 0 || u === "up" && w > 0) && u === "ltr" || (V > 0 || u === "down" && w < 0 || u === "up" && w > 0) && u === "rtl") {
+        const P = n.clientX - o.x, w = n.clientY - o.y;
+        if (p.x = Math.max(Math.abs(P), 1e-3), p.y = Math.max(Math.abs(w), 1e-3), (P < 0 || u === "down" && w < 0 || u === "up" && w > 0) && u === "ltr" || (P > 0 || u === "down" && w < 0 || u === "up" && w > 0) && u === "rtl") {
           o.x = n.clientX, o.y = n.clientY, r(!1);
           return;
         }
@@ -119,7 +119,7 @@ import '../../menu.css';const Q = "_menu_9ce21e3", U = "_menu-item_68b387f", j =
         window.removeEventListener("mousemove", B);
       };
     }
-  }, [a, s]), _(() => {
+  }, [a, s]), V(() => {
     r(s);
   }, [s]), /* @__PURE__ */ W(q, { children: [
     /* @__PURE__ */ g(
@@ -132,21 +132,21 @@ import '../../menu.css';const Q = "_menu_9ce21e3", U = "_menu-item_68b387f", j =
         className: L(S, j["menu-item"], "menu-item"),
         "data-is-open": s,
         ...c,
-        children: typeof y == "string" ? /* @__PURE__ */ g(O, { color: "inherit", children: y }) : y
+        children: typeof d == "string" ? /* @__PURE__ */ g(O, { color: "inherit", children: d }) : d
       }
     ),
     i && /* @__PURE__ */ g(
       Z,
       {
-        anchorElement: l.current,
-        veil: P,
+        anchorElement: m.current,
+        veil: z,
         onClose: k,
         open: s,
         direction: C,
         verticalAnchor: X,
         verticalOrigin: h,
-        verticalOffset: m,
-        horizontalAnchor: d,
+        verticalOffset: l,
+        horizontalAnchor: y,
         horizontalOrigin: x,
         horizontalOffset: Y,
         hAlign: "start",

package/dist/overlay/menu/menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu.js","sources":["../../../src/overlay/menu/menu.tsx"],"sourcesContent":["import { BodyText } from '../../typography/body_text/body_text.js';\nimport { useForkRef } from '../../utils/index.js';\nimport { HStack } from '../../stacks/h_stack.js';\nimport { VStack } from '../../stacks/v_stack.js';\nimport type { HStackProps } from '../../stacks/h_stack.js';\nimport type { VStackProps } from '../../stacks/v_stack.js';\nimport { Popper, type PopperProps } from '../../overlay/popper/popper.js';\nimport React, { useLayoutEffect, useRef, useState } from 'react';\nimport styles from './menu.module.css';\nimport { clsx } from 'clsx';\n\nexport type MenuProps = Omit<PopperProps & VStackProps, 'children'> & {\n  children?: React.ReactNode;\n  onActivatedMenu?: (hasActiveMenu: boolean) => void;\n  direction?: 'up' | 'down';\n};\n\nexport const Menu = React.forwardRef(function Menu(\n  {\n    anchorElement,\n    verticalAnchor,\n    verticalOrigin,\n    verticalOffset,\n    horizontalAnchor,\n    horizontalOrigin,\n    horizontalOffset,\n    direction,\n    open,\n    onClose,\n    restoreFocus,\n    veil,\n    onActivatedMenu,\n    children = [],\n    className,\n    ...props\n  }: MenuProps,\n  ref: React.Ref<HTMLDivElement>\n) {\n  const [focusedIndex, setFocusedIndex] = useState(-1);\n  const clonedChildren = React.Children.toArray(children).map((child, index) => {\n    if (!React.isValidElement(child)) {\n      return child;\n    }\n\n    if (child.type !== MenuItem) {\n      return React.cloneElement(child, {\n        ...child.props,\n        onClick: (e: React.MouseEvent<HTMLElement>) => {\n          e.stopPropagation();\n          child.props.onClick && child.props.onClick(e);\n        },\n      });\n    }\n\n    const props = {\n      ...child.props,\n      key: index,\n      verticalAnchor: direction === 'up' ? 'bottom' : 'top',\n      verticalOrigin: direction === 'up' ? 'bottom' : 'top',\n      verticalOffset,\n      horizontalAnchor: 'end',\n      horizontalOrigin: 'start',\n      horizontalOffset,\n      direction,\n      onClick: (e: React.MouseEvent<HTMLDivElement>) => {\n        if (child.props.children == null) {\n          onClose && onClose();\n        }\n        child.props.onClick && child.props.onClick(e);\n      },\n      onMouseEnter: (e: React.MouseEvent<HTMLDivElement>) => {\n        setFocusedIndex(index);\n        onActivatedMenu && onActivatedMenu(true);\n        child.props.onMouseEnter && child.props.onMouseEnter(e);\n      },\n    };\n\n    if (child.type === MenuItem) {\n      props.open = focusedIndex === index;\n    }\n\n    return React.cloneElement(child, props);\n  });\n\n  direction === 'up' && clonedChildren.reverse();\n\n  useLayoutEffect(() => {\n    if (!open) {\n      setFocusedIndex(-1);\n      onActivatedMenu && onActivatedMenu(false);\n    }\n  }, [open, onActivatedMenu]);\n\n  return (\n    <Popper\n      anchorElement={anchorElement}\n      verticalAnchor={verticalAnchor}\n      verticalOrigin={verticalOrigin}\n      verticalOffset={verticalOffset}\n      horizontalAnchor={horizontalAnchor || 'end'}\n      horizontalOrigin={horizontalOrigin || 'end'}\n      horizontalOffset={horizontalOffset}\n      open={open}\n      onClose={onClose}\n      restoreFocus={restoreFocus}\n      veil={veil}\n    >\n      <VStack ref={ref} className={clsx(styles.menu, className, 'menu')} {...props}>\n        {clonedChildren}\n      </VStack>\n    </Popper>\n  );\n});\n\nexport interface MenuItemProps extends Omit<HStackProps, 'children'> {\n  open?: boolean;\n  children?: React.ReactElement<MenuItemProps>[];\n  selected?: boolean;\n  label?: React.ReactNode;\n  direction?: 'up' | 'down';\n  verticalAnchor?: 'top' | 'center' | 'bottom';\n  verticalOrigin?: 'top' | 'center' | 'bottom';\n  verticalOffset?: number;\n  horizontalAnchor?: 'center' | 'start' | 'end';\n  horizontalOrigin?: 'center' | 'start' | 'end';\n  horizontalOffset?: number;\n}\n\nexport const MenuItem = React.forwardRef(function MenuItem(\n  {\n    selected,\n    label,\n    className,\n    children,\n    direction = 'down',\n    verticalAnchor = 'top',\n    verticalOrigin = 'top',\n    verticalOffset,\n    horizontalAnchor = 'end',\n    horizontalOrigin = 'start',\n    horizontalOffset,\n    open = false,\n    ...props\n  }: MenuItemProps,\n  ref: React.Ref<HTMLDivElement>\n) {\n  const hasEnteredMenuRef = useRef(false);\n  const cursorPositionRef = useRef({ x: -1, y: -1 });\n  const cursorDeltaRef = useRef({ x: -1, y: -1 });\n  const [showVeil, setShowVeil] = useState(false);\n  const itemRef = useRef<HTMLElement | null>(null);\n  const forkedRef = useForkRef(ref, itemRef);\n  const hasSubmenu = children != null && children.length > 0;\n\n  function close() {\n    setShowVeil(false);\n  }\n\n  useLayoutEffect(() => {\n    const itemElement = itemRef.current;\n\n    if (itemElement && hasSubmenu && open) {\n      const direction = window.getComputedStyle(itemElement).direction;\n\n      const startPosition = cursorPositionRef.current;\n      const delta = cursorDeltaRef.current;\n\n      const calculateSlope = (event: MouseEvent) => {\n        if (startPosition.x === -1) {\n          startPosition.x = event.clientX;\n          startPosition.y = event.clientY;\n        }\n\n        const deltaX = event.clientX - startPosition.x;\n        const deltaY = event.clientY - startPosition.y;\n        delta.x = Math.max(Math.abs(deltaX), 0.001);\n        delta.y = Math.max(Math.abs(deltaY), 0.001);\n\n        const isSlopeWrongDirection =\n          ((deltaX < 0 ||\n            (direction === 'down' && deltaY < 0) ||\n            (direction === 'up' && deltaY > 0)) &&\n            direction === 'ltr') ||\n          ((deltaX > 0 ||\n            (direction === 'down' && deltaY < 0) ||\n            (direction === 'up' && deltaY > 0)) &&\n            direction === 'rtl');\n\n        if (isSlopeWrongDirection) {\n          startPosition.x = event.clientX;\n          startPosition.y = event.clientY;\n          setShowVeil(false);\n          return;\n        }\n\n        const distance = Math.sqrt(delta.x ** 2 + delta.y ** 2);\n\n        if (hasEnteredMenuRef.current) {\n          startPosition.x = event.clientX;\n          startPosition.y = event.clientY;\n          setShowVeil(false);\n          return;\n        }\n\n        if (distance > 5) {\n          const movingHorizontal = delta.x / delta.y > 0.2;\n\n          if (movingHorizontal) {\n            setShowVeil(true);\n          } else {\n            setShowVeil(false);\n          }\n\n          startPosition.x = event.clientX;\n          startPosition.y = event.clientY;\n        }\n      };\n\n      window.addEventListener('mousemove', calculateSlope);\n\n      return () => {\n        window.removeEventListener('mousemove', calculateSlope);\n      };\n    }\n  }, [hasSubmenu, open]);\n\n  useLayoutEffect(() => {\n    setShowVeil(open);\n  }, [open]);\n\n  return (\n    <>\n      <HStack\n        as=\"button\"\n        ref={forkedRef}\n        data-is-selected={Boolean(selected)}\n        data-has-children={Boolean(hasSubmenu)}\n        className={clsx(className, styles['menu-item'], 'menu-item')}\n        data-is-open={open}\n        {...props}\n      >\n        {typeof label === 'string' ? <BodyText color=\"inherit\">{label}</BodyText> : label}\n      </HStack>\n      {children && (\n        <Menu\n          anchorElement={itemRef.current}\n          veil={showVeil}\n          onClose={close}\n          open={open}\n          direction={direction}\n          verticalAnchor={verticalAnchor}\n          verticalOrigin={verticalOrigin}\n          verticalOffset={verticalOffset}\n          horizontalAnchor={horizontalAnchor}\n          horizontalOrigin={horizontalOrigin}\n          horizontalOffset={horizontalOffset}\n          hAlign=\"start\"\n          onActivatedMenu={hasActiveMenu => {\n            hasEnteredMenuRef.current = hasActiveMenu;\n          }}\n        >\n          {children}\n        </Menu>\n      )}\n    </>\n  );\n});\n"],"names":["Menu","React","anchorElement","verticalAnchor","verticalOrigin","verticalOffset","horizontalAnchor","horizontalOrigin","horizontalOffset","direction","open","onClose","restoreFocus","veil","onActivatedMenu","children","className","props","ref","focusedIndex","setFocusedIndex","useState","clonedChildren","child","index","MenuItem","useLayoutEffect","jsx","Popper","VStack","clsx","styles","selected","label","hasEnteredMenuRef","useRef","cursorPositionRef","cursorDeltaRef","showVeil","setShowVeil","itemRef","forkedRef","useForkRef","hasSubmenu","close","itemElement","startPosition","delta","calculateSlope","event","deltaX","deltaY","distance","movingHorizontal","jsxs","Fragment","HStack","BodyText","hasActiveMenu"],"mappings":"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"}
+{"version":3,"file":"menu.js","sources":["../../../src/overlay/menu/menu.tsx"],"sourcesContent":["import { BodyText } from '../../typography/body_text/body_text.js';\nimport { useForkRef } from '../../utils/index.js';\nimport { HStack } from '../../stacks/h_stack.js';\nimport { VStack } from '../../stacks/v_stack.js';\nimport type { HStackProps } from '../../stacks/h_stack.js';\nimport type { VStackProps } from '../../stacks/v_stack.js';\nimport { Popper, type PopperProps } from '../popper/legacy/popper.js';\nimport React, { useLayoutEffect, useRef, useState } from 'react';\nimport styles from './menu.module.css';\nimport { clsx } from 'clsx';\n\nexport type MenuProps = Omit<PopperProps & VStackProps, 'children'> & {\n  children?: React.ReactNode;\n  onActivatedMenu?: (hasActiveMenu: boolean) => void;\n  direction?: 'up' | 'down';\n};\n\nexport const Menu = React.forwardRef(function Menu(\n  {\n    anchorElement,\n    verticalAnchor,\n    verticalOrigin,\n    verticalOffset,\n    horizontalAnchor,\n    horizontalOrigin,\n    horizontalOffset,\n    direction,\n    open,\n    onClose,\n    restoreFocus,\n    veil,\n    onActivatedMenu,\n    children = [],\n    className,\n    ...props\n  }: MenuProps,\n  ref: React.Ref<HTMLDivElement>\n) {\n  const [focusedIndex, setFocusedIndex] = useState(-1);\n  const clonedChildren = React.Children.toArray(children).map((child, index) => {\n    if (!React.isValidElement(child)) {\n      return child;\n    }\n\n    if (child.type !== MenuItem) {\n      return React.cloneElement(child, {\n        ...child.props,\n        onClick: (e: React.MouseEvent<HTMLElement>) => {\n          e.stopPropagation();\n          child.props.onClick && child.props.onClick(e);\n        },\n      });\n    }\n\n    const props = {\n      ...child.props,\n      key: index,\n      verticalAnchor: direction === 'up' ? 'bottom' : 'top',\n      verticalOrigin: direction === 'up' ? 'bottom' : 'top',\n      verticalOffset,\n      horizontalAnchor: 'end',\n      horizontalOrigin: 'start',\n      horizontalOffset,\n      direction,\n      onClick: (e: React.MouseEvent<HTMLDivElement>) => {\n        if (child.props.children == null) {\n          onClose && onClose();\n        }\n        child.props.onClick && child.props.onClick(e);\n      },\n      onMouseEnter: (e: React.MouseEvent<HTMLDivElement>) => {\n        setFocusedIndex(index);\n        onActivatedMenu && onActivatedMenu(true);\n        child.props.onMouseEnter && child.props.onMouseEnter(e);\n      },\n    };\n\n    if (child.type === MenuItem) {\n      props.open = focusedIndex === index;\n    }\n\n    return React.cloneElement(child, props);\n  });\n\n  direction === 'up' && clonedChildren.reverse();\n\n  useLayoutEffect(() => {\n    if (!open) {\n      setFocusedIndex(-1);\n      onActivatedMenu && onActivatedMenu(false);\n    }\n  }, [open, onActivatedMenu]);\n\n  return (\n    <Popper\n      anchorElement={anchorElement}\n      verticalAnchor={verticalAnchor}\n      verticalOrigin={verticalOrigin}\n      verticalOffset={verticalOffset}\n      horizontalAnchor={horizontalAnchor || 'end'}\n      horizontalOrigin={horizontalOrigin || 'end'}\n      horizontalOffset={horizontalOffset}\n      open={open}\n      onClose={onClose}\n      restoreFocus={restoreFocus}\n      veil={veil}\n    >\n      <VStack ref={ref} className={clsx(styles.menu, className, 'menu')} {...props}>\n        {clonedChildren}\n      </VStack>\n    </Popper>\n  );\n});\n\nexport interface MenuItemProps extends Omit<HStackProps, 'children'> {\n  open?: boolean;\n  children?: React.ReactElement<MenuItemProps>[];\n  selected?: boolean;\n  label?: React.ReactNode;\n  direction?: 'up' | 'down';\n  verticalAnchor?: 'top' | 'center' | 'bottom';\n  verticalOrigin?: 'top' | 'center' | 'bottom';\n  verticalOffset?: number;\n  horizontalAnchor?: 'center' | 'start' | 'end';\n  horizontalOrigin?: 'center' | 'start' | 'end';\n  horizontalOffset?: number;\n}\n\nexport const MenuItem = React.forwardRef(function MenuItem(\n  {\n    selected,\n    label,\n    className,\n    children,\n    direction = 'down',\n    verticalAnchor = 'top',\n    verticalOrigin = 'top',\n    verticalOffset,\n    horizontalAnchor = 'end',\n    horizontalOrigin = 'start',\n    horizontalOffset,\n    open = false,\n    ...props\n  }: MenuItemProps,\n  ref: React.Ref<HTMLDivElement>\n) {\n  const hasEnteredMenuRef = useRef(false);\n  const cursorPositionRef = useRef({ x: -1, y: -1 });\n  const cursorDeltaRef = useRef({ x: -1, y: -1 });\n  const [showVeil, setShowVeil] = useState(false);\n  const itemRef = useRef<HTMLElement | null>(null);\n  const forkedRef = useForkRef(ref, itemRef);\n  const hasSubmenu = children != null && children.length > 0;\n\n  function close() {\n    setShowVeil(false);\n  }\n\n  useLayoutEffect(() => {\n    const itemElement = itemRef.current;\n\n    if (itemElement && hasSubmenu && open) {\n      const direction = window.getComputedStyle(itemElement).direction;\n\n      const startPosition = cursorPositionRef.current;\n      const delta = cursorDeltaRef.current;\n\n      const calculateSlope = (event: MouseEvent) => {\n        if (startPosition.x === -1) {\n          startPosition.x = event.clientX;\n          startPosition.y = event.clientY;\n        }\n\n        const deltaX = event.clientX - startPosition.x;\n        const deltaY = event.clientY - startPosition.y;\n        delta.x = Math.max(Math.abs(deltaX), 0.001);\n        delta.y = Math.max(Math.abs(deltaY), 0.001);\n\n        const isSlopeWrongDirection =\n          ((deltaX < 0 ||\n            (direction === 'down' && deltaY < 0) ||\n            (direction === 'up' && deltaY > 0)) &&\n            direction === 'ltr') ||\n          ((deltaX > 0 ||\n            (direction === 'down' && deltaY < 0) ||\n            (direction === 'up' && deltaY > 0)) &&\n            direction === 'rtl');\n\n        if (isSlopeWrongDirection) {\n          startPosition.x = event.clientX;\n          startPosition.y = event.clientY;\n          setShowVeil(false);\n          return;\n        }\n\n        const distance = Math.sqrt(delta.x ** 2 + delta.y ** 2);\n\n        if (hasEnteredMenuRef.current) {\n          startPosition.x = event.clientX;\n          startPosition.y = event.clientY;\n          setShowVeil(false);\n          return;\n        }\n\n        if (distance > 5) {\n          const movingHorizontal = delta.x / delta.y > 0.2;\n\n          if (movingHorizontal) {\n            setShowVeil(true);\n          } else {\n            setShowVeil(false);\n          }\n\n          startPosition.x = event.clientX;\n          startPosition.y = event.clientY;\n        }\n      };\n\n      window.addEventListener('mousemove', calculateSlope);\n\n      return () => {\n        window.removeEventListener('mousemove', calculateSlope);\n      };\n    }\n  }, [hasSubmenu, open]);\n\n  useLayoutEffect(() => {\n    setShowVeil(open);\n  }, [open]);\n\n  return (\n    <>\n      <HStack\n        as=\"button\"\n        ref={forkedRef}\n        data-is-selected={Boolean(selected)}\n        data-has-children={Boolean(hasSubmenu)}\n        className={clsx(className, styles['menu-item'], 'menu-item')}\n        data-is-open={open}\n        {...props}\n      >\n        {typeof label === 'string' ? <BodyText color=\"inherit\">{label}</BodyText> : label}\n      </HStack>\n      {children && (\n        <Menu\n          anchorElement={itemRef.current}\n          veil={showVeil}\n          onClose={close}\n          open={open}\n          direction={direction}\n          verticalAnchor={verticalAnchor}\n          verticalOrigin={verticalOrigin}\n          verticalOffset={verticalOffset}\n          horizontalAnchor={horizontalAnchor}\n          horizontalOrigin={horizontalOrigin}\n          horizontalOffset={horizontalOffset}\n          hAlign=\"start\"\n          onActivatedMenu={hasActiveMenu => {\n            hasEnteredMenuRef.current = hasActiveMenu;\n          }}\n        >\n          {children}\n        </Menu>\n      )}\n    </>\n  );\n});\n"],"names":["Menu","React","anchorElement","verticalAnchor","verticalOrigin","verticalOffset","horizontalAnchor","horizontalOrigin","horizontalOffset","direction","open","onClose","restoreFocus","veil","onActivatedMenu","children","className","props","ref","focusedIndex","setFocusedIndex","useState","clonedChildren","child","index","MenuItem","useLayoutEffect","jsx","Popper","VStack","clsx","styles","selected","label","hasEnteredMenuRef","useRef","cursorPositionRef","cursorDeltaRef","showVeil","setShowVeil","itemRef","forkedRef","useForkRef","hasSubmenu","close","itemElement","startPosition","delta","calculateSlope","event","deltaX","deltaY","distance","movingHorizontal","jsxs","Fragment","HStack","BodyText","hasActiveMenu"],"mappings":"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"}

package/dist/overlay/popper/base/base_popper.d.ts

@@ -0,0 +1,11 @@
+import { PropsWithChildren } from 'react';
+import { PopperDismissalDecoratorProps } from './dismissal_decorator.js';
+export interface BasePopperOwnProps {
+    open: boolean;
+    restoreFocus?: boolean;
+    veil?: boolean;
+}
+export interface BasePopperProps extends BasePopperOwnProps, PopperDismissalDecoratorProps {
+}
+export declare const BasePopper: React.FC<PropsWithChildren<BasePopperProps>>;
+//# sourceMappingURL=base_popper.d.ts.map

package/dist/overlay/popper/base/base_popper.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"base_popper.d.ts","sourceRoot":"","sources":["../../../../src/overlay/popper/base/base_popper.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE/C,OAAO,EAEL,KAAK,6BAA6B,EACnC,MAAM,0BAA0B,CAAC;AAElC,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,OAAO,CAAC;IACd,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,MAAM,WAAW,eACf,SAAQ,kBAAkB,EACxB,6BAA6B;CAAG;AAEpC,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAAC,eAAe,CAAC,CAqCnE,CAAC"}

package/dist/overlay/popper/base/base_popper.js

@@ -0,0 +1,27 @@
+import { jsx as i } from "react/jsx-runtime";
+import { useRestoreFocus as f } from "../hooks/use_restore_focus.js";
+import { PopperDismissalDecorator as u } from "./dismissal_decorator.js";
+const n = ({
+  restoreFocus: o = !1,
+  open: r,
+  onDismissal: e,
+  isException: s,
+  dismissals: t = [],
+  acceptedRefs: m,
+  // TODO: add veil
+  // veil = false,
+  children: p
+}) => (f(r, o), r ? /* @__PURE__ */ i(
+  u,
+  {
+    dismissals: t,
+    onDismissal: e,
+    isException: s,
+    acceptedRefs: m,
+    children: p
+  }
+) : null);
+export {
+  n as BasePopper
+};
+//# sourceMappingURL=base_popper.js.map

package/dist/overlay/popper/base/base_popper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"base_popper.js","sources":["../../../../src/overlay/popper/base/base_popper.tsx"],"sourcesContent":["import { type PropsWithChildren } from 'react';\nimport { useRestoreFocus } from '../hooks/use_restore_focus.js';\nimport {\n  PopperDismissalDecorator,\n  type PopperDismissalDecoratorProps,\n} from './dismissal_decorator.js';\n\nexport interface BasePopperOwnProps {\n  open: boolean;\n  restoreFocus?: boolean;\n  veil?: boolean;\n}\n\nexport interface BasePopperProps\n  extends BasePopperOwnProps,\n    PopperDismissalDecoratorProps {}\n\nexport const BasePopper: React.FC<PropsWithChildren<BasePopperProps>> = ({\n  restoreFocus = false,\n  open,\n  onDismissal,\n  isException,\n  dismissals = [],\n  acceptedRefs,\n  // TODO: add veil\n  // veil = false,\n  children,\n}) => {\n  useRestoreFocus(open, restoreFocus);\n\n  if (!open) return null;\n\n  // if (veil) {\n  //   content = (\n  //     <div\n  //     // TODO: add ref and onClick\n  //     // ref={veilRef}\n  //     // onClick={e => veilRef.current === e.target && onVeilClick && onVeilClick(e)}\n  //     >\n  //       {content}\n  //     </div>\n  //   );\n  // }\n\n  return (\n    <PopperDismissalDecorator\n      dismissals={dismissals}\n      onDismissal={onDismissal}\n      isException={isException}\n      acceptedRefs={acceptedRefs}\n    >\n      {children}\n    </PopperDismissalDecorator>\n  );\n};\n"],"names":["BasePopper","restoreFocus","open","onDismissal","isException","dismissals","acceptedRefs","children","useRestoreFocus","jsx","PopperDismissalDecorator"],"mappings":";;;AAiBO,MAAMA,IAA2D,CAAC;AAAA,EACvE,cAAAC,IAAe;AAAA,EACf,MAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,YAAAC,IAAa,CAAA;AAAA,EACb,cAAAC;AAAA;AAAA;AAAA,EAGA,UAAAC;AACF,OACEC,EAAgBN,GAAMD,CAAY,GAE7BC,IAeH,gBAAAO;AAAA,EAACC;AAAA,EAAA;AAAA,IACC,YAAAL;AAAA,IACA,aAAAF;AAAA,IACA,aAAAC;AAAA,IACA,cAAAE;AAAA,IAEC,UAAAC;AAAA,EAAA;AAAA,IArBa;"}

package/dist/overlay/popper/base/dismissal_decorator.d.ts

@@ -0,0 +1,16 @@
+export declare enum PopperDismissal {
+    CLICK_AWAY = "clickAway",
+    SCROLL_AWAY = "scrollAway",
+    MOUSE_LEAVE = "mouseLeave",
+    VEIL_CLICK = "veilClick"
+}
+export interface PopperDismissalDecoratorProps {
+    dismissals?: PopperDismissal[];
+    onDismissal?: (dismissal: PopperDismissal) => void;
+    isException?: (dismissal: PopperDismissal, target: HTMLElement) => boolean;
+    acceptedRefs?: React.RefObject<HTMLElement>[];
+}
+export declare const PopperDismissalDecorator: import('react').ForwardRefExoticComponent<PopperDismissalDecoratorProps & {
+    children?: import('react').ReactNode | undefined;
+} & import('react').RefAttributes<HTMLElement>>;
+//# sourceMappingURL=dismissal_decorator.d.ts.map

package/dist/overlay/popper/base/dismissal_decorator.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dismissal_decorator.d.ts","sourceRoot":"","sources":["../../../../src/overlay/popper/base/dismissal_decorator.tsx"],"names":[],"mappings":"AAKA,oBAAY,eAAe;IACzB,UAAU,cAAc;IACxB,WAAW,eAAe;IAC1B,WAAW,eAAe;IAC1B,UAAU,cAAc;CACzB;AAED,MAAM,WAAW,6BAA6B;IAC5C,UAAU,CAAC,EAAE,eAAe,EAAE,CAAC;IAC/B,WAAW,CAAC,EAAE,CAAC,SAAS,EAAE,eAAe,KAAK,IAAI,CAAC;IACnD,WAAW,CAAC,EAAE,CAAC,SAAS,EAAE,eAAe,EAAE,MAAM,EAAE,WAAW,KAAK,OAAO,CAAC;IAC3E,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,EAAE,CAAC;CAC/C;AAED,eAAO,MAAM,wBAAwB;;+CA4DnC,CAAC"}

package/dist/overlay/popper/base/dismissal_decorator.js

@@ -0,0 +1,69 @@
+import { jsxs as L, Fragment as m, jsx as l } from "react/jsx-runtime";
+import { forwardRef as C } from "react";
+import { ClickAwayListener as k } from "../../../utils/click_away_listener.js";
+import { ScrollAwayListener as v } from "../../../utils/scroll_away_listener.js";
+import { MouseLeaveRegion as E } from "../../../utils/mouse_leave_region.js";
+var d = /* @__PURE__ */ ((e) => (e.CLICK_AWAY = "clickAway", e.SCROLL_AWAY = "scrollAway", e.MOUSE_LEAVE = "mouseLeave", e.VEIL_CLICK = "veilClick", e))(d || {});
+const I = C(function({ onDismissal: a, isException: A, dismissals: r = [], children: s, acceptedRefs: i = [] }, h) {
+  const u = r.includes(
+    "clickAway"
+    /* CLICK_AWAY */
+  ), f = r.includes(
+    "scrollAway"
+    /* SCROLL_AWAY */
+  ), w = r.includes(
+    "mouseLeave"
+    /* MOUSE_LEAVE */
+  ), n = (c) => () => {
+    a?.(c);
+  };
+  function t(c) {
+    return c in r ? (y) => A?.(c, y) ?? !1 : () => !1;
+  }
+  let o = /* @__PURE__ */ L(m, { children: [
+    s,
+    w && /* @__PURE__ */ l(
+      E,
+      {
+        elementsRefs: i,
+        onMouseLeave: n(
+          "mouseLeave"
+          /* MOUSE_LEAVE */
+        )
+      }
+    )
+  ] });
+  return f && (o = /* @__PURE__ */ l(
+    v,
+    {
+      onScrollAway: n(
+        "scrollAway"
+        /* SCROLL_AWAY */
+      ),
+      isException: t(
+        "scrollAway"
+        /* SCROLL_AWAY */
+      ),
+      children: o
+    }
+  )), u && (o = /* @__PURE__ */ l(
+    k,
+    {
+      onClickAway: n(
+        "clickAway"
+        /* CLICK_AWAY */
+      ),
+      refs: i,
+      isException: t(
+        "clickAway"
+        /* CLICK_AWAY */
+      ),
+      children: o
+    }
+  )), o;
+});
+export {
+  d as PopperDismissal,
+  I as PopperDismissalDecorator
+};
+//# sourceMappingURL=dismissal_decorator.js.map

package/dist/overlay/popper/base/dismissal_decorator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dismissal_decorator.js","sources":["../../../../src/overlay/popper/base/dismissal_decorator.tsx"],"sourcesContent":["import { forwardRef, type PropsWithChildren } from 'react';\nimport { ClickAwayListener } from '../../../utils/click_away_listener.js';\nimport { ScrollAwayListener } from '../../../utils/scroll_away_listener.js';\nimport { MouseLeaveRegion } from '../../../utils/mouse_leave_region.js';\n\nexport enum PopperDismissal {\n  CLICK_AWAY = 'clickAway',\n  SCROLL_AWAY = 'scrollAway',\n  MOUSE_LEAVE = 'mouseLeave',\n  VEIL_CLICK = 'veilClick',\n}\n\nexport interface PopperDismissalDecoratorProps {\n  dismissals?: PopperDismissal[];\n  onDismissal?: (dismissal: PopperDismissal) => void;\n  isException?: (dismissal: PopperDismissal, target: HTMLElement) => boolean;\n  acceptedRefs?: React.RefObject<HTMLElement>[];\n}\n\nexport const PopperDismissalDecorator = forwardRef<\n  HTMLElement,\n  PropsWithChildren<PopperDismissalDecoratorProps>\n>(function DismissalDecorator(\n  { onDismissal, isException, dismissals = [], children, acceptedRefs = [] },\n  ref\n) {\n  const hasClickAway = dismissals.includes(PopperDismissal.CLICK_AWAY);\n  const hasScrollAway = dismissals.includes(PopperDismissal.SCROLL_AWAY);\n  const hasMouseLeave = dismissals.includes(PopperDismissal.MOUSE_LEAVE);\n  // TODO:\n  // const hasVeilClick = dismissals.includes(PopperDismissal.VEIL_CLICK);\n\n  const buildHandleDismissal = (dismissal: PopperDismissal) => () => {\n    onDismissal?.(dismissal);\n  };\n\n  function buildExceptionHandler(dismissal: PopperDismissal) {\n    if (dismissal in dismissals) {\n      return target => isException?.(dismissal, target) ?? false;\n    }\n    return () => false;\n  }\n\n  let content: React.ReactNode = (\n    <>\n      {children}\n      {hasMouseLeave && (\n        <MouseLeaveRegion\n          elementsRefs={acceptedRefs}\n          onMouseLeave={buildHandleDismissal(PopperDismissal.MOUSE_LEAVE)}\n        />\n      )}\n    </>\n  );\n\n  if (hasScrollAway) {\n    content = (\n      <ScrollAwayListener\n        onScrollAway={buildHandleDismissal(PopperDismissal.SCROLL_AWAY)}\n        isException={buildExceptionHandler(PopperDismissal.SCROLL_AWAY)}\n      >\n        {content}\n      </ScrollAwayListener>\n    );\n  }\n\n  if (hasClickAway) {\n    content = (\n      <ClickAwayListener\n        onClickAway={buildHandleDismissal(PopperDismissal.CLICK_AWAY)}\n        refs={acceptedRefs}\n        isException={buildExceptionHandler(PopperDismissal.CLICK_AWAY)}\n      >\n        {content}\n      </ClickAwayListener>\n    );\n  }\n\n  return content;\n});\n"],"names":["PopperDismissal","PopperDismissalDecorator","forwardRef","onDismissal","isException","dismissals","children","acceptedRefs","ref","hasClickAway","hasScrollAway","hasMouseLeave","buildHandleDismissal","dismissal","buildExceptionHandler","target","content","jsxs","Fragment","jsx","MouseLeaveRegion","ScrollAwayListener","ClickAwayListener"],"mappings":";;;;;AAKO,IAAKA,sBAAAA,OACVA,EAAA,aAAa,aACbA,EAAA,cAAc,cACdA,EAAA,cAAc,cACdA,EAAA,aAAa,aAJHA,IAAAA,KAAA,CAAA,CAAA;AAcL,MAAMC,IAA2BC,EAGtC,SACA,EAAE,aAAAC,GAAa,aAAAC,GAAa,YAAAC,IAAa,CAAA,GAAI,UAAAC,GAAU,cAAAC,IAAe,CAAA,EAAC,GACvEC,GACA;AACA,QAAMC,IAAeJ,EAAW;AAAA,IAAS;AAAA;AAAA,EAAA,GACnCK,IAAgBL,EAAW;AAAA,IAAS;AAAA;AAAA,EAAA,GACpCM,IAAgBN,EAAW;AAAA,IAAS;AAAA;AAAA,EAAA,GAIpCO,IAAuB,CAACC,MAA+B,MAAM;AACjE,IAAAV,IAAcU,CAAS;AAAA,EACzB;AAEA,WAASC,EAAsBD,GAA4B;AACzD,WAAIA,KAAaR,IACR,CAAAU,MAAUX,IAAcS,GAAWE,CAAM,KAAK,KAEhD,MAAM;AAAA,EACf;AAEA,MAAIC,IACF,gBAAAC,EAAAC,GAAA,EACG,UAAA;AAAA,IAAAZ;AAAA,IACAK,KACC,gBAAAQ;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,cAAcb;AAAA,QACd,cAAcK;AAAA,UAAqB;AAAA;AAAA,QAAA;AAAA,MAA2B;AAAA,IAAA;AAAA,EAChE,GAEJ;AAGF,SAAIF,MACFM,IACE,gBAAAG;AAAA,IAACE;AAAA,IAAA;AAAA,MACC,cAAcT;AAAA,QAAqB;AAAA;AAAA,MAAA;AAAA,MACnC,aAAaE;AAAA,QAAsB;AAAA;AAAA,MAAA;AAAA,MAElC,UAAAE;AAAA,IAAA;AAAA,EAAA,IAKHP,MACFO,IACE,gBAAAG;AAAA,IAACG;AAAA,IAAA;AAAA,MACC,aAAaV;AAAA,QAAqB;AAAA;AAAA,MAAA;AAAA,MAClC,MAAML;AAAA,MACN,aAAaO;AAAA,QAAsB;AAAA;AAAA,MAAA;AAAA,MAElC,UAAAE;AAAA,IAAA;AAAA,EAAA,IAKAA;AACT,CAAC;"}

package/dist/overlay/popper/context_popper.d.ts

@@ -0,0 +1,11 @@
+import { BasePopperProps } from './base/base_popper.js';
+import { TetheredProps } from '../tethered/tethered.js';
+export type ContextPopperProps = Omit<BasePopperProps, 'open' | 'onDismissal'> & Omit<TetheredProps, 'anchor'> & {
+    anchorElement: React.RefObject<HTMLElement>;
+};
+export declare const ContextPopper: import('react').ForwardRefExoticComponent<Omit<BasePopperProps, "open" | "onDismissal"> & Omit<TetheredProps, "anchor"> & {
+    anchorElement: React.RefObject<HTMLElement>;
+} & {
+    children?: import('react').ReactNode | undefined;
+} & import('react').RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=context_popper.d.ts.map

package/dist/overlay/popper/context_popper.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"context_popper.d.ts","sourceRoot":"","sources":["../../../src/overlay/popper/context_popper.tsx"],"names":[],"mappings":"AACA,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,uBAAuB,CAAC;AACzE,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAIvE,MAAM,MAAM,kBAAkB,GAAG,IAAI,CAAC,eAAe,EAAE,MAAM,GAAG,aAAa,CAAC,GAC5E,IAAI,CAAC,aAAa,EAAE,QAAQ,CAAC,GAAG;IAC9B,aAAa,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;CAC7C,CAAC;AAEJ,eAAO,MAAM,aAAa;mBAHP,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC;;;kDAkC7C,CAAC"}