@enderfall/ui 0.1.0

package/dist/components/AccessGate.d.ts

@@ -0,0 +1,16 @@
+type AccessGateProps = {
+    status: "checking" | "locked" | "allowed";
+    titleChecking?: string;
+    titleLocked?: string;
+    messageChecking?: string;
+    messageLocked?: string;
+    primaryLabel: string;
+    secondaryLabel?: string;
+    onPrimary: () => void;
+    onSecondary?: () => void;
+    primaryClassName?: string;
+    secondaryClassName?: string;
+};
+export declare const AccessGate: ({ status, titleChecking, titleLocked, messageChecking, messageLocked, primaryLabel, secondaryLabel, onPrimary, onSecondary, primaryClassName, secondaryClassName, }: AccessGateProps) => import("react/jsx-runtime").JSX.Element | null;
+export {};
+//# sourceMappingURL=AccessGate.d.ts.map

package/dist/components/AccessGate.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccessGate.d.ts","sourceRoot":"","sources":["../../src/components/AccessGate.tsx"],"names":[],"mappings":"AAGA,KAAK,eAAe,GAAG;IACrB,MAAM,EAAE,UAAU,GAAG,QAAQ,GAAG,SAAS,CAAC;IAC1C,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,YAAY,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,qKAYxB,eAAe,mDA+BjB,CAAC"}

package/dist/components/AccessGate.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button } from "./Button";
+import { Panel } from "./Panel";
+export const AccessGate = ({ status, titleChecking = "Checking access...", titleLocked = "App locked", messageChecking = "Verifying your access with Enderfall Hub.", messageLocked = "Open Enderfall Hub to verify premium or admin access.", primaryLabel, secondaryLabel, onPrimary, onSecondary, primaryClassName = "primary", secondaryClassName = "ghost", }) => {
+    if (status === "allowed")
+        return null;
+    const isChecking = status === "checking";
+    return (_jsx("div", { className: "ef-access-overlay", children: _jsxs(Panel, { variant: "card", borderWidth: 2, className: "ef-access-card", children: [_jsx("div", { className: "ef-access-title", children: isChecking ? titleChecking : titleLocked }), _jsx("p", { children: isChecking ? messageChecking : messageLocked }), _jsxs("div", { className: "ef-access-actions", children: [_jsx(Button, { type: "button", className: primaryClassName, onClick: onPrimary, disabled: isChecking, children: primaryLabel }), secondaryLabel && onSecondary ? (_jsx(Button, { type: "button", className: secondaryClassName, onClick: onSecondary, disabled: isChecking, children: secondaryLabel })) : null] })] }) }));
+};

package/dist/components/Button.d.ts

@@ -0,0 +1,7 @@
+import type { ButtonHTMLAttributes } from "react";
+type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {
+    variant?: "primary" | "ghost" | "locked" | "danger" | "delete" | "warning" | "info" | "success";
+};
+export declare const Button: ({ variant, className, ...props }: ButtonProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=Button.d.ts.map

package/dist/components/Button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/components/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAElD,KAAK,WAAW,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,GAAG;IAC3D,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,QAAQ,GAAG,QAAQ,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,CAAC;CACjG,CAAC;AAEF,eAAO,MAAM,MAAM,GAAI,kCAA8C,WAAW,4CAK/E,CAAC"}

package/dist/components/Button.js

@@ -0,0 +1,2 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export const Button = ({ variant = "primary", className, ...props }) => (_jsx("button", { ...props, className: ["ef-button", variant, className].filter(Boolean).join(" ") }));

package/dist/components/Dropdown.d.ts

@@ -0,0 +1,88 @@
+import { type ReactNode } from "react";
+export type HeaderMenuItem = {
+    id: string;
+    label: string;
+    content: ReactNode;
+};
+export type DropdownUserItem = {
+    id?: string;
+    label: string;
+    onClick: () => void;
+    disabled?: boolean;
+    className?: string;
+    title?: string;
+    variant?: "default" | "theme-preview";
+};
+export type DropdownUserListItem = {
+    id?: string;
+    label: string;
+    onClick: () => void;
+    onEdit?: () => void;
+    onDelete?: () => void;
+    disabled?: boolean;
+    className?: string;
+    title?: string;
+    avatarUrl?: string | null;
+    avatarFallback?: string;
+    subtitle?: string;
+};
+export type DropdownBookmarkOption = {
+    value: string;
+    label: string;
+    meta?: unknown;
+    className?: string;
+};
+export type DropdownBookmarkSection = {
+    label?: string;
+    options: DropdownBookmarkOption[];
+};
+type HeaderVariantProps = {
+    variant: "header";
+    menus: HeaderMenuItem[];
+    menuOpen: string | null;
+    onOpenMenu: (id: string) => void;
+    onCloseMenu: () => void;
+};
+type UserVariantProps = {
+    variant: "user";
+    name: string;
+    avatarUrl?: string | null;
+    avatarUrlFallback?: string | null;
+    avatarAlt?: string;
+    avatarFallback?: string;
+    items: DropdownUserItem[];
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+};
+type UserListVariantProps = {
+    variant: "user-list";
+    name: string;
+    avatarUrl?: string | null;
+    avatarUrlFallback?: string | null;
+    avatarAlt?: string;
+    avatarFallback?: string;
+    items: DropdownUserListItem[];
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    emptyLabel?: string;
+    emptyClassName?: string;
+};
+type BookmarkVariantProps = {
+    variant: "bookmark";
+    label?: string;
+    layout?: "row" | "field";
+    value: string;
+    triggerLabel?: string;
+    placeholder?: string;
+    sections: DropdownBookmarkSection[];
+    onChange: (value: string, option?: DropdownBookmarkOption) => void;
+    renderTriggerIcon?: ReactNode;
+    renderItemIcon?: (option: DropdownBookmarkOption) => ReactNode;
+    caret?: ReactNode;
+    emptyLabel?: string;
+    emptyClassName?: string;
+};
+type DropdownProps = HeaderVariantProps | UserVariantProps | UserListVariantProps | BookmarkVariantProps;
+export declare const Dropdown: (props: DropdownProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=Dropdown.d.ts.map

package/dist/components/Dropdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dropdown.d.ts","sourceRoot":"","sources":["../../src/components/Dropdown.tsx"],"names":[],"mappings":"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"}

package/dist/components/Dropdown.js

@@ -0,0 +1,179 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useMemo, useRef, useState } from "react";
+import { Button } from "./Button";
+const DefaultChevron = ({ open }) => (_jsx("span", { className: `chevron ${open ? "open" : ""}`, "aria-hidden": "true", children: _jsx("svg", { viewBox: "0 0 24 24", children: _jsx("path", { d: "M6 9l6 6 6-6", fill: "none", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round", strokeLinejoin: "round" }) }) }));
+const DefaultCaret = () => (_jsx("svg", { viewBox: "0 0 24 24", "aria-hidden": "true", children: _jsx("path", { d: "M6 9l6 6 6-6", fill: "none", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round", strokeLinejoin: "round" }) }));
+const IconEdit = () => (_jsxs("svg", { viewBox: "0 0 24 24", "aria-hidden": "true", children: [_jsx("path", { d: "M4 20l4.5-1 9.4-9.4a1.8 1.8 0 0 0 0-2.6l-1-1a1.8 1.8 0 0 0-2.6 0L4.9 15.4 4 20z", fill: "none", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M13.5 6.5l4 4", fill: "none", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round", strokeLinejoin: "round" })] }));
+const IconTrash = () => (_jsxs("svg", { viewBox: "0 0 24 24", "aria-hidden": "true", children: [_jsx("path", { d: "M4 7h16", fill: "none", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M9 7V5a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2", fill: "none", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M7 7l1 12a1 1 0 0 0 1 .9h6a1 1 0 0 0 1-.9l1-12", fill: "none", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round", strokeLinejoin: "round" })] }));
+export const Dropdown = (props) => {
+    const closeTimerRef = useRef(null);
+    const closeDelayMs = 160;
+    useEffect(() => {
+        return () => {
+            if (closeTimerRef.current !== null) {
+                window.clearTimeout(closeTimerRef.current);
+            }
+        };
+    }, []);
+    const cancelScheduledClose = () => {
+        if (closeTimerRef.current !== null) {
+            window.clearTimeout(closeTimerRef.current);
+            closeTimerRef.current = null;
+        }
+    };
+    if (props.variant === "header") {
+        const scheduleClose = () => {
+            cancelScheduledClose();
+            closeTimerRef.current = window.setTimeout(() => {
+                props.onCloseMenu();
+            }, closeDelayMs);
+        };
+        return (_jsx("div", { className: "ef-menu-bar", children: props.menus.map((menu) => (_jsxs("div", { className: "ef-menu-group", onMouseEnter: () => {
+                    cancelScheduledClose();
+                    props.onOpenMenu(menu.id);
+                }, onMouseLeave: scheduleClose, children: [_jsx("button", { className: "ef-menu-button", type: "button", children: menu.label }), props.menuOpen === menu.id ? (_jsx("div", { className: "ef-menu-popover", "data-open": "true", onMouseEnter: () => {
+                            cancelScheduledClose();
+                            props.onOpenMenu(menu.id);
+                        }, onMouseLeave: scheduleClose, children: menu.content })) : null] }, menu.id))) }));
+    }
+    if (props.variant === "user" || props.variant === "user-list") {
+        const [internalOpen, setInternalOpen] = useState(false);
+        const [avatarState, setAvatarState] = useState("primary");
+        const ref = useRef(null);
+        const isOpen = props.open ?? internalOpen;
+        useEffect(() => {
+            setAvatarState("primary");
+        }, [props.avatarUrl, props.avatarUrlFallback]);
+        useEffect(() => {
+            if (!isOpen)
+                return;
+            const handlePointer = (event) => {
+                if (!ref.current)
+                    return;
+                if (ref.current.contains(event.target))
+                    return;
+                if (props.open === undefined) {
+                    setInternalOpen(false);
+                }
+                props.onOpenChange?.(false);
+            };
+            window.addEventListener("pointerdown", handlePointer);
+            return () => window.removeEventListener("pointerdown", handlePointer);
+        }, [isOpen, props.open, props.onOpenChange]);
+        const setOpen = (next) => {
+            if (props.open === undefined) {
+                setInternalOpen(next);
+            }
+            props.onOpenChange?.(next);
+        };
+        const fallback = props.avatarFallback ?? props.name.slice(0, 1).toUpperCase();
+        const primaryAvatar = props.avatarUrl ?? null;
+        const fallbackAvatar = props.avatarUrlFallback ?? null;
+        const currentAvatar = avatarState === "primary"
+            ? primaryAvatar
+            : avatarState === "fallback"
+                ? fallbackAvatar
+                : null;
+        const renderUserListItems = () => {
+            if (props.variant !== "user-list") {
+                return props.items.map((item, index) => {
+                    const key = item.id ?? `${item.label}-${index}`;
+                    if (item.variant === "theme-preview") {
+                        return (_jsx(Button, { type: "button", variant: "primary", className: ["theme-preview", item.className].filter(Boolean).join(" "), onClick: () => {
+                                item.onClick();
+                                setOpen(false);
+                            }, disabled: item.disabled, title: item.title, children: item.label }, key));
+                    }
+                    return (_jsx("button", { className: ["dropdown-item", item.className].filter(Boolean).join(" "), type: "button", onClick: () => {
+                            item.onClick();
+                            setOpen(false);
+                        }, disabled: item.disabled, title: item.title, children: item.label }, key));
+                });
+            }
+            if (!props.items.length) {
+                return (_jsx("div", { className: ["dropdown-empty", props.emptyClassName].filter(Boolean).join(" "), children: props.emptyLabel ?? "No items." }));
+            }
+            return props.items.map((item, index) => {
+                const fallback = item.avatarFallback ?? item.label.slice(0, 1).toUpperCase();
+                const isDisabled = !!item.disabled;
+                return (_jsxs("div", { className: [
+                        "dropdown-item",
+                        "dropdown-item-rich",
+                        item.className,
+                        isDisabled ? "is-disabled" : "",
+                    ]
+                        .filter(Boolean)
+                        .join(" "), role: "button", tabIndex: isDisabled ? -1 : 0, "aria-disabled": isDisabled ? "true" : undefined, onClick: () => {
+                        if (isDisabled)
+                            return;
+                        item.onClick();
+                        setOpen(false);
+                    }, onKeyDown: (event) => {
+                        if (isDisabled)
+                            return;
+                        if (event.key === "Enter" || event.key === " ") {
+                            event.preventDefault();
+                            item.onClick();
+                            setOpen(false);
+                        }
+                    }, title: item.title, children: [_jsx("span", { className: "dropdown-avatar", children: item.avatarUrl ? (_jsx("img", { src: item.avatarUrl, alt: item.label, loading: "lazy", decoding: "async", referrerPolicy: "no-referrer", crossOrigin: "anonymous" })) : (_jsx("span", { className: "dropdown-avatar-fallback", children: fallback })) }), _jsxs("span", { className: "dropdown-item-text", children: [_jsx("span", { className: "dropdown-item-label", children: item.label }), item.subtitle ? (_jsx("span", { className: "dropdown-item-subtitle", children: item.subtitle })) : null] }), item.onEdit || item.onDelete ? (_jsxs("span", { className: "dropdown-item-actions", children: [item.onEdit ? (_jsx(Button, { type: "button", variant: "ghost", className: "dropdown-action", "aria-label": `Edit ${item.label}`, onClick: (event) => {
+                                        event.stopPropagation();
+                                        item.onEdit?.();
+                                        setOpen(false);
+                                    }, children: _jsx(IconEdit, {}) })) : null, item.onDelete ? (_jsx(Button, { type: "button", variant: "delete", className: "dropdown-action is-delete", "aria-label": `Delete ${item.label}`, onClick: (event) => {
+                                        event.stopPropagation();
+                                        item.onDelete?.();
+                                    }, children: _jsx(IconTrash, {}) })) : null] })) : null] }, item.id ?? `${item.label}-${index}`));
+            });
+        };
+        return (_jsxs("div", { className: "user-section", ref: ref, "data-open": isOpen ? "true" : "false", children: [_jsxs("button", { className: "user-button", onClick: () => setOpen(!isOpen), type: "button", children: [_jsx("span", { className: "avatar", children: currentAvatar ? (_jsx("img", { src: currentAvatar, alt: props.avatarAlt ?? props.name, loading: "eager", decoding: "async", referrerPolicy: "no-referrer", crossOrigin: "anonymous", onError: () => {
+                                    if (avatarState === "primary" && fallbackAvatar) {
+                                        setAvatarState("fallback");
+                                    }
+                                    else {
+                                        setAvatarState("none");
+                                    }
+                                } })) : (_jsx("span", { className: "avatar-fallback", children: fallback })) }), _jsx("span", { className: "user-name", children: props.name }), _jsx(DefaultChevron, { open: isOpen })] }), _jsx("div", { className: "dropdown", "data-open": isOpen ? "true" : "false", children: renderUserListItems() })] }));
+    }
+    const { label, layout = "row", value, placeholder = "Select a saved connection", sections, onChange, renderTriggerIcon, renderItemIcon, triggerLabel, caret, emptyLabel = "No saved connections.", emptyClassName, } = props;
+    const [open, setOpen] = useState(false);
+    const ref = useRef(null);
+    const options = useMemo(() => sections.flatMap((section) => section.options), [sections]);
+    const active = options.find((item) => item.value === value) ?? null;
+    useEffect(() => {
+        if (!open)
+            return;
+        const handlePointer = (event) => {
+            if (!ref.current)
+                return;
+            if (ref.current.contains(event.target))
+                return;
+            setOpen(false);
+        };
+        window.addEventListener("pointerdown", handlePointer);
+        return () => window.removeEventListener("pointerdown", handlePointer);
+    }, [open]);
+    const handleEllipsisTooltip = (event) => {
+        const target = event.currentTarget;
+        if (target.scrollWidth > target.clientWidth) {
+            target.setAttribute("title", target.textContent ?? "");
+        }
+        else {
+            target.removeAttribute("title");
+        }
+    };
+    const clearEllipsisTooltip = (event) => {
+        event.currentTarget.removeAttribute("title");
+    };
+    const dropdownBody = (_jsxs("div", { className: `bookmark-dropdown ${open ? "open" : ""}`, children: [_jsxs("button", { className: "bookmark-trigger", onClick: () => setOpen((prev) => !prev), type: "button", children: [renderTriggerIcon ? _jsx("span", { className: "bookmark-icon", children: renderTriggerIcon }) : null, _jsx("span", { className: "bookmark-text", children: triggerLabel ?? (active ? active.label : placeholder) }), _jsx("span", { className: "bookmark-caret", children: caret ?? _jsx(DefaultCaret, {}) })] }), open ? (_jsx("div", { className: "bookmark-menu", children: options.length === 0 ? (_jsx("div", { className: ["bookmark-empty", emptyClassName].filter(Boolean).join(" "), children: emptyLabel })) : (sections.map((section) => (_jsxs("div", { children: [section.label ? _jsx("div", { className: "bookmark-group", children: section.label }) : null, section.options.map((item) => (_jsxs("button", { className: [
+                                "bookmark-item",
+                                item.value === value ? "active" : "",
+                                item.className,
+                            ]
+                                .filter(Boolean)
+                                .join(" "), type: "button", onClick: () => {
+                                onChange(item.value, item);
+                                setOpen(false);
+                            }, children: [renderItemIcon ? (_jsx("span", { className: "bookmark-icon", children: renderItemIcon(item) })) : null, _jsx("span", { className: "bookmark-text", onMouseEnter: handleEllipsisTooltip, onMouseLeave: clearEllipsisTooltip, children: item.label })] }, item.value)))] }, section.label ?? "options")))) })) : null] }));
+    return (_jsxs("div", { className: layout === "row" ? "bookmark-row" : "bookmark-field", ref: ref, children: [layout === "row" && label ? _jsx("div", { className: "bookmark-label", children: label }) : null, dropdownBody] }));
+};

package/dist/components/FloatingFooter.d.ts

@@ -0,0 +1,10 @@
+import type { ReactNode } from "react";
+type FloatingFooterProps = {
+    title?: string;
+    subtitle?: string;
+    actions?: ReactNode;
+    className?: string;
+};
+export declare const FloatingFooter: ({ title, subtitle, actions, className, }: FloatingFooterProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=FloatingFooter.d.ts.map

package/dist/components/FloatingFooter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FloatingFooter.d.ts","sourceRoot":"","sources":["../../src/components/FloatingFooter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,KAAK,mBAAmB,GAAG;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,0CAK5B,mBAAmB,4CAWrB,CAAC"}

package/dist/components/FloatingFooter.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Panel } from "./Panel";
+export const FloatingFooter = ({ title = "Quick Actions", subtitle, actions, className, }) => {
+    const classes = ["ef-floating-footer", className].filter(Boolean).join(" ");
+    return (_jsxs(Panel, { variant: "full", borderWidth: 2, className: classes, children: [_jsxs("div", { className: "ef-footer-copy", children: [_jsx("div", { className: "ef-footer-title", children: title }), subtitle ? _jsx("div", { className: "ef-footer-subtitle", children: subtitle }) : null] }), _jsx("div", { className: "ef-footer-actions", children: actions })] }));
+};

package/dist/components/FormField.d.ts

@@ -0,0 +1,12 @@
+import type { ReactNode } from "react";
+type FormFieldProps = {
+    label: string;
+    htmlFor?: string;
+    helper?: string;
+    error?: string;
+    required?: boolean;
+    children: ReactNode;
+};
+export declare const FormField: ({ label, htmlFor, helper, error, required, children, }: FormFieldProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=FormField.d.ts.map

package/dist/components/FormField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormField.d.ts","sourceRoot":"","sources":["../../src/components/FormField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,KAAK,cAAc,GAAG;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,wDAOvB,cAAc,4CAUhB,CAAC"}

package/dist/components/FormField.js

@@ -0,0 +1,2 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const FormField = ({ label, htmlFor, helper, error, required, children, }) => (_jsxs("div", { className: ["ef-field", error ? "has-error" : ""].filter(Boolean).join(" "), children: [_jsxs("label", { className: "ef-field-label", htmlFor: htmlFor, children: [_jsx("span", { children: label }), required ? _jsx("span", { className: "ef-field-required", children: "*" }) : null] }), children, helper ? _jsx("div", { className: "ef-field-helper", children: helper }) : null, error ? _jsx("div", { className: "ef-field-error", children: error }) : null] }));

package/dist/components/Input.d.ts

@@ -0,0 +1,12 @@
+import type { InputHTMLAttributes, TextareaHTMLAttributes, SelectHTMLAttributes } from "react";
+type BaseProps = {
+    className?: string;
+};
+type InputProps = InputHTMLAttributes<HTMLInputElement> & BaseProps;
+type TextareaProps = TextareaHTMLAttributes<HTMLTextAreaElement> & BaseProps;
+type SelectProps = SelectHTMLAttributes<HTMLSelectElement> & BaseProps;
+export declare const Input: ({ className, ...props }: InputProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Textarea: ({ className, ...props }: TextareaProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Select: ({ className, ...props }: SelectProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=Input.d.ts.map

package/dist/components/Input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../src/components/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,sBAAsB,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAE/F,KAAK,SAAS,GAAG;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,KAAK,UAAU,GAAG,mBAAmB,CAAC,gBAAgB,CAAC,GAAG,SAAS,CAAC;AACpE,KAAK,aAAa,GAAG,sBAAsB,CAAC,mBAAmB,CAAC,GAAG,SAAS,CAAC;AAC7E,KAAK,WAAW,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,GAAG,SAAS,CAAC;AAIvE,eAAO,MAAM,KAAK,GAAI,yBAAyB,UAAU,4CAExD,CAAC;AAEF,eAAO,MAAM,QAAQ,GAAI,yBAAyB,aAAa,4CAE9D,CAAC;AAEF,eAAO,MAAM,MAAM,GAAI,yBAAyB,WAAW,4CAE1D,CAAC"}

package/dist/components/Input.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+const cx = (...classes) => classes.filter(Boolean).join(" ");
+export const Input = ({ className, ...props }) => (_jsx("input", { ...props, className: cx("ef-input", className) }));
+export const Textarea = ({ className, ...props }) => (_jsx("textarea", { ...props, className: cx("ef-textarea", className) }));
+export const Select = ({ className, ...props }) => (_jsx("select", { ...props, className: cx("ef-select", className) }));

package/dist/components/MainHeader.d.ts

@@ -0,0 +1,15 @@
+import type { ReactNode } from "react";
+import { type HeaderMenuItem } from "./Dropdown";
+type MainHeaderProps = {
+    title?: string;
+    subtitle?: string;
+    logoSrc?: string;
+    menus: HeaderMenuItem[];
+    menuOpen: string | null;
+    onOpenMenu: (id: string) => void;
+    onCloseMenu: () => void;
+    actions?: ReactNode;
+};
+export declare const MainHeader: ({ title, subtitle, logoSrc, menus, menuOpen, onOpenMenu, onCloseMenu, actions, }: MainHeaderProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=MainHeader.d.ts.map

package/dist/components/MainHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MainHeader.d.ts","sourceRoot":"","sources":["../../src/components/MainHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAY,KAAK,cAAc,EAAE,MAAM,YAAY,CAAC;AAG3D,KAAK,eAAe,GAAG;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,UAAU,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,kFASxB,eAAe,4CA0BjB,CAAC"}

package/dist/components/MainHeader.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Dropdown } from "./Dropdown";
+import { Panel } from "./Panel";
+export const MainHeader = ({ title = "Enderfall", subtitle = "Galaxy tools for creators", logoSrc, menus, menuOpen, onOpenMenu, onCloseMenu, actions, }) => {
+    return (_jsxs(Panel, { variant: "header", borderWidth: 2, className: "ef-main-header", children: [_jsxs("div", { className: "ef-header-left", children: [_jsxs("div", { className: "ef-brand", children: [logoSrc ? (_jsx("img", { src: logoSrc, alt: title, className: "ef-logo" })) : (_jsx("div", { className: "ef-logo-fallback", children: "E" })), _jsxs("div", { children: [_jsx("div", { className: "ef-brand-name", children: title }), subtitle ? _jsx("div", { className: "ef-tagline", children: subtitle }) : null] })] }), _jsx(Dropdown, { variant: "header", menus: menus, menuOpen: menuOpen, onOpenMenu: onOpenMenu, onCloseMenu: onCloseMenu })] }), _jsx("div", { className: "ef-header-actions", children: actions })] }));
+};

package/dist/components/Modal.d.ts

@@ -0,0 +1,16 @@
+import { type ReactNode } from "react";
+type ModalSize = "default" | "wide";
+type ModalProps = {
+    isOpen: boolean;
+    title: string;
+    subtitle?: string;
+    size?: ModalSize;
+    onClose: () => void;
+    actions?: ReactNode;
+    headerActions?: ReactNode;
+    className?: string;
+    children?: ReactNode;
+};
+export declare const Modal: ({ isOpen, title, subtitle, size, onClose, actions, headerActions, className, children, }: ModalProps) => import("react/jsx-runtime").JSX.Element | null;
+export {};
+//# sourceMappingURL=Modal.d.ts.map

package/dist/components/Modal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../src/components/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAmD,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGxF,KAAK,SAAS,GAAG,SAAS,GAAG,MAAM,CAAC;AAIpC,KAAK,UAAU,GAAG;IAChB,MAAM,EAAE,OAAO,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,KAAK,GAAI,0FAUnB,UAAU,mDAgHZ,CAAC"}

package/dist/components/Modal.js

@@ -0,0 +1,82 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from "react";
+import { Panel } from "./Panel";
+const MODAL_TRANSITION_MS = 240;
+export const Modal = ({ isOpen, title, subtitle, size = "default", onClose, actions, headerActions, className, children, }) => {
+    const reduceMotion = typeof document !== "undefined" && document.documentElement.getAttribute("data-reduce-motion") === "true";
+    const transitionMs = reduceMotion ? 0 : MODAL_TRANSITION_MS;
+    const [isRendered, setIsRendered] = useState(isOpen);
+    const [isEntering, setIsEntering] = useState(false);
+    const [isExiting, setIsExiting] = useState(false);
+    const [enterOffset, setEnterOffset] = useState({ x: 0, y: 0 });
+    const exitTimerRef = useRef(null);
+    const enterFrameRef = useRef(null);
+    useEffect(() => {
+        return () => {
+            if (exitTimerRef.current !== null)
+                window.clearTimeout(exitTimerRef.current);
+            if (enterFrameRef.current !== null)
+                window.cancelAnimationFrame(enterFrameRef.current);
+        };
+    }, []);
+    useEffect(() => {
+        if (isOpen) {
+            if (exitTimerRef.current !== null) {
+                window.clearTimeout(exitTimerRef.current);
+                exitTimerRef.current = null;
+            }
+            const activeElement = document.activeElement;
+            const activeRect = activeElement?.getBoundingClientRect();
+            const sourceX = activeRect ? activeRect.left + activeRect.width / 2 : window.innerWidth / 2;
+            const sourceY = activeRect ? activeRect.top + activeRect.height / 2 : window.innerHeight - 56;
+            const centerX = window.innerWidth / 2;
+            const centerY = window.innerHeight / 2;
+            setEnterOffset({
+                x: (sourceX - centerX) * 0.18,
+                y: (sourceY - centerY) * 0.22,
+            });
+            setIsRendered(true);
+            setIsExiting(false);
+            setIsEntering(!reduceMotion);
+            if (reduceMotion)
+                return;
+            if (enterFrameRef.current !== null)
+                window.cancelAnimationFrame(enterFrameRef.current);
+            enterFrameRef.current = window.requestAnimationFrame(() => {
+                enterFrameRef.current = window.requestAnimationFrame(() => {
+                    setIsEntering(false);
+                    enterFrameRef.current = null;
+                });
+            });
+            return;
+        }
+        if (!isRendered)
+            return;
+        if (reduceMotion) {
+            setIsEntering(false);
+            setIsExiting(false);
+            setIsRendered(false);
+            return;
+        }
+        setIsEntering(false);
+        setIsExiting(true);
+        if (exitTimerRef.current !== null)
+            window.clearTimeout(exitTimerRef.current);
+        exitTimerRef.current = window.setTimeout(() => {
+            setIsRendered(false);
+            setIsExiting(false);
+            exitTimerRef.current = null;
+        }, transitionMs);
+    }, [isOpen, isRendered, reduceMotion, transitionMs]);
+    if (!isRendered)
+        return null;
+    const sizeClass = size === "wide" ? "ef-modal--wide" : "";
+    const modalStateClass = isExiting ? "is-exiting" : isEntering ? "is-entering" : "is-open";
+    const backdropClasses = ["ef-modal-backdrop", modalStateClass].filter(Boolean).join(" ");
+    const classes = ["ef-modal", sizeClass, modalStateClass, className].filter(Boolean).join(" ");
+    const modalStyle = {
+        "--ef-modal-enter-x": `${enterOffset.x}px`,
+        "--ef-modal-enter-y": `${enterOffset.y}px`,
+    };
+    return (_jsx("div", { className: backdropClasses, onClick: onClose, children: _jsxs(Panel, { variant: "card", borderWidth: 2, className: classes, style: modalStyle, onClick: (event) => event.stopPropagation(), children: [_jsxs("div", { className: "ef-modal-header", children: [_jsx("div", { className: "ef-modal-title", children: title }), _jsxs("div", { className: "ef-modal-header-actions", children: [headerActions, _jsx("button", { className: "icon-action small ef-modal-close", onClick: onClose, type: "button", "aria-label": "Close", children: "\u00D7" })] })] }), subtitle ? _jsx("div", { className: "ef-modal-subtitle", children: subtitle }) : null, children ? _jsx("div", { className: "ef-modal-body", children: children }) : null, actions ? _jsx("div", { className: "ef-modal-actions", children: actions }) : null] }) }));
+};

package/dist/components/Panel.d.ts

@@ -0,0 +1,9 @@
+import { type HTMLAttributes } from "react";
+type PanelVariant = "card" | "highlight" | "full" | "header";
+type BorderWidth = 1 | 2;
+export declare const Panel: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
+    variant?: PanelVariant;
+    borderWidth?: BorderWidth;
+} & import("react").RefAttributes<HTMLDivElement>>;
+export {};
+//# sourceMappingURL=Panel.d.ts.map

package/dist/components/Panel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Panel.d.ts","sourceRoot":"","sources":["../../src/components/Panel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAExD,KAAK,YAAY,GAAG,MAAM,GAAG,WAAW,GAAG,MAAM,GAAG,QAAQ,CAAC;AAC7D,KAAK,WAAW,GAAG,CAAC,GAAG,CAAC,CAAC;AAOzB,eAAO,MAAM,KAAK;cAJN,YAAY;kBACR,WAAW;kDAqB1B,CAAC"}

package/dist/components/Panel.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+export const Panel = forwardRef(({ variant = "card", borderWidth = 1, className, children, ...rest }, ref) => {
+    const variantClass = variant === "highlight"
+        ? "ef-panel--highlight"
+        : variant === "header"
+            ? "ef-panel--header"
+            : variant === "full"
+                ? "ef-panel--full"
+                : "ef-panel--card";
+    const borderClass = borderWidth === 2 ? "ef-panel--border-2" : "ef-panel--border-1";
+    const classes = ["ef-panel", variantClass, borderClass, className].filter(Boolean).join(" ");
+    return (_jsx("div", { ref: ref, className: classes, ...rest, children: children }));
+});
+Panel.displayName = "Panel";

package/dist/components/PreferencesModal.d.ts

@@ -0,0 +1,19 @@
+import type { ReactNode } from "react";
+type ThemeOption = {
+    value: string;
+    label: string;
+};
+type PreferencesModalProps = {
+    isOpen: boolean;
+    onClose: () => void;
+    themeMode: string;
+    onThemeChange: (value: string) => void;
+    themeOptions: ThemeOption[];
+    animationsEnabled: boolean;
+    onAnimationsChange: (enabled: boolean) => void;
+    note?: string;
+    children?: ReactNode;
+};
+export declare const PreferencesModal: ({ isOpen, onClose, themeMode, onThemeChange, themeOptions, animationsEnabled, onAnimationsChange, note, children, }: PreferencesModalProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=PreferencesModal.d.ts.map

package/dist/components/PreferencesModal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PreferencesModal.d.ts","sourceRoot":"","sources":["../../src/components/PreferencesModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAMvC,KAAK,WAAW,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC;AAEpD,KAAK,qBAAqB,GAAG;IAC3B,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,YAAY,EAAE,WAAW,EAAE,CAAC;IAC5B,iBAAiB,EAAE,OAAO,CAAC;IAC3B,kBAAkB,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC/C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,qHAU9B,qBAAqB,4CAoCvB,CAAC"}

package/dist/components/PreferencesModal.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button } from "./Button";
+import { Dropdown } from "./Dropdown";
+import { Toggle } from "./Toggle";
+import { Modal } from "./Modal";
+export const PreferencesModal = ({ isOpen, onClose, themeMode, onThemeChange, themeOptions, animationsEnabled, onAnimationsChange, note = "Syncs across all Enderfall apps.", children, }) => {
+    const selectedTheme = themeOptions.find((option) => option.value === themeMode) ?? themeOptions[0];
+    const dropdownLabel = selectedTheme?.label ?? "Select theme";
+    const dropdownItems = themeOptions.map((option) => ({
+        id: option.value,
+        label: option.label,
+        onClick: () => onThemeChange(option.value),
+        className: `theme-preview theme-preview--${option.value}`,
+        variant: "theme-preview",
+    }));
+    return (_jsxs(Modal, { isOpen: isOpen, onClose: onClose, title: "Preferences", subtitle: "Applies across Enderfall apps.", children: [_jsxs("div", { className: "ef-modal-form", children: [_jsxs("label", { children: ["Theme", _jsx("div", { className: "ef-modal-user-dropdown", children: _jsx(Dropdown, { variant: "user", name: dropdownLabel, items: dropdownItems }) })] }), _jsx(Toggle, { checked: animationsEnabled, onChange: (event) => onAnimationsChange(event.target.checked), label: "Enable animations" }), children, note ? _jsx("div", { className: "ef-modal-note", children: note }) : null] }), _jsx("div", { className: "ef-modal-actions", children: _jsx(Button, { variant: "primary", type: "button", onClick: onClose, children: "Close" }) })] }));
+};

package/dist/components/SideMenu.d.ts

@@ -0,0 +1,28 @@
+import { type ReactNode, type MouseEvent } from "react";
+type SideMenuProps = {
+    children: ReactNode;
+    resetKey?: string | number | boolean | null;
+    hoverDelayMs?: number;
+    initialDelayMs?: number;
+    onOpenChange?: (openId: string | null) => void;
+};
+export declare const SideMenu: ({ children, resetKey, hoverDelayMs, initialDelayMs, onOpenChange, }: SideMenuProps) => import("react/jsx-runtime").JSX.Element;
+type SideMenuTriggerProps = {
+    onClick: (event: MouseEvent) => void;
+    disabled?: boolean;
+    "aria-expanded": boolean;
+};
+type SideMenuSubmenuProps = {
+    id: string;
+    trigger: (props: SideMenuTriggerProps) => ReactNode;
+    children: ReactNode;
+    className?: string;
+    panelClassName?: string;
+    disabled?: boolean;
+    enableViewportFlip?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    variant?: "default" | "header";
+};
+export declare const SideMenuSubmenu: ({ id, trigger, children, className, panelClassName, disabled, enableViewportFlip, onOpenChange, variant, }: SideMenuSubmenuProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=SideMenu.d.ts.map

package/dist/components/SideMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SideMenu.d.ts","sourceRoot":"","sources":["../../src/components/SideMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,EAQL,KAAK,SAAS,EACd,KAAK,UAAU,EAChB,MAAM,OAAO,CAAC;AAcf,KAAK,aAAa,GAAG;IACnB,QAAQ,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,IAAI,CAAC;IAC5C,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CAChD,CAAC;AAEF,eAAO,MAAM,QAAQ,GAAI,qEAMtB,aAAa,4CA8Df,CAAC;AAEF,KAAK,oBAAoB,GAAG;IAC1B,OAAO,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,CAAC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,EAAE,OAAO,CAAC;CAC1B,CAAC;AAEF,KAAK,oBAAoB,GAAG;IAC1B,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,SAAS,CAAC;IACpD,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;CAChC,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,4GAU7B,oBAAoB,4CA4GtB,CAAC"}

package/dist/components/SideMenu.js

@@ -0,0 +1,144 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { createContext, useContext, useEffect, useMemo, useRef, useState, } from "react";
+const SideMenuContext = createContext(null);
+export const SideMenu = ({ children, resetKey, hoverDelayMs = 220, initialDelayMs = 180, onOpenChange, }) => {
+    const [openId, setOpenId] = useState(null);
+    const hoverTimerRef = useRef(null);
+    const openedAtRef = useRef(Date.now());
+    useEffect(() => {
+        if (hoverTimerRef.current !== null) {
+            window.clearTimeout(hoverTimerRef.current);
+            hoverTimerRef.current = null;
+        }
+        setOpenId(null);
+        openedAtRef.current = Date.now();
+    }, [resetKey]);
+    useEffect(() => {
+        onOpenChange?.(openId);
+    }, [openId, onOpenChange]);
+    useEffect(() => {
+        return () => {
+            if (hoverTimerRef.current !== null) {
+                window.clearTimeout(hoverTimerRef.current);
+            }
+        };
+    }, []);
+    const scheduleOpen = (id) => {
+        if (hoverTimerRef.current !== null) {
+            window.clearTimeout(hoverTimerRef.current);
+        }
+        const elapsed = Date.now() - openedAtRef.current;
+        const settleDelay = elapsed < initialDelayMs ? initialDelayMs - elapsed : 0;
+        hoverTimerRef.current = window.setTimeout(() => {
+            setOpenId(id);
+        }, hoverDelayMs + settleDelay);
+    };
+    const clearHover = () => {
+        if (hoverTimerRef.current !== null) {
+            window.clearTimeout(hoverTimerRef.current);
+            hoverTimerRef.current = null;
+        }
+    };
+    const toggleOpen = (id) => {
+        setOpenId((prev) => (prev === id ? null : id));
+    };
+    const value = useMemo(() => ({
+        openId,
+        setOpenId,
+        scheduleOpen,
+        clearHover,
+        toggleOpen,
+        openedAt: openedAtRef.current,
+        initialDelayMs,
+    }), [openId, initialDelayMs]);
+    return _jsx(SideMenuContext.Provider, { value: value, children: children });
+};
+export const SideMenuSubmenu = ({ id, trigger, children, className, panelClassName, disabled, enableViewportFlip = false, onOpenChange, variant = "default", }) => {
+    const context = useContext(SideMenuContext);
+    if (!context) {
+        throw new Error("SideMenuSubmenu must be used within a SideMenu provider.");
+    }
+    const { openId, setOpenId, scheduleOpen, clearHover, toggleOpen, openedAt, initialDelayMs } = context;
+    const isOpen = openId === id;
+    const panelRef = useRef(null);
+    const containerRef = useRef(null);
+    const [panelStyle, setPanelStyle] = useState({});
+    useEffect(() => {
+        onOpenChange?.(isOpen);
+    }, [isOpen, onOpenChange]);
+    useEffect(() => {
+        if (!isOpen || !enableViewportFlip) {
+            setPanelStyle({});
+            return;
+        }
+        const updatePosition = () => {
+            const panel = panelRef.current;
+            const container = containerRef.current;
+            if (!panel || !container)
+                return;
+            const panelRect = panel.getBoundingClientRect();
+            const containerRect = container.getBoundingClientRect();
+            const margin = 12;
+            const defaultLeft = containerRect.right + 6;
+            const flippedLeft = containerRect.left - panelRect.width - 6;
+            let left = defaultLeft;
+            if (defaultLeft + panelRect.width > window.innerWidth - margin && flippedLeft >= margin) {
+                left = flippedLeft;
+            }
+            left = Math.min(Math.max(left, margin), window.innerWidth - margin - panelRect.width);
+            let top = containerRect.top;
+            top = Math.min(Math.max(top, margin), window.innerHeight - margin - panelRect.height);
+            setPanelStyle({
+                left: left - containerRect.left,
+                top: top - containerRect.top,
+                right: "auto",
+            });
+        };
+        const raf = requestAnimationFrame(updatePosition);
+        window.addEventListener("resize", updatePosition);
+        window.addEventListener("scroll", updatePosition, true);
+        return () => {
+            cancelAnimationFrame(raf);
+            window.removeEventListener("resize", updatePosition);
+            window.removeEventListener("scroll", updatePosition, true);
+        };
+    }, [isOpen, enableViewportFlip]);
+    const handlePointerEnter = () => {
+        if (disabled || isOpen)
+            return;
+        if (Date.now() - openedAt < initialDelayMs)
+            return;
+        setOpenId(null);
+        scheduleOpen(id);
+    };
+    const handlePointerLeave = () => {
+        clearHover();
+    };
+    const handlePointerMove = () => {
+        if (disabled || isOpen)
+            return;
+        if (Date.now() - openedAt < initialDelayMs)
+            return;
+        scheduleOpen(id);
+    };
+    const handleClick = (event) => {
+        if (disabled)
+            return;
+        event.preventDefault();
+        if (isOpen)
+            return;
+        setOpenId(id);
+    };
+    return (_jsxs("div", { className: [
+            className,
+            isOpen ? "is-open" : "",
+            variant === "header" ? "side-menu--header" : "",
+        ]
+            .filter(Boolean)
+            .join(" "), "data-submenu-id": id, ref: containerRef, onPointerEnter: handlePointerEnter, onPointerLeave: handlePointerLeave, onPointerMove: handlePointerMove, children: [trigger({ onClick: handleClick, disabled, "aria-expanded": isOpen }), _jsx("div", { ref: panelRef, className: [
+                    panelClassName,
+                    isOpen ? "is-open" : "",
+                ]
+                    .filter(Boolean)
+                    .join(" "), style: panelStyle, children: children })] }));
+};

package/dist/components/Slider.d.ts

@@ -0,0 +1,5 @@
+import { type InputHTMLAttributes } from "react";
+type SliderProps = Omit<InputHTMLAttributes<HTMLInputElement>, "type">;
+export declare const Slider: ({ className, ...props }: SliderProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=Slider.d.ts.map

package/dist/components/Slider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../../src/components/Slider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuB,KAAK,mBAAmB,EAAE,MAAM,OAAO,CAAC;AAEtE,KAAK,WAAW,GAAG,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,CAAC,CAAC;AAKvE,eAAO,MAAM,MAAM,GAAI,yBAAyB,WAAW,4CAyB1D,CAAC"}

package/dist/components/Slider.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+const getTheme = () => document.documentElement.dataset.theme || document.body.dataset.theme || "";
+export const Slider = ({ className, ...props }) => {
+    const [theme, setTheme] = useState("");
+    useEffect(() => {
+        setTheme(getTheme());
+        const observer = new MutationObserver(() => setTheme(getTheme()));
+        observer.observe(document.documentElement, {
+            attributes: true,
+            attributeFilter: ["data-theme"],
+        });
+        observer.observe(document.body, {
+            attributes: true,
+            attributeFilter: ["data-theme"],
+        });
+        return () => observer.disconnect();
+    }, []);
+    return (_jsx("input", { type: "range", className: ["ef-slider", className].filter(Boolean).join(" "), "data-ef-theme": theme || undefined, ...props }));
+};

package/dist/components/StackedCard.d.ts

@@ -0,0 +1,29 @@
+import type { CSSProperties, ReactNode } from "react";
+type Variant = "games" | "mods" | "servers" | "apps";
+type Align = "center" | "left";
+type Tone = "default" | "plain";
+type Action = {
+    label: string;
+    href?: string;
+    onClick?: () => void;
+};
+type StackedCardProps = {
+    title?: string;
+    description?: string;
+    tags?: string[];
+    imageUrl?: string | null;
+    variant?: Variant;
+    action?: Action;
+    align?: Align;
+    tone?: Tone;
+    showImage?: boolean;
+    children?: ReactNode;
+    frameClassName?: string;
+    cardClassName?: string;
+    bodyClassName?: string;
+    id?: string;
+    style?: CSSProperties;
+};
+export declare const StackedCard: ({ title, description, tags, imageUrl, variant, action, align, tone, showImage, children, frameClassName, cardClassName, bodyClassName, id, style, }: StackedCardProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=StackedCard.d.ts.map

package/dist/components/StackedCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StackedCard.d.ts","sourceRoot":"","sources":["../../src/components/StackedCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEtD,KAAK,OAAO,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,GAAG,MAAM,CAAC;AACrD,KAAK,KAAK,GAAG,QAAQ,GAAG,MAAM,CAAC;AAC/B,KAAK,IAAI,GAAG,SAAS,GAAG,OAAO,CAAC;AAEhC,KAAK,MAAM,GAAG;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAEF,KAAK,gBAAgB,GAAG;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB,CAAC;AAoBF,eAAO,MAAM,WAAW,GAAI,qJAgBzB,gBAAgB,4CA4DlB,CAAC"}

package/dist/components/StackedCard.js

@@ -0,0 +1,31 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+const variantClass = (variant) => {
+    switch (variant) {
+        case "games":
+            return "ef-stacked-variant-games";
+        case "mods":
+            return "ef-stacked-variant-mods";
+        case "servers":
+            return "ef-stacked-variant-servers";
+        case "apps":
+            return "ef-stacked-variant-apps";
+        default:
+            return "";
+    }
+};
+const alignClass = (align) => (align === "left" ? "ef-stacked-body-left" : "");
+const toneClass = (tone) => (tone === "plain" ? "ef-stacked-body-plain" : "ef-stacked-body");
+export const StackedCard = ({ title = "", description = "", tags, imageUrl, variant, action, align = "center", tone = "default", showImage = true, children, frameClassName, cardClassName, bodyClassName, id, style, }) => {
+    const bodyClasses = [toneClass(tone), alignClass(align), bodyClassName]
+        .filter(Boolean)
+        .join(" ");
+    return (_jsx("article", { className: ["ef-stacked-frame", variantClass(variant), frameClassName].filter(Boolean).join(" "), id: id, style: style, children: _jsxs("div", { className: ["ef-stacked-card", cardClassName].filter(Boolean).join(" "), children: [showImage ? (_jsx("div", { className: ["ef-stacked-image", imageUrl ? "ef-stacked-image-photo" : ""]
+                        .filter(Boolean)
+                        .join(" "), style: imageUrl
+                        ? {
+                            backgroundImage: `linear-gradient(180deg, rgba(10, 12, 22, 0.1), rgba(10, 12, 22, 0.85)), url(${imageUrl})`,
+                            backgroundSize: "cover",
+                            backgroundPosition: "center",
+                        }
+                        : undefined })) : null, _jsxs("div", { className: bodyClasses, children: [children ? (children) : (_jsxs(_Fragment, { children: [_jsx("h3", { children: title }), _jsx("p", { children: description }), tags?.length ? (_jsx("div", { className: `ef-stacked-tags ${align === "left" ? "ef-stacked-tags-left" : ""}`, children: tags.map((tag) => (_jsx("span", { className: "ef-stacked-tag", children: tag }, tag))) })) : null] })), action ? (action.href ? (_jsx("a", { className: "ef-stacked-action", href: action.href, children: action.label })) : (_jsx("button", { className: "ef-stacked-action", type: "button", onClick: action.onClick, children: action.label }))) : null] })] }) }));
+};

package/dist/components/StatDots.d.ts

@@ -0,0 +1,12 @@
+import { type HTMLAttributes } from "react";
+type StatDotsProps = HTMLAttributes<HTMLDivElement> & {
+    label: string;
+    count?: number;
+    value?: number;
+    defaultValue?: number;
+    disabled?: boolean;
+    onChange?: (value: number) => void;
+};
+export declare const StatDots: ({ label, count, value, defaultValue, disabled, onChange, className, ...rest }: StatDotsProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=StatDots.d.ts.map

package/dist/components/StatDots.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatDots.d.ts","sourceRoot":"","sources":["../../src/components/StatDots.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAGtD,KAAK,aAAa,GAAG,cAAc,CAAC,cAAc,CAAC,GAAG;IACpD,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC,CAAC;AAEF,eAAO,MAAM,QAAQ,GAAI,+EAStB,aAAa,4CA+Bf,CAAC"}

package/dist/components/StatDots.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { Panel } from "./Panel";
+export const StatDots = ({ label, count = 4, value, defaultValue = 0, disabled = false, onChange, className, ...rest }) => {
+    const [internalValue, setInternalValue] = useState(defaultValue);
+    const currentValue = Math.max(0, Math.min(count, value ?? internalValue));
+    const handleSelect = (nextValue) => {
+        if (disabled)
+            return;
+        const resolvedValue = nextValue === currentValue ? 0 : nextValue;
+        if (value === undefined) {
+            setInternalValue(resolvedValue);
+        }
+        onChange?.(resolvedValue);
+    };
+    const classes = ["ef-stat-dots", className].filter(Boolean).join(" ");
+    return (_jsxs("div", { className: classes, ...rest, children: [_jsx(Panel, { variant: "highlight", borderWidth: 1, className: "ef-stat-dots__label", children: label }), _jsx("div", { className: "ef-stat-dots__dots", role: "group", "aria-label": label, children: Array.from({ length: count }, (_, index) => (_jsx("input", { className: "ef-stat-dots__input", type: "checkbox", checked: index < currentValue, disabled: disabled, onChange: () => handleSelect(index + 1) }, `${label}-${index}`))) })] }));
+};

package/dist/components/Toggle.d.ts

@@ -0,0 +1,9 @@
+import type { InputHTMLAttributes } from "react";
+type ToggleProps = Omit<InputHTMLAttributes<HTMLInputElement>, "type"> & {
+    label?: string;
+    description?: string;
+    variant?: "switch" | "checkbox";
+};
+export declare const Toggle: ({ label, description, className, variant, ...props }: ToggleProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=Toggle.d.ts.map

package/dist/components/Toggle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toggle.d.ts","sourceRoot":"","sources":["../../src/components/Toggle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAC;AAEjD,KAAK,WAAW,GAAG,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,CAAC,GAAG;IACvE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,QAAQ,GAAG,UAAU,CAAC;CACjC,CAAC;AAEF,eAAO,MAAM,MAAM,GAAI,sDAMpB,WAAW,4CAuBb,CAAC"}

package/dist/components/Toggle.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const Toggle = ({ label, description, className, variant = "switch", ...props }) => (_jsxs("label", { className: ["ef-toggle", `ef-toggle--${variant}`, className]
+        .filter(Boolean)
+        .join(" "), children: [_jsx("input", { type: "checkbox", className: "ef-toggle-input", ...props }), variant === "switch" ? (_jsx("span", { className: "ef-toggle-track", "aria-hidden": "true", children: _jsx("span", { className: "ef-toggle-thumb" }) })) : (_jsx("span", { className: "ef-toggle-box", "aria-hidden": "true", children: _jsx("span", { className: "ef-toggle-check" }) })), label ? (_jsxs("span", { className: "ef-toggle-label", children: [_jsx("span", { className: "ef-toggle-text", children: label }), description ? _jsx("span", { className: "ef-toggle-description", children: description }) : null] })) : null] }));

package/dist/index.d.ts

@@ -0,0 +1,26 @@
+export type ThemeMode = string;
+export { AccessGate } from "./components/AccessGate";
+export { Button } from "./components/Button";
+export { FormField } from "./components/FormField";
+export { Input, Textarea, Select } from "./components/Input";
+export { Panel } from "./components/Panel";
+export { StackedCard } from "./components/StackedCard";
+export { Dropdown } from "./components/Dropdown";
+export { MainHeader } from "./components/MainHeader";
+export { FloatingFooter } from "./components/FloatingFooter";
+export { Modal } from "./components/Modal";
+export { PreferencesModal } from "./components/PreferencesModal";
+export { Toggle } from "./components/Toggle";
+export { Slider } from "./components/Slider";
+export { StatDots } from "./components/StatDots";
+export { SideMenu, SideMenuSubmenu } from "./components/SideMenu";
+type ThemeOptions<T extends ThemeMode> = {
+    storageKey: string;
+    defaultTheme: T;
+    allowed: readonly T[];
+    dataAttribute?: string;
+    bodyClass?: string | null;
+};
+export declare const getStoredTheme: <T extends ThemeMode>(options: ThemeOptions<T>) => T;
+export declare const applyTheme: <T extends ThemeMode>(theme: T, options: ThemeOptions<T>) => void;
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,SAAS,GAAG,MAAM,CAAC;AAC/B,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACrD,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACnD,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAC7D,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAC3C,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjD,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACrD,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAC3C,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AACjE,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjD,OAAO,EAAE,QAAQ,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAElE,KAAK,YAAY,CAAC,CAAC,SAAS,SAAS,IAAI;IACvC,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,CAAC,CAAC;IAChB,OAAO,EAAE,SAAS,CAAC,EAAE,CAAC;IACtB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC3B,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,CAAC,SAAS,SAAS,EAAE,SAAS,YAAY,CAAC,CAAC,CAAC,MAS3E,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,CAAC,SAAS,SAAS,EAAE,OAAO,CAAC,EAAE,SAAS,YAAY,CAAC,CAAC,CAAC,SAOjF,CAAC"}

package/dist/index.js

@@ -0,0 +1,33 @@
+export { AccessGate } from "./components/AccessGate";
+export { Button } from "./components/Button";
+export { FormField } from "./components/FormField";
+export { Input, Textarea, Select } from "./components/Input";
+export { Panel } from "./components/Panel";
+export { StackedCard } from "./components/StackedCard";
+export { Dropdown } from "./components/Dropdown";
+export { MainHeader } from "./components/MainHeader";
+export { FloatingFooter } from "./components/FloatingFooter";
+export { Modal } from "./components/Modal";
+export { PreferencesModal } from "./components/PreferencesModal";
+export { Toggle } from "./components/Toggle";
+export { Slider } from "./components/Slider";
+export { StatDots } from "./components/StatDots";
+export { SideMenu, SideMenuSubmenu } from "./components/SideMenu";
+export const getStoredTheme = (options) => {
+    const stored = localStorage.getItem(options.storageKey);
+    if (stored && options.allowed.includes(stored)) {
+        return stored;
+    }
+    if (stored === "dark" && options.allowed.includes("galaxy")) {
+        return "galaxy";
+    }
+    return options.defaultTheme;
+};
+export const applyTheme = (theme, options) => {
+    const dataAttribute = options.dataAttribute ?? "data-theme";
+    if (options.bodyClass) {
+        document.body.classList.toggle(options.bodyClass, theme === options.defaultTheme);
+    }
+    document.documentElement.setAttribute(dataAttribute, theme);
+    localStorage.setItem(options.storageKey, theme);
+};

package/package.json

@@ -0,0 +1,30 @@
+{
+  "name": "@enderfall/ui",
+  "private": false,
+  "version": "0.1.0",
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist",
+    "styles.css"
+  ],
+  "scripts": {
+    "build": "tsc -p tsconfig.build.json",
+    "dev": "tsc -p tsconfig.build.json --watch"
+  },
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./styles.css": "./styles.css"
+  },
+  "peerDependencies": {
+    "react": "^18.2.0"
+  },
+  "devDependencies": {
+    "@types/react": "^18.2.43",
+    "typescript": "^5.3.3"
+  }
+}

package/styles.css

@@ -0,0 +1,17 @@
+@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap");
+@import "./src/base.css";
+@import "./src/theme.css";
+@import "./src/components/BookmarkDropdown.css";
+@import "./src/components/AccessGate.css";
+@import "./src/components/Button.css";
+@import "./src/components/Input.css";
+@import "./src/components/Toggle.css";
+@import "./src/components/Slider.css";
+@import "./src/components/StackedCard.css";
+@import "./src/components/Panel.css";
+@import "./src/components/Modal.css";
+@import "./src/components/HeaderMenu.css";
+@import "./src/components/MainHeader.css";
+@import "./src/components/FloatingFooter.css";
+@import "./src/components/UserMenu.css";
+@import "./src/components/StatDots.css";