@oh-just-another/react-ui 0.60.0 → 0.62.0

package/dist/{link-drop-shape-menu.js → menus/link-drop-shape-menu.js}

@@ -2,8 +2,8 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
 import { useEffect, useReducer } from "react";
 import { createPortal } from "react-dom";
 import { defaultRegistry } from "@oh-just-another/templates";
-import { useDiagramOptional } from "./hooks.js";
-import { usePortalContainer } from "./portal-container.js";
+import { useDiagramOptional } from "../core/hooks.js";
+import { usePortalContainer } from "../core/portal-container.js";
 /**
  * Shape picker shown after a link is dropped on empty canvas. The
  * dropped link keeps a free end; picking a shape here creates it at the
@@ -48,14 +48,14 @@ export const LinkDropShapeMenu = () => {
     const sx = (menu.world.x - v.pan.x) * v.zoom + hostRect.left;
     const sy = (menu.world.y - v.pan.y) * v.zoom + hostRect.top;
     const templates = defaultRegistry.byCategory("basic");
-    return createPortal(_jsxs(_Fragment, { children: [_jsx("div", { className: "du-link-drop-backdrop", style: { position: "fixed", inset: 0, zIndex: 1600 }, onPointerDown: () => {
+    return createPortal(_jsxs(_Fragment, { children: [_jsx("div", { className: "du-link-drop-backdrop", style: { position: "fixed", inset: 0, zIndex: "var(--du-z-popover)" }, onPointerDown: () => {
                     editor.dismissLinkDropMenu();
                 } }), _jsx("div", { className: "du-link-drop-menu", role: "menu", "aria-label": "Create shape", style: {
                     position: "fixed",
                     left: sx,
                     top: sy,
                     transform: "translate(-50%, -100%)",
-                    zIndex: 1601,
+                    zIndex: "calc(var(--du-z-popover) + 1)",
                 }, onPointerDown: (e) => {
                     e.stopPropagation();
                 }, children: templates.map((t) => (_jsx("button", { type: "button", className: "du-link-drop-item", title: t.name, "aria-label": `Create ${t.name}`, onClick: () => {

package/dist/menus/link-drop-shape-menu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"link-drop-shape-menu.js","sourceRoot":"","sources":["../../src/menus/link-drop-shape-menu.tsx"],"names":[],"mappings":"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"}

package/dist/{main-menu.d.ts → menus/main-menu.d.ts}

@@ -5,10 +5,21 @@ export interface MainMenuProps {
     readonly trigger?: ReactNode;
     readonly className?: string;
     readonly style?: CSSProperties;
+    /** Accessible name + tooltip of the trigger button. Default `"Main menu"`. */
+    readonly ariaLabel?: string;
+    /** Class / style for the trigger button (default: flat icon button). */
+    readonly triggerClassName?: string;
+    readonly triggerStyle?: CSSProperties;
+    /**
+     * Where the panel opens relative to the trigger. `"bottom-start"`
+     * (default) hangs below, left-aligned; `"top-end"` rises above,
+     * right-aligned — for menus in a bottom bar.
+     */
+    readonly placement?: "bottom-start" | "top-end";
 }
 export declare const MainMenu: {
-    ({ children, trigger, className, style, }: MainMenuProps): import("react/jsx-runtime").JSX.Element;
-    Item: ({ children, onClick, shortcut, disabled, active, icon }: MainMenuItemProps) => import("react/jsx-runtime").JSX.Element;
+    ({ children, trigger, className, style, ariaLabel, triggerClassName, triggerStyle, placement, }: MainMenuProps): import("react/jsx-runtime").JSX.Element;
+    Item: ({ children, onClick, shortcut, disabled, active, icon, trailing, checked, keepOpen, }: MainMenuItemProps) => import("react/jsx-runtime").JSX.Element;
     ItemLink: ({ children, href, external }: MainMenuItemLinkProps) => import("react/jsx-runtime").JSX.Element;
     Separator: () => import("react/jsx-runtime").JSX.Element;
     Group: ({ title, children }: {
@@ -35,6 +46,20 @@ export interface MainMenuItemProps {
      * aligned across mixed icon / no-icon items.
      */
     readonly icon?: ReactNode;
+    /** Trailing content on the right (non-interactive); rendered instead of `shortcut`. */
+    readonly trailing?: ReactNode;
+    /**
+     * On/off setting row: renders as `menuitemcheckbox` with a trailing
+     * switch that mirrors `checked`. The row itself is the control —
+     * `onClick` toggles the value — so the switch is decorative (nested
+     * buttons are invalid HTML). Implies `keepOpen`.
+     */
+    readonly checked?: boolean;
+    /**
+     * Keep the menu open after a click — for checkbox-style items (export
+     * content switches, etc.) where the user toggles several in a row.
+     */
+    readonly keepOpen?: boolean;
 }
 export interface MainMenuItemLinkProps {
     readonly children: ReactNode;
@@ -56,6 +81,24 @@ interface MainMenuToggleProps<T extends string> {
         icon?: ReactNode;
     }[];
 }
+/**
+ * Nested submenu — opens a child panel to the right of the parent item
+ * on hover (with a small close-delay so a mouse moving diagonally toward
+ * the child doesn't accidentally collapse the panel). Also opens on
+ * click for touch / keyboard activation.
+ *
+ * Children are typically `MainMenu.Item`s. The submenu inherits the
+ * parent menu's `close()` context, so child item clicks collapse the
+ * whole menu chain.
+ *
+ *   <MainMenu.Submenu icon={<Download/>} label="Export…">
+ *     <MainMenu.Item onClick={exportPng}>PNG</MainMenu.Item>
+ *     <MainMenu.Item onClick={exportSvg}>SVG</MainMenu.Item>
+ *   </MainMenu.Submenu>
+ *
+ * Positioning is fixed to "right of trigger, top-aligned with the
+ * trigger row".
+ */
 export interface MainMenuSubmenuProps {
     readonly children: ReactNode;
     /** Trigger row label. Same render style as `MainMenu.Item`. */

package/dist/menus/main-menu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"main-menu.d.ts","sourceRoot":"","sources":["../../src/menus/main-menu.tsx"],"names":[],"mappings":"AAAA,OAAO,EAUL,KAAK,aAAa,EAClB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AA0Hf,MAAM,WAAW,aAAa;IAC5B,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAC;IAC7B,wDAAwD;IACxD,QAAQ,CAAC,OAAO,CAAC,EAAE,SAAS,CAAC;IAC7B,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,KAAK,CAAC,EAAE,aAAa,CAAC;IAC/B,8EAA8E;IAC9E,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B,wEAAwE;IACxE,QAAQ,CAAC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IACnC,QAAQ,CAAC,YAAY,CAAC,EAAE,aAAa,CAAC;IACtC;;;;OAIG;IACH,QAAQ,CAAC,SAAS,CAAC,EAAE,cAAc,GAAG,SAAS,CAAC;CACjD;AAED,eAAO,MAAM,QAAQ;qGASlB,aAAa;kGAoKb,iBAAiB;6CAqC4B,qBAAqB;;iCAsBjC;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,SAAS,CAAA;KAAE;aAmB1D,CAAC,SAAS,MAAM,gCAAgC,mBAAmB,CAAC,CAAC,CAAC;mDAiFhC,oBAAoB;CAnNzE,CAAC;AASF,MAAM,WAAW,iBAAiB;IAChC,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAC;IAC7B,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAC9B,QAAQ,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B;;;;OAIG;IACH,QAAQ,CAAC,MAAM,CAAC,EAAE,OAAO,CAAC;IAC1B;;;;OAIG;IACH,QAAQ,CAAC,IAAI,CAAC,EAAE,SAAS,CAAC;IAC1B,uFAAuF;IACvF,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAC9B;;;;;OAKG;IACH,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC;IAC3B;;;OAGG;IACH,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;CAC7B;AA2CD,MAAM,WAAW,qBAAqB;IACpC,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAC;IAC7B,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;CAC7B;AA+BD;;;;;GAKG;AACH,UAAU,mBAAmB,CAAC,CAAC,SAAS,MAAM;IAC5C,QAAQ,CAAC,KAAK,EAAE,CAAC,CAAC;IAClB,QAAQ,CAAC,QAAQ,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,CAAC;IACrC,QAAQ,CAAC,OAAO,EAAE,SAAS;QAAE,KAAK,EAAE,CAAC,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,SAAS,CAAA;KAAE,EAAE,CAAC;CAC5E;AAuDD;;;;;;;;;;;;;;;;;GAiBG;AAEH,MAAM,WAAW,oBAAoB;IACnC,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAC;IAC7B,+DAA+D;IAC/D,QAAQ,CAAC,KAAK,EAAE,SAAS,CAAC;IAC1B,oEAAoE;IACpE,QAAQ,CAAC,IAAI,CAAC,EAAE,SAAS,CAAC;IAC1B,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;CAC7B"}

package/dist/menus/main-menu.js

@@ -0,0 +1,260 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { createContext, useCallback, useContext, useEffect, useId, useLayoutEffect, useMemo, useRef, useState, } from "react";
+import { createPortal } from "react-dom";
+import { Check, ChevronRight, Menu as MenuIcon } from "lucide-react";
+import { Switch } from "../primitives/switch.js";
+import { floatPanel } from "../primitives/float-panel.js";
+import { cssPx } from "../primitives/css-var.js";
+import { usePortalContainer } from "../core/portal-container.js";
+import { MARK_ICON, MENU_VIEWPORT_PADDING_PX } from "../core/constants.js";
+/** Pixel size for the trigger icon — matches the toolbar tool buttons. */
+const TRIGGER_ICON_SIZE = 16;
+const TRIGGER_ICON_STROKE = 1.75;
+const Ctx = createContext(null);
+/**
+ * Every open panel of one menu (root + nested), portaled to the portal
+ * container so they stack above the UI layer (`--du-z-popover`) — the
+ * click-outside handler treats a press inside any of them as "inside".
+ */
+const PanelsCtx = createContext(null);
+const LevelCtx = createContext(null);
+const SUBMENU_CLOSE_DELAY_MS = 120;
+const MenuLevel = ({ children }) => {
+    const [openId, setOpenId] = useState(null);
+    const timer = useRef(null);
+    const cancelClose = useCallback(() => {
+        if (timer.current !== null) {
+            window.clearTimeout(timer.current);
+            timer.current = null;
+        }
+    }, []);
+    const closeSoon = useCallback(() => {
+        cancelClose();
+        timer.current = window.setTimeout(() => {
+            setOpenId(null);
+            timer.current = null;
+        }, SUBMENU_CLOSE_DELAY_MS);
+    }, [cancelClose]);
+    const scheduleClose = useCallback((id) => {
+        cancelClose();
+        timer.current = window.setTimeout(() => {
+            setOpenId((cur) => (cur === id ? null : cur));
+            timer.current = null;
+        }, SUBMENU_CLOSE_DELAY_MS);
+    }, [cancelClose]);
+    const open = useCallback((id) => {
+        cancelClose();
+        setOpenId(id);
+    }, [cancelClose]);
+    const toggle = useCallback((id) => {
+        cancelClose();
+        setOpenId((cur) => (cur === id ? null : id));
+    }, [cancelClose]);
+    useEffect(() => cancelClose, [cancelClose]);
+    const value = useMemo(() => ({ openId, open, toggle, scheduleClose, closeSoon, cancelClose }), [openId, open, toggle, scheduleClose, closeSoon, cancelClose]);
+    return _jsx(LevelCtx.Provider, { value: value, children: children });
+};
+const useMenuCtx = () => {
+    const ctx = useContext(Ctx);
+    return (ctx ?? {
+        close: () => {
+            /* no-op: fallback when used outside a MainMenu provider */
+        },
+    });
+};
+export const MainMenu = ({ children, trigger = _jsx(MenuIcon, { size: TRIGGER_ICON_SIZE, strokeWidth: TRIGGER_ICON_STROKE }), className, style, ariaLabel = "Main menu", triggerClassName, triggerStyle, placement = "bottom-start", }) => {
+    const [open, setOpen] = useState(false);
+    const ref = useRef(null);
+    const triggerRef = useRef(null);
+    const panelRef = useRef(null);
+    const panels = useRef(new Set()).current;
+    const portalContainer = usePortalContainer();
+    const menuId = useId();
+    // Float the panel off the trigger: clear the bar group's inset + border,
+    // then keep `--du-flyout-gap` between the bar and the panel; flip / shift
+    // inside the viewport like the context menu.
+    useLayoutEffect(() => {
+        const trigger = triggerRef.current;
+        const panel = panelRef.current;
+        if (!open || !trigger || !panel)
+            return undefined;
+        panels.add(panel);
+        const gap = cssPx(panel, "--du-pad-sm") + 1 + cssPx(panel, "--du-flyout-gap");
+        const stop = floatPanel(trigger, panel, {
+            placement,
+            gap,
+            padding: MENU_VIEWPORT_PADDING_PX,
+            strategy: "fixed",
+            clampHeight: true,
+        });
+        return () => {
+            stop();
+            panels.delete(panel);
+        };
+    }, [open, placement, panels]);
+    useEffect(() => {
+        if (!open)
+            return undefined;
+        const onDown = (ev) => {
+            const t = ev.target;
+            if (ref.current?.contains(t))
+                return;
+            for (const panel of panels)
+                if (panel.contains(t))
+                    return;
+            setOpen(false);
+        };
+        const onKey = (ev) => {
+            if (ev.key === "Escape")
+                setOpen(false);
+        };
+        // Listen on both `mousedown` and `pointerdown`. The canvas surface
+        // captures pointer events; `mousedown` still fires on the document,
+        // but for some touch / pen interactions only `pointerdown` does.
+        // Subscribing to both closes the menu reliably for every input type.
+        window.addEventListener("mousedown", onDown);
+        window.addEventListener("pointerdown", onDown);
+        window.addEventListener("keydown", onKey);
+        return () => {
+            window.removeEventListener("mousedown", onDown);
+            window.removeEventListener("pointerdown", onDown);
+            window.removeEventListener("keydown", onKey);
+        };
+    }, [open, panels]);
+    const close = useCallback(() => {
+        setOpen(false);
+    }, []);
+    const containerStyle = {
+        position: "relative",
+        display: "inline-flex",
+        ...style,
+    };
+    const panelStyle = {
+        position: "fixed",
+        top: 0,
+        left: 0,
+        zIndex: "var(--du-z-popover)",
+    };
+    return (_jsxs("div", { ref: ref, className: className, style: containerStyle, children: [_jsx("button", { ref: triggerRef, type: "button", className: `${triggerClassName ?? "du-icon-button du-icon-button-flat"}${open ? " is-active" : ""}`, style: triggerStyle, "aria-haspopup": "menu", "aria-expanded": open, "aria-controls": menuId, "aria-label": ariaLabel, title: ariaLabel, onClick: () => {
+                    setOpen((p) => !p);
+                }, children: trigger }), open
+                ? createPortal(_jsx("div", { ref: panelRef, id: menuId, role: "menu", "aria-label": ariaLabel, className: "du-menu-panel", style: panelStyle, children: _jsx(Ctx.Provider, { value: { close }, children: _jsx(PanelsCtx.Provider, { value: panels, children: _jsx(MenuLevel, { children: children }) }) }) }), portalContainer)
+                : null] }));
+};
+/** Gutter content: check mark when active, else the icon (or nothing). */
+const Gutter = ({ active, icon }) => (_jsx("span", { "aria-hidden": true, className: `du-menu-gutter${active ? " is-accent" : ""}`, children: active ? _jsx(Check, { ...MARK_ICON }) : (icon ?? "") }));
+const Item = ({ children, onClick, shortcut, disabled, active, icon, trailing, checked, keepOpen, }) => {
+    const { close } = useMenuCtx();
+    const level = useContext(LevelCtx);
+    const isCheckbox = checked !== undefined;
+    return (_jsxs("button", { type: "button", role: isCheckbox ? "menuitemcheckbox" : "menuitem", "aria-checked": isCheckbox ? checked : undefined, disabled: disabled, onClick: () => {
+            if (disabled)
+                return;
+            onClick?.();
+            if (!keepOpen && !isCheckbox)
+                close();
+        }, onMouseEnter: () => level?.closeSoon(), className: "du-menu-row", children: [_jsxs("span", { className: "du-menu-row-main", children: [_jsx(Gutter, { active: active === true, icon: icon }), children] }), isCheckbox ? (_jsx(Switch, { checked: checked, presentational: true })) : ((trailing ?? (shortcut ? _jsx("span", { className: "du-menu-shortcut", children: shortcut }) : null)))] }));
+};
+const ItemLink = ({ children, href, external }) => {
+    const { close } = useMenuCtx();
+    return (_jsx("a", { role: "menuitem", href: href, target: external ? "_blank" : undefined, rel: external ? "noreferrer noopener" : undefined, onClick: close, className: "du-menu-row", style: { textDecoration: "none" }, children: _jsxs("span", { className: "du-menu-row-main", children: [_jsx(Gutter, {}), children] }) }));
+};
+const Separator = () => _jsx("hr", { className: "du-menu-sep" });
+const Group = ({ title, children }) => (_jsxs("div", { children: [_jsx("div", { className: "du-menu-group-title", children: title }), children] }));
+const Toggle = ({ value, onChange, options }) => {
+    return (_jsx("div", { role: "radiogroup", style: {
+            display: "flex",
+            margin: "var(--du-menu-sep) var(--du-menu-row-pad-x)",
+            background: "var(--menu-divider, #2a2a2a)",
+            borderRadius: 6,
+            padding: 2,
+            gap: 2,
+        }, children: options.map((opt) => {
+            const active = opt.value === value;
+            return (_jsx("button", { type: "button", role: "radio", "aria-checked": active, title: opt.label, "aria-label": opt.label, onClick: () => {
+                    onChange(opt.value);
+                }, style: {
+                    flex: 1,
+                    display: "inline-flex",
+                    alignItems: "center",
+                    justifyContent: "center",
+                    gap: 4,
+                    minHeight: 26,
+                    padding: "0 8px",
+                    background: active ? "var(--menu-bg, #1a1a1a)" : "transparent",
+                    color: active ? "var(--text, #ddd)" : "var(--muted, #888)",
+                    border: "none",
+                    borderRadius: 4,
+                    cursor: "pointer",
+                    fontSize: 12,
+                    fontWeight: active ? 600 : 400,
+                    boxShadow: active ? "0 1px 2px rgba(0, 0, 0, 0.15)" : "none",
+                    transition: "background 0.12s ease, color 0.12s ease",
+                }, children: opt.icon ?? opt.label }, opt.value));
+        }) }));
+};
+const Submenu = ({ children, label, icon, disabled }) => {
+    const id = useId();
+    const level = useContext(LevelCtx);
+    const panels = useContext(PanelsCtx);
+    const portalContainer = usePortalContainer();
+    const open = level?.openId === id;
+    const rowRef = useRef(null);
+    const panelRef = useRef(null);
+    // Beside the row (left when the right side has no room), first child row
+    // aligned with this row: the cross-axis shift undoes the panel padding +
+    // border, the main-axis gap clears the parent column and adds
+    // `--du-submenu-gap`. Portaled like the root panel so it stacks above
+    // the UI layer and is never clipped by a scrolling parent.
+    useLayoutEffect(() => {
+        const row = rowRef.current;
+        const panel = panelRef.current;
+        if (!open || !row || !panel)
+            return undefined;
+        panels?.add(panel);
+        const align = cssPx(panel, "--du-menu-pad") + 1;
+        const stop = floatPanel(row, panel, {
+            placement: "right-start",
+            fallbackPlacements: ["left-start"],
+            gap: align + cssPx(panel, "--du-submenu-gap"),
+            crossAxis: -align,
+            padding: MENU_VIEWPORT_PADDING_PX,
+            strategy: "fixed",
+            clampHeight: true,
+        });
+        return () => {
+            stop();
+            panels?.delete(panel);
+        };
+    }, [open, panels]);
+    const panelStyle = {
+        position: "fixed",
+        top: 0,
+        left: 0,
+        zIndex: "calc(var(--du-z-popover) + 1)",
+    };
+    return (_jsxs(_Fragment, { children: [_jsxs("button", { ref: rowRef, type: "button", role: "menuitem", disabled: disabled, "aria-haspopup": "menu", "aria-expanded": open, onMouseEnter: () => {
+                    if (disabled)
+                        return;
+                    level?.open(id);
+                }, onMouseLeave: () => {
+                    level?.scheduleClose(id);
+                }, onClick: () => {
+                    if (disabled)
+                        return;
+                    level?.toggle(id);
+                }, className: `du-menu-row${open ? " is-open" : ""}`, children: [_jsxs("span", { className: "du-menu-row-main", children: [_jsx(Gutter, { icon: icon }), label] }), _jsx("span", { className: "du-menu-shortcut", children: _jsx(ChevronRight, { ...MARK_ICON, "aria-hidden": true }) })] }), open
+                ? createPortal(_jsx("div", { ref: panelRef, role: "menu", className: "du-menu-panel du-menu-submenu", style: panelStyle, onMouseEnter: () => {
+                        level.cancelClose();
+                    }, onMouseLeave: () => {
+                        level.scheduleClose(id);
+                    }, children: _jsx(MenuLevel, { children: children }) }), portalContainer)
+                : null] }));
+};
+MainMenu.Item = Item;
+MainMenu.ItemLink = ItemLink;
+MainMenu.Separator = Separator;
+MainMenu.Group = Group;
+MainMenu.Toggle = Toggle;
+MainMenu.Submenu = Submenu;
+//# sourceMappingURL=main-menu.js.map

package/dist/menus/main-menu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"main-menu.js","sourceRoot":"","sources":["../../src/menus/main-menu.tsx"],"names":[],"mappings":"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"}

package/dist/overlays/file-drop-overlay.d.ts

@@ -0,0 +1,15 @@
+export interface FileDropOverlayProps {
+    /** Show while an OS file drag hovers the canvas. */
+    readonly active: boolean;
+    /** Big label under the drop glyph. Default `"DROP"`. */
+    readonly label?: string;
+}
+/**
+ * Full-canvas hint shown while a file is dragged over the editor: a dashed
+ * frame and ONE card — a drop glyph with "DROP" on top, then a row per
+ * labelled file-drop handler (`editor.getFileDropHandlers()`) listing what
+ * the canvas accepts — images, video, whatever the host registered. Pointer-events
+ * none, so the drop still lands on the canvas handlers beneath.
+ */
+export declare const FileDropOverlay: ({ active, label }: FileDropOverlayProps) => import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=file-drop-overlay.d.ts.map

package/dist/overlays/file-drop-overlay.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-drop-overlay.d.ts","sourceRoot":"","sources":["../../src/overlays/file-drop-overlay.tsx"],"names":[],"mappings":"AAuBA,MAAM,WAAW,oBAAoB;IACnC,oDAAoD;IACpD,QAAQ,CAAC,MAAM,EAAE,OAAO,CAAC;IACzB,wDAAwD;IACxD,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;CACzB;AAED;;;;;;GAMG;AACH,eAAO,MAAM,eAAe,GAAI,mBAA4B,oBAAoB,mDAkC/E,CAAC"}

package/dist/overlays/file-drop-overlay.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Braces, Download, File, FileText, Image as ImageIcon, LayoutDashboard, Film, } from "lucide-react";
+import { useDiagramOptional } from "../core/hooks.js";
+import { CONTROL_ICON, DROP_OVERLAY_ICON_SIZE, ICON_STROKE } from "../core/constants.js";
+const KIND_ICON = {
+    image: _jsx(ImageIcon, { ...CONTROL_ICON, "aria-hidden": true }),
+    video: _jsx(Film, { ...CONTROL_ICON, "aria-hidden": true }),
+    scene: _jsx(LayoutDashboard, { ...CONTROL_ICON, "aria-hidden": true }),
+    text: _jsx(FileText, { ...CONTROL_ICON, "aria-hidden": true }),
+    data: _jsx(Braces, { ...CONTROL_ICON, "aria-hidden": true }),
+    file: _jsx(File, { ...CONTROL_ICON, "aria-hidden": true }),
+};
+/**
+ * Full-canvas hint shown while a file is dragged over the editor: a dashed
+ * frame and ONE card — a drop glyph with "DROP" on top, then a row per
+ * labelled file-drop handler (`editor.getFileDropHandlers()`) listing what
+ * the canvas accepts — images, video, whatever the host registered. Pointer-events
+ * none, so the drop still lands on the canvas handlers beneath.
+ */
+export const FileDropOverlay = ({ active, label = "DROP" }) => {
+    const editor = useDiagramOptional();
+    if (!active)
+        return null;
+    const handlers = (editor?.getFileDropHandlers() ?? []).filter((h) => h.label !== undefined);
+    return (_jsx("div", { className: "du-drop-overlay", role: "status", "aria-live": "polite", "aria-label": `${label}: drop a file`, children: _jsx("div", { className: "du-drop-overlay-frame", children: _jsxs("div", { className: "du-drop-overlay-card", children: [_jsxs("div", { className: "du-drop-overlay-center", children: [_jsx(Download, { size: DROP_OVERLAY_ICON_SIZE, strokeWidth: ICON_STROKE, "aria-hidden": true }), _jsx("span", { className: "du-drop-overlay-label", children: label })] }), handlers.length > 0 ? (_jsx("ul", { className: "du-drop-overlay-types", "aria-label": "Accepted files", children: handlers.map((h) => (_jsxs("li", { className: "du-drop-type", children: [KIND_ICON[h.kind ?? "file"], _jsx("span", { className: "du-drop-type-label", children: h.label }), h.formats && h.formats.length > 0 ? (_jsx("span", { className: "du-drop-type-formats", children: h.formats.join(" · ") })) : null] }, h.id))) })) : null] }) }) }));
+};
+//# sourceMappingURL=file-drop-overlay.js.map

package/dist/overlays/file-drop-overlay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-drop-overlay.js","sourceRoot":"","sources":["../../src/overlays/file-drop-overlay.tsx"],"names":[],"mappings":";AACA,OAAO,EACL,MAAM,EACN,QAAQ,EACR,IAAI,EACJ,QAAQ,EACR,KAAK,IAAI,SAAS,EAClB,eAAe,EACf,IAAI,GACL,MAAM,cAAc,CAAC;AAEtB,OAAO,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,EAAE,YAAY,EAAE,sBAAsB,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAEzF,MAAM,SAAS,GAAoC;IACjD,KAAK,EAAE,KAAC,SAAS,OAAK,YAAY,wBAAgB;IAClD,KAAK,EAAE,KAAC,IAAI,OAAK,YAAY,wBAAgB;IAC7C,KAAK,EAAE,KAAC,eAAe,OAAK,YAAY,wBAAgB;IACxD,IAAI,EAAE,KAAC,QAAQ,OAAK,YAAY,wBAAgB;IAChD,IAAI,EAAE,KAAC,MAAM,OAAK,YAAY,wBAAgB;IAC9C,IAAI,EAAE,KAAC,IAAI,OAAK,YAAY,wBAAgB;CAC7C,CAAC;AASF;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,EAAE,MAAM,EAAE,KAAK,GAAG,MAAM,EAAwB,EAAE,EAAE;IAClF,MAAM,MAAM,GAAG,kBAAkB,EAAE,CAAC;IACpC,IAAI,CAAC,MAAM;QAAE,OAAO,IAAI,CAAC;IACzB,MAAM,QAAQ,GAAG,CAAC,MAAM,EAAE,mBAAmB,EAAE,IAAI,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,KAAK,SAAS,CAAC,CAAC;IAC5F,OAAO,CACL,cACE,SAAS,EAAC,iBAAiB,EAC3B,IAAI,EAAC,QAAQ,eACH,QAAQ,gBACN,GAAG,KAAK,eAAe,YAEnC,cAAK,SAAS,EAAC,uBAAuB,YACpC,eAAK,SAAS,EAAC,sBAAsB,aACnC,eAAK,SAAS,EAAC,wBAAwB,aACrC,KAAC,QAAQ,IAAC,IAAI,EAAE,sBAAsB,EAAE,WAAW,EAAE,WAAW,wBAAgB,EAChF,eAAM,SAAS,EAAC,uBAAuB,YAAE,KAAK,GAAQ,IAClD,EACL,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CACrB,aAAI,SAAS,EAAC,uBAAuB,gBAAY,gBAAgB,YAC9D,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CACnB,cAAe,SAAS,EAAC,cAAc,aACpC,SAAS,CAAC,CAAC,CAAC,IAAI,IAAI,MAAM,CAAC,EAC5B,eAAM,SAAS,EAAC,oBAAoB,YAAE,CAAC,CAAC,KAAK,GAAQ,EACpD,CAAC,CAAC,OAAO,IAAI,CAAC,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CACnC,eAAM,SAAS,EAAC,sBAAsB,YAAE,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,GAAQ,CACtE,CAAC,CAAC,CAAC,IAAI,KALD,CAAC,CAAC,EAAE,CAMR,CACN,CAAC,GACC,CACN,CAAC,CAAC,CAAC,IAAI,IACJ,GACF,GACF,CACP,CAAC;AACJ,CAAC,CAAC"}

package/dist/overlays/frame-name-editor-overlay.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"frame-name-editor-overlay.d.ts","sourceRoot":"","sources":["../../src/overlays/frame-name-editor-overlay.tsx"],"names":[],"mappings":"AAUA;;;;;;;;;;GAUG;AACH,eAAO,MAAM,sBAAsB,sDAqFlC,CAAC"}

package/dist/{frame-name-editor-overlay.js → overlays/frame-name-editor-overlay.js}

@@ -1,7 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useEffect, useReducer, useRef } from "react";
 import { getElement, isFrame, FRAME_HEADER_HEIGHT, FRAME_HEADER_PADDING_X, FRAME_HEADER_FONT_SIZE, } from "@oh-just-another/scene";
-import { useDiagramOptional } from "./hooks.js";
+import { useDiagramOptional } from "../core/hooks.js";
 /**
  * Inline editor for a frame's header name. Unlike the in-canvas text
  * editor (invisible sink + canvas-drawn caret), the frame label has no

package/dist/overlays/frame-name-editor-overlay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"frame-name-editor-overlay.js","sourceRoot":"","sources":["../../src/overlays/frame-name-editor-overlay.tsx"],"names":[],"mappings":"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"}

package/dist/overlays/help-button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"help-button.d.ts","sourceRoot":"","sources":["../../src/overlays/help-button.tsx"],"names":[],"mappings":"AAMA;;;;;;;GAOG;AACH,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,YAAY,CAAC,EAAE,CAAC,GAAG,EAAE;QAAE,IAAI,EAAE,OAAO,CAAC;QAAC,OAAO,EAAE,MAAM,IAAI,CAAA;KAAE,KAAK,KAAK,CAAC,SAAS,CAAC;CAC1F;AAED,eAAO,MAAM,UAAU,GAAI,kBAAkB,eAAe,4CA6B3D,CAAC"}

package/dist/{help-button.js → overlays/help-button.js}

@@ -2,14 +2,13 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
 import { useState } from "react";
 import { HelpCircle } from "lucide-react";
 import { HelpDialog } from "./help-dialog.js";
-import { IconButton } from "./icon-button.js";
-const HELP_ICON_SIZE = 16;
-const HELP_ICON_STROKE = 1.75;
+import { IconButton } from "../primitives/icon-button.js";
+import { CONTROL_ICON } from "../core/constants.js";
 export const HelpButton = ({ renderDialog }) => {
     const [open, setOpen] = useState(false);
     return (_jsxs(_Fragment, { children: [_jsx(IconButton, { label: "Help", onClick: () => {
                     setOpen(true);
-                }, children: _jsx(HelpCircle, { size: HELP_ICON_SIZE, strokeWidth: HELP_ICON_STROKE }) }), renderDialog ? (renderDialog({
+                }, children: _jsx(HelpCircle, { ...CONTROL_ICON }) }), renderDialog ? (renderDialog({
                 open,
                 onClose: () => {
                     setOpen(false);

package/dist/overlays/help-button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"help-button.js","sourceRoot":"","sources":["../../src/overlays/help-button.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAC1D,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAcpD,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EAAE,YAAY,EAAmB,EAAE,EAAE;IAC9D,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACxC,OAAO,CACL,8BACE,KAAC,UAAU,IACT,KAAK,EAAC,MAAM,EACZ,OAAO,EAAE,GAAG,EAAE;oBACZ,OAAO,CAAC,IAAI,CAAC,CAAC;gBAChB,CAAC,YAED,KAAC,UAAU,OAAK,YAAY,GAAI,GACrB,EACZ,YAAY,CAAC,CAAC,CAAC,CACd,YAAY,CAAC;gBACX,IAAI;gBACJ,OAAO,EAAE,GAAG,EAAE;oBACZ,OAAO,CAAC,KAAK,CAAC,CAAC;gBACjB,CAAC;aACF,CAAC,CACH,CAAC,CAAC,CAAC,CACF,KAAC,UAAU,IACT,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,GAAG,EAAE;oBACZ,OAAO,CAAC,KAAK,CAAC,CAAC;gBACjB,CAAC,GACD,CACH,IACA,CACJ,CAAC;AACJ,CAAC,CAAC"}

package/dist/overlays/help-dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"help-dialog.d.ts","sourceRoot":"","sources":["../../src/overlays/help-dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAoD,KAAK,YAAY,EAAE,MAAM,OAAO,CAAC;AAE5F,OAAO,EAML,KAAK,cAAc,EAEpB,MAAM,wBAAwB,CAAC;AAIhC;;;;;;;;;;;;GAYG;AAEH,MAAM,WAAW,eAAe;IAC9B,wEAAwE;IACxE,QAAQ,CAAC,QAAQ,CAAC,EAAE,cAAc,CAAC;IACnC;;;OAGG;IACH,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAC;IACvB,QAAQ,CAAC,OAAO,EAAE,MAAM,IAAI,CAAC;IAC7B,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,aAAa,CAAC,EAAE,SAAS,WAAW,EAAE,CAAC;CACjD;AAED,MAAM,WAAW,WAAW;IAC1B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,IAAI,EAAE,SAAS,OAAO,EAAE,CAAC;CACnC;AAED;;;;GAIG;AACH,MAAM,WAAW,OAAO;IACtB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,IAAI,EAAE,SAAS,CAAC,SAAS,MAAM,EAAE,CAAC,EAAE,CAAC;CAC/C;AAiCD;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,mBAAmB,GAAI,MAAM,MAAM,IAAI,KAAG,IAetD,CAAC;AA0BF,eAAO,MAAM,UAAU,GAAI,oDAMxB,eAAe,KAAG,YAAY,GAAG,IAiEnC,CAAC"}

package/dist/{help-dialog.js → overlays/help-dialog.js}

@@ -2,8 +2,8 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment, useEffect, useMemo } from "react";
 import { X } from "lucide-react";
 import { defaultActionRegistry, formatHotkeyParts, isMac, } from "@oh-just-another/state";
-import { HELP_DIALOG_MAX_WIDTH_PX } from "./constants.js";
-import { Modal } from "./modal.js";
+import { HELP_DIALOG_MAX_WIDTH_PX, CONTROL_ICON } from "../core/constants.js";
+import { Modal } from "../primitives/modal.js";
 const CATEGORY_TITLES = {
     history: "History",
     selection: "Selection",
@@ -113,31 +113,11 @@ export const HelpDialog = ({ registry = defaultActionRegistry, open, onClose, ti
     }, [registry, extraSections]);
     const modalStyle = {
         maxWidth: HELP_DIALOG_MAX_WIDTH_PX,
-        width: "calc(100vw - 64px)",
+        width: "calc(100vw - 2 * var(--du-modal-margin))",
         display: "flex",
         flexDirection: "column",
     };
-    const headerStyle = {
-        padding: "16px 20px",
-        borderBottom: "1px solid var(--du-ui-border)",
-        display: "flex",
-        alignItems: "center",
-        justifyContent: "space-between",
-    };
-    const bodyStyle = {
-        padding: "16px 20px 20px",
-        overflowY: "auto",
-    };
-    return (_jsx(Modal, { open: open, onClose: onClose, title: title, style: modalStyle, children: _jsxs("div", { children: [_jsxs("div", { style: headerStyle, children: [_jsx("h2", { style: { margin: 0, fontSize: 16, fontWeight: 600 }, children: title }), _jsxs("div", { style: { display: "flex", alignItems: "center", gap: 12 }, children: [_jsx("span", { className: "du-help-platform-badge", children: isMac ? "macOS" : "Win / Linux" }), _jsx("button", { type: "button", "aria-label": "Close help", onClick: onClose, style: {
-                                        background: "transparent",
-                                        border: "none",
-                                        color: "var(--du-text)",
-                                        cursor: "pointer",
-                                        display: "inline-flex",
-                                        alignItems: "center",
-                                        justifyContent: "center",
-                                        padding: 4,
-                                    }, children: _jsx(X, { size: 18, strokeWidth: 1.75 }) })] })] }), _jsx("div", { style: bodyStyle, children: _jsx("div", { className: "du-help-islands", children: sections.map((section) => (_jsxs("section", { className: "du-help-island", children: [_jsx("h3", { className: "du-help-island-title", children: section.title }), _jsx("div", { className: "du-help-island-rows", children: section.rows.map((row) => (_jsxs("div", { className: "du-help-row", children: [_jsx("span", { className: "du-help-row-label", children: row.label }), _jsx(ShortcutKeys, { combos: row.keys })] }, row.label))) })] }, section.title))) }) })] }) }));
+    return (_jsx(Modal, { open: open, onClose: onClose, title: title, style: modalStyle, children: _jsxs("div", { children: [_jsxs("div", { className: "du-modal-header", children: [_jsx("h2", { className: "du-modal-title", children: title }), _jsxs("div", { style: { display: "flex", alignItems: "center", gap: "var(--du-modal-gap)" }, children: [_jsx("span", { className: "du-help-platform-badge", children: isMac ? "macOS" : "Win / Linux" }), _jsx("button", { type: "button", "aria-label": "Close help", onClick: onClose, className: "du-modal-close", children: _jsx(X, { ...CONTROL_ICON }) })] })] }), _jsx("div", { className: "du-modal-body", children: _jsx("div", { className: "du-help-islands", children: sections.map((section) => (_jsxs("section", { className: "du-help-island", children: [_jsx("h3", { className: "du-help-island-title", children: section.title }), _jsx("div", { className: "du-help-island-rows", children: section.rows.map((row) => (_jsxs("div", { className: "du-help-row", children: [_jsx("span", { className: "du-help-row-label", children: row.label }), _jsx(ShortcutKeys, { combos: row.keys })] }, row.label))) })] }, section.title))) }) })] }) }));
 };
 /**
  * Render N alternative key combinations joined with "or". Each key

package/dist/overlays/help-dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"help-dialog.js","sourceRoot":"","sources":["../../src/overlays/help-dialog.tsx"],"names":[],"mappings":"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"}

package/dist/overlays/link-badges.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Persistent link badges. Every element carrying a (safe) `href` shows a
+ * small chip anchored to its top-right corner, so links are discoverable
+ * without hovering — the hover popup and Cmd/Ctrl-click remain the detail /
+ * open affordances. Clicking the badge opens the link via `editor.openLink`
+ * (scheme already validated by `elementLink`). Also shown in read-only mode:
+ * following links is a viewing feature, not an edit.
+ *
+ * Positions are computed from world bounds + viewport on every editor
+ * change, so badges track pan / zoom / move. Portaled to the overlay
+ * container like the hover popup.
+ */
+export declare const LinkBadges: () => import("react").ReactPortal | null;
+//# sourceMappingURL=link-badges.d.ts.map

package/dist/overlays/link-badges.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"link-badges.d.ts","sourceRoot":"","sources":["../../src/overlays/link-badges.tsx"],"names":[],"mappings":"AASA;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,UAAU,0CAqDtB,CAAC"}