@drawnagency/primitives 0.1.1 → 0.2.0

package/dist/components/shared/IconButton.js

@@ -1,16 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import { cn } from "../../lib/cn";
-const sizeClasses = {
-    sm: "h-chrome-sm w-chrome-sm",
-    md: "h-chrome-md w-chrome-md",
-    lg: "h-chrome-lg w-chrome-lg",
-};
-const intentClasses = {
-    default: "text-base-contrast-light hover:text-base-contrast",
-    destructive: "text-destructive hover:text-destructive-hover",
-    primary: "text-primary/60 hover:text-primary",
-};
-export const IconButton = forwardRef(function IconButton({ icon, label, size = "md", intent = "default", className, ...rest }, ref) {
-    return (_jsx("button", { ref: ref, type: "button", className: cn("cursor-pointer flex items-center justify-center rounded transition-colors", sizeClasses[size], intentClasses[intent], className), "aria-label": label, ...rest, children: icon }));
-});

package/dist/components/shared/Input.js

@@ -1,8 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useId } from "react";
-import { cn } from "../../lib/cn";
-import { FormLabel } from "./FormLabel";
-export const Input = forwardRef(function Input({ label, value, onChange, type = "text", className, disabled, ...rest }, ref) {
-    const id = useId();
-    return (_jsxs("div", { className: className, children: [_jsx(FormLabel, { htmlFor: id, children: label }), _jsx("input", { ref: ref, id: id, type: type, value: value, onChange: (e) => onChange(e.target.value), disabled: disabled, className: cn("w-full rounded border border-base-200 bg-base px-3 py-2 text-sm text-base-contrast", "focus:border-base-contrast focus:outline-none focus:ring-1 focus:ring-base-contrast", disabled && "cursor-not-allowed opacity-50"), ...rest })] }));
-});

package/dist/components/shared/Navigation.js

@@ -1,71 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useState, useCallback, useEffect } from "react";
-import { cn } from "../../lib/cn";
-import { Toggle } from "./Toggle";
-import { editModeEvent, navChangeEvent, darkModeEvent } from "../../lib/events";
-import { useActiveHeadings } from "../../hooks/useActiveHeadings";
-export default function Navigation({ navLinks: initialNavLinks, siteName, darkMode }) {
-    const [isOpen, setIsOpen] = useState(false);
-    const [isEditMode, setIsEditMode] = useState(false);
-    const [currentDarkMode, setCurrentDarkMode] = useState(darkMode);
-    const [isDark, setIsDark] = useState(false);
-    const [navLinks, setNavLinks] = useState(initialNavLinks);
-    useEffect(() => {
-        const unlistenEdit = editModeEvent.listen(({ isEditMode }) => setIsEditMode(isEditMode));
-        const unlistenNav = navChangeEvent.listen((links) => setNavLinks(links));
-        const unlistenDark = darkModeEvent.listen((mode) => setCurrentDarkMode(mode));
-        return () => { unlistenEdit(); unlistenNav(); unlistenDark(); };
-    }, []);
-    useEffect(() => {
-        const root = document.documentElement;
-        setIsDark(root.classList.contains("dark"));
-        const observer = new MutationObserver(() => {
-            setIsDark(root.classList.contains("dark"));
-        });
-        observer.observe(root, { attributes: true, attributeFilter: ["class"] });
-        return () => observer.disconnect();
-    }, []);
-    const handleThemeToggle = useCallback((next) => {
-        const root = document.documentElement;
-        root.classList.add("theme-changing");
-        root.classList.toggle("dark", next);
-        localStorage.setItem("theme", next ? "dark" : "light");
-        setTimeout(() => root.classList.remove("theme-changing"), 200);
-    }, []);
-    // Build ID maps for scroll tracking
-    const parentIds = navLinks.map((item) => item.href.replace("#", ""));
-    const childIdsByParent = {};
-    const grandchildIdsByChild = {};
-    for (const parent of navLinks) {
-        const pid = parent.href.replace("#", "");
-        childIdsByParent[pid] = parent.children.map((c) => c.href.replace("#", ""));
-        for (const child of parent.children) {
-            const cid = child.href.replace("#", "");
-            grandchildIdsByChild[cid] = child.children.map((gc) => gc.href.replace("#", ""));
-        }
-    }
-    const { activeParentId, activeChildId, activeGrandchildId, setActiveSection } = useActiveHeadings(parentIds, childIdsByParent, grandchildIdsByChild);
-    const handleNav = useCallback((href) => {
-        const id = href.replace("#", "");
-        const el = document.getElementById(id);
-        if (el) {
-            el.scrollIntoView({ behavior: "smooth" });
-            setActiveSection(id);
-        }
-        setIsOpen(false);
-    }, [setActiveSection]);
-    return (_jsxs(_Fragment, { children: [_jsxs("header", { className: "fixed top-0 left-0 right-0 z-50 flex h-16 items-center justify-between bg-base px-4 lg:hidden", children: [_jsx("span", { className: "text-lg font-bold text-primary", children: siteName }), _jsx("button", { onClick: () => setIsOpen(!isOpen), className: "cursor-pointer p-2 text-base-contrast", "aria-label": "Toggle navigation", children: _jsx("svg", { className: "h-6 w-6", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", "aria-hidden": "true", children: isOpen
-                                ? _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" })
-                                : _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M4 6h16M4 12h16M4 18h16" }) }) })] }), isOpen && (_jsx("div", { className: "fixed inset-0 z-40 bg-black/50 lg:hidden", onClick: () => setIsOpen(false) })), _jsxs("nav", { className: cn("fixed top-0 left-0 z-40 h-full w-64 overflow-y-auto bg-base pt-16 transition-transform lg:translate-x-0", isOpen ? "translate-x-0" : "-translate-x-full"), children: [_jsx("div", { className: "hidden px-4 py-4 lg:block", children: _jsx("span", { className: "text-lg font-bold text-primary", children: siteName }) }), _jsx("ul", { className: "space-y-1 px-4 py-2", children: navLinks.map((parent) => {
-                            const pid = parent.href.replace("#", "");
-                            const isActiveParent = activeParentId === pid;
-                            return (_jsxs("li", { children: [_jsx("button", { onClick: () => handleNav(parent.href), className: cn("cursor-pointer w-full rounded px-3 py-2 text-left text-sm font-bold transition-colors", isActiveParent ? "text-primary" : "text-base-contrast hover:text-primary", !isEditMode && parent.status && parent.status !== "published" && "opacity-50"), children: parent.label }), isActiveParent && parent.children.length > 0 && (_jsx("ul", { className: "ml-3 mt-1 space-y-1 border-l border-base-200 pl-3", children: parent.children.map((child) => {
-                                            const cid = child.href.replace("#", "");
-                                            const isActiveChild = activeChildId === cid;
-                                            return (_jsxs("li", { children: [_jsx("button", { onClick: () => handleNav(child.href), className: cn("cursor-pointer w-full rounded px-2 py-1 text-left text-sm transition-colors", isActiveChild ? "font-bold text-primary" : "text-base-contrast-light hover:text-primary", !isEditMode && child.status && child.status !== "published" && "opacity-50"), children: child.label }), isActiveChild && child.children.length > 0 && (_jsx("ul", { className: "ml-3 mt-1 space-y-1", children: child.children.map((gc) => {
-                                                            const gid = gc.href.replace("#", "");
-                                                            return (_jsx("li", { children: _jsx("button", { onClick: () => handleNav(gc.href), className: cn("cursor-pointer block w-full px-2 py-1 text-left text-xs transition-colors", activeGrandchildId === gid ? "font-bold text-primary" : "text-base-contrast-light hover:text-primary", !isEditMode && gc.status && gc.status !== "published" && "opacity-50"), children: gc.label }) }, gid));
-                                                        }) }))] }, cid));
-                                        }) }))] }, pid));
-                        }) }), currentDarkMode === "optional" && (_jsx("div", { className: "mt-auto border-t border-base-200 px-4 py-4", children: _jsxs("div", { className: "flex items-center gap-2 text-sm text-base-contrast-light", children: [_jsx("span", { className: cn(!isDark && "text-base-contrast"), children: "Light" }), _jsx(Toggle, { checked: isDark, onChange: handleThemeToggle, label: "Toggle dark mode" }), _jsx("span", { className: cn(isDark && "text-base-contrast"), children: "Dark" })] }) }))] })] }));
-}

package/dist/components/shared/PasswordInput.js

@@ -1,11 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useId, useState } from "react";
-import { Eye, EyeOff } from "lucide-react";
-import { cn } from "../../lib/cn";
-import { IconButton } from "./IconButton";
-import { FormLabel } from "./FormLabel";
-export function PasswordInput({ label, value, onChange, autoComplete, placeholder, disabled, showToggle = false, className, }) {
-    const id = useId();
-    const [revealed, setRevealed] = useState(false);
-    return (_jsxs("div", { className: className, children: [_jsx(FormLabel, { htmlFor: id, children: label }), _jsxs("div", { className: "relative", children: [_jsx("input", { id: id, type: revealed ? "text" : "password", value: value, onChange: (e) => onChange(e.target.value), autoComplete: autoComplete, placeholder: placeholder, disabled: disabled, className: cn("w-full rounded border border-base-200 bg-base px-3 py-2 text-sm text-base-contrast", "focus:border-base-contrast focus:outline-none focus:ring-1 focus:ring-base-contrast", showToggle && "pr-9", disabled && "cursor-not-allowed opacity-50") }), showToggle && (_jsx(IconButton, { icon: revealed ? _jsx(EyeOff, { size: 16 }) : _jsx(Eye, { size: 16 }), label: revealed ? "Hide password" : "Show password", size: "sm", "aria-pressed": revealed, disabled: disabled, onClick: () => setRevealed((v) => !v), className: "absolute inset-y-0 right-0 my-auto px-2 disabled:cursor-not-allowed disabled:opacity-50" }))] })] }));
-}

package/dist/components/shared/Popover.js

@@ -1,33 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useEffect, useRef } from "react";
-import { useFocusTrap } from "../../hooks/useFocusTrap";
-import { cn } from "../../lib/cn";
-export function Popover({ isOpen, onClose, anchorRef, children, align = "start", className, }) {
-    const panelRef = useRef(null);
-    useFocusTrap(panelRef, isOpen);
-    useEffect(() => {
-        if (!isOpen)
-            return;
-        function onKeyDown(e) {
-            if (e.key === "Escape")
-                onClose();
-        }
-        function onMouseDown(e) {
-            const target = e.target;
-            if (panelRef.current?.contains(target))
-                return;
-            if (anchorRef.current?.contains(target))
-                return;
-            onClose();
-        }
-        document.addEventListener("keydown", onKeyDown);
-        document.addEventListener("mousedown", onMouseDown);
-        return () => {
-            document.removeEventListener("keydown", onKeyDown);
-            document.removeEventListener("mousedown", onMouseDown);
-        };
-    }, [isOpen, onClose, anchorRef]);
-    if (!isOpen)
-        return null;
-    return (_jsx("div", { ref: panelRef, role: "dialog", "aria-modal": "false", className: cn("absolute top-full z-50 mt-1 rounded-md border border-base-200 bg-base shadow-lg", align === "end" ? "right-0" : "left-0", className), children: children }));
-}

package/dist/components/shared/PopoverItem.js

@@ -1,6 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import { cn } from "../../lib/cn";
-export const PopoverItem = forwardRef(function PopoverItem({ className, children, ...rest }, ref) {
-    return (_jsx("button", { ref: ref, type: "button", className: cn("flex w-full cursor-pointer items-center gap-3 px-3 py-1.5 text-left hover:bg-base-accent", className), ...rest, children: children }));
-});

package/dist/components/shared/Select.js

@@ -1,9 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useId } from "react";
-import { ChevronDown } from "lucide-react";
-import { cn } from "../../lib/cn";
-import { FormLabel } from "./FormLabel";
-export function Select({ label, value, onChange, options, disabled, className, selectClassName, }) {
-    const id = useId();
-    return (_jsxs("div", { className: className, children: [label && _jsx(FormLabel, { htmlFor: id, children: label }), _jsxs("div", { className: "relative", children: [_jsx("select", { id: id, value: value, onChange: (e) => onChange(e.target.value), disabled: disabled, className: cn("w-full appearance-none rounded border border-base-200 bg-base py-2 pr-8 pl-3 text-sm text-base-contrast", "focus:border-base-contrast focus:outline-none focus:ring-1 focus:ring-base-contrast", disabled && "cursor-not-allowed opacity-50", selectClassName), children: options.map((opt) => (_jsx("option", { value: opt.value, children: opt.label }, opt.value))) }), _jsx(ChevronDown, { size: 14, className: "pointer-events-none absolute right-2.5 top-1/2 -translate-y-1/2 text-base-contrast-light" })] })] }));
-}

package/dist/components/shared/Textarea.js

@@ -1,8 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useId } from "react";
-import { cn } from "../../lib/cn";
-import { FormLabel } from "./FormLabel";
-export const Textarea = forwardRef(function Textarea({ label, value, onChange, rows = 3, className, disabled, ...rest }, ref) {
-    const id = useId();
-    return (_jsxs("div", { className: className, children: [_jsx(FormLabel, { htmlFor: id, children: label }), _jsx("textarea", { ref: ref, id: id, value: value, onChange: (e) => onChange(e.target.value), rows: rows, disabled: disabled, className: cn("w-full resize-none rounded border border-base-200 bg-base px-3 py-2 text-sm text-base-contrast", "focus:border-base-contrast focus:outline-none focus:ring-1 focus:ring-base-contrast", disabled && "cursor-not-allowed opacity-50"), ...rest })] }));
-});

package/dist/components/shared/Toggle.js

@@ -1,5 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { cn } from "../../lib/cn";
-export function Toggle({ checked, onChange, label, disabled, className }) {
-    return (_jsx("button", { type: "button", role: "switch", "aria-checked": checked, "aria-label": label, disabled: disabled, onClick: () => onChange(!checked), className: cn("relative inline-flex h-5 w-9 shrink-0 items-center rounded-full transition-colors", checked ? "bg-primary" : "bg-base-200", disabled ? "cursor-not-allowed opacity-50" : "cursor-pointer", className), children: _jsx("span", { className: cn("inline-block h-4 w-4 transform rounded-full bg-base shadow transition", checked ? "translate-x-[18px]" : "translate-x-0.5") }) }));
-}

package/dist/components/shared/Tooltip.js

@@ -1,8 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { cn } from "../../lib/cn";
-export function Tooltip({ content, children, className }) {
-    return (_jsxs("div", { className: cn("group/tooltip relative inline-flex", className), children: [children, _jsx("span", { className: "pointer-events-none absolute left-1/2 top-full z-50 mt-1.5 -translate-x-1/2 opacity-0 transition-opacity delay-300 group-hover/tooltip:opacity-100", role: "tooltip", children: _jsx("span", { className: "block whitespace-nowrap rounded bg-tooltip px-2 py-1 text-center text-xs leading-relaxed text-tooltip-muted", children: content }) })] }));
-}
-export function Kbd({ children }) {
-    return _jsx("strong", { className: "text-tooltip-contrast", children: children });
-}

package/dist/components/shared/icons.js

@@ -1,23 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-/**
- * Shared icon button presets used across editor chrome.
- * Each returns a styled element ready to drop into any context.
- * Sizing and visibility are left to the consumer via className.
- */
-import { GripVertical, Plus, Trash2, X, Settings } from "lucide-react";
-export function DragHandle({ size = 16 }) {
-    return _jsx(GripVertical, { size: size });
-}
-export function AddIcon({ size = 14 }) {
-    return _jsx(Plus, { size: size });
-}
-export function RemoveIcon({ size = 14 }) {
-    return _jsx(X, { size: size });
-}
-export function DeleteIcon({ size = 14 }) {
-    return _jsx(Trash2, { size: size });
-}
-export function SettingsIcon({ size = 14 }) {
-    return _jsx(Settings, { size: size });
-}
-export { GripVertical, Plus, Trash2, X, Settings } from "lucide-react";

package/dist/components/shell/AudienceAddForm.js

@@ -1,43 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from "react";
-import { AudienceColorSchema } from "../../schemas/audience";
-import { Input } from "../shared/Input";
-import { PasswordInput } from "../shared/PasswordInput";
-import { Button } from "../shared/Button";
-import { ColorPicker } from "../shared/ColorPicker";
-const DEFAULT_COLOR = "#3b82f6";
-export function AudienceAddForm({ onSubmit, onCancel }) {
-    const [name, setName] = useState("");
-    const [color, setColor] = useState(DEFAULT_COLOR);
-    const [password, setPassword] = useState("");
-    const [error, setError] = useState(null);
-    const [submitting, setSubmitting] = useState(false);
-    async function handleSubmit(e) {
-        e.preventDefault();
-        setError(null);
-        if (name.trim().length === 0) {
-            setError("Name is required");
-            return;
-        }
-        const colorResult = AudienceColorSchema.safeParse(color);
-        if (!colorResult.success) {
-            setError("Invalid color");
-            return;
-        }
-        if (password.length === 0) {
-            setError("Password is required");
-            return;
-        }
-        setSubmitting(true);
-        try {
-            await onSubmit({ displayName: name, color, password });
-        }
-        catch (e) {
-            setError(e instanceof Error ? e.message : "Add failed");
-        }
-        finally {
-            setSubmitting(false);
-        }
-    }
-    return (_jsxs("form", { onSubmit: handleSubmit, autoComplete: "off", className: "space-y-3 rounded border border-base-200 px-3 py-3", children: [_jsxs("div", { className: "flex items-start gap-3", children: [_jsx(ColorPicker, { value: color, onChange: setColor, className: "mt-[1.625rem]" }), _jsxs("div", { className: "flex-1 space-y-2", children: [_jsx(Input, { label: "Name", value: name, onChange: setName }), _jsx(PasswordInput, { label: "Password", value: password, onChange: setPassword, autoComplete: "new-password", showToggle: true })] })] }), error && _jsx("p", { className: "text-xs text-red-600", children: error }), _jsxs("div", { className: "flex justify-end gap-2", children: [_jsx(Button, { type: "button", variant: "secondary", onClick: onCancel, disabled: submitting, children: "Cancel" }), _jsx(Button, { type: "submit", variant: "primary", isLoading: submitting, loadingLabel: "Adding...", children: "Add" })] })] }));
-}

package/dist/components/shell/AudienceRow.js

@@ -1,74 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from "react";
-import { Input } from "../shared/Input";
-import { PasswordInput } from "../shared/PasswordInput";
-import { Button } from "../shared/Button";
-import { ColorPicker } from "../shared/ColorPicker";
-const PLACEHOLDER_COLOR = "#94a3b8";
-export function AudienceRow({ audience, isDefault, canMutate, onSave, onDelete, }) {
-    const [isEditing, setIsEditing] = useState(false);
-    const [draftDisplayName, setDraftDisplayName] = useState(audience.displayName);
-    const [draftColor, setDraftColor] = useState(audience.color ?? PLACEHOLDER_COLOR);
-    const [draftPassword, setDraftPassword] = useState("");
-    const [error, setError] = useState(null);
-    const [saving, setSaving] = useState(false);
-    function startEdit() {
-        setIsEditing(true);
-        setDraftColor(audience.color ?? PLACEHOLDER_COLOR);
-        setDraftDisplayName(audience.displayName);
-        setDraftPassword("");
-        setError(null);
-    }
-    function cancelEdit() {
-        setIsEditing(false);
-        setError(null);
-    }
-    async function save() {
-        setError(null);
-        setSaving(true);
-        const patch = {};
-        if (draftDisplayName.trim().length === 0) {
-            setError("Name is required");
-            setSaving(false);
-            return;
-        }
-        if (draftDisplayName !== audience.displayName) {
-            patch.displayName = draftDisplayName;
-        }
-        if (draftColor !== (audience.color ?? PLACEHOLDER_COLOR)) {
-            patch.color = draftColor;
-        }
-        if (draftPassword.length > 0) {
-            patch.password = draftPassword;
-        }
-        if (Object.keys(patch).length === 0) {
-            setIsEditing(false);
-            setSaving(false);
-            return;
-        }
-        try {
-            await onSave(patch);
-            setIsEditing(false);
-        }
-        catch (e) {
-            setError(e instanceof Error ? e.message : "Save failed");
-        }
-        finally {
-            setSaving(false);
-        }
-    }
-    async function remove() {
-        if (!confirm(`Remove audience "${audience.displayName}"?`))
-            return;
-        try {
-            await onDelete();
-        }
-        catch (e) {
-            setError(e instanceof Error ? e.message : "Delete failed");
-        }
-    }
-    if (isEditing) {
-        return (_jsxs("div", { className: "space-y-3 rounded border border-base-200 px-3 py-3", children: [_jsxs("div", { className: "flex items-start gap-3", children: [_jsx(ColorPicker, { value: draftColor, onChange: setDraftColor, className: "mt-[1.625rem]" }), _jsxs("div", { className: "flex-1 space-y-2", children: [_jsx(Input, { label: "Display name", value: draftDisplayName, onChange: setDraftDisplayName }), _jsx(PasswordInput, { label: "New password", value: draftPassword, onChange: setDraftPassword, autoComplete: "new-password", placeholder: audience.hasPassword ? "Leave blank to keep current" : "Required", showToggle: true }), _jsx("span", { className: "block text-[11px] text-base-contrast-light", children: "Passwords are hashed \u2014 the existing one can't be recovered, only replaced." })] })] }), error && _jsx("p", { className: "text-xs text-red-600", children: error }), _jsxs("div", { className: "flex justify-end gap-2", children: [_jsx(Button, { type: "button", variant: "secondary", onClick: cancelEdit, disabled: saving, children: "Cancel" }), _jsx(Button, { type: "button", variant: "primary", onClick: save, isLoading: saving, loadingLabel: "Saving...", children: "Save" })] })] }));
-    }
-    return (_jsx("div", { className: "rounded border border-base-200 px-3 py-2", children: _jsxs("div", { className: "flex items-center gap-3", children: [_jsx("span", { "aria-hidden": true, className: "inline-block h-4 w-4 rounded-full border border-base-200", style: { backgroundColor: audience.color ?? PLACEHOLDER_COLOR } }), _jsxs("span", { className: "flex flex-1 items-center gap-2 text-sm text-base-contrast", children: [audience.displayName, isDefault && (_jsx("span", { className: "rounded bg-base-accent px-1.5 py-0.5 text-xs text-base-contrast-light", children: "Default" }))] }), audience.hasPassword ? (_jsx("span", { "aria-label": "Password is set", title: "Passwords are hashed and can't be shown. Edit to set a new one.", className: "text-xs tracking-widest text-base-contrast-light", children: "\u2022\u2022\u2022\u2022" })) : canMutate ? (_jsx(Button, { variant: "ghost", onClick: startEdit, children: "Set password" })) : null, canMutate && (_jsx(Button, { variant: "ghost", onClick: startEdit, children: "Edit" })), canMutate && !isDefault && (_jsx(Button, { variant: "ghost", tone: "destructive", onClick: remove, children: "Remove" }))] }) }));
-}

package/dist/components/shell/EditorContext.js

@@ -1,24 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { createContext, useContext, useState, useCallback } from "react";
-import { editModeEvent } from "../../lib/events";
-const EditorContext = createContext(null);
-export function EditorProvider({ children }) {
-    const [isEditMode, setIsEditMode] = useState(true);
-    const [showAllChrome, setShowAllChrome] = useState(false);
-    const toggleEditMode = useCallback(() => {
-        setIsEditMode((prev) => {
-            const next = !prev;
-            editModeEvent.dispatch({ isEditMode: next });
-            return next;
-        });
-    }, []);
-    const toggleShowAllChrome = useCallback(() => setShowAllChrome((prev) => !prev), []);
-    return (_jsx(EditorContext.Provider, { value: { isEditMode, showAllChrome, toggleEditMode, toggleShowAllChrome }, children: children }));
-}
-export function useEditorContext() {
-    const context = useContext(EditorContext);
-    if (!context) {
-        throw new Error("useEditorContext must be used within an EditorProvider");
-    }
-    return context;
-}

package/dist/components/shell/EditorLoginForm.js

@@ -1,46 +0,0 @@
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
-import { useState } from "react";
-import { PasswordInput } from "../shared/PasswordInput";
-import { Button } from "../shared/Button";
-import { safeRedirect } from "../../lib/safeRedirect";
-export function EditorLoginForm({ capabilities, oauthProviders = [], next }) {
-    const [email, setEmail] = useState("");
-    const [password, setPassword] = useState("");
-    const [error, setError] = useState(null);
-    const [loading, setLoading] = useState(false);
-    async function handlePasswordSubmit(e) {
-        e.preventDefault();
-        setLoading(true);
-        setError(null);
-        const base = capabilities.passwordOnly
-            ? { type: "password", password }
-            : { type: "email", email, password };
-        const body = next ? { ...base, next } : base;
-        try {
-            const response = await fetch("/api/auth/sign-in", {
-                method: "POST",
-                headers: { "Content-Type": "application/json" },
-                body: JSON.stringify(body),
-            });
-            if (!response.ok) {
-                const data = await response.json().catch(() => ({}));
-                setError(data.error || "Sign-in failed");
-                return;
-            }
-            const data = await response.json().catch(() => ({}));
-            window.location.assign(safeRedirect(data.redirectTo, "/edit"));
-        }
-        catch {
-            setError("Network error");
-        }
-        finally {
-            setLoading(false);
-        }
-    }
-    async function handleOAuth(provider) {
-        // OAuth is handled client-side via Supabase SDK
-        // Implementation depends on Supabase adapter (Task 11)
-        // For now, this is a placeholder that will be wired up later
-    }
-    return (_jsxs("div", { className: "mx-auto max-w-sm space-y-6", children: [capabilities.oauth && oauthProviders.length > 0 && (_jsxs("div", { className: "space-y-2", children: [oauthProviders.map((provider) => (_jsxs(Button, { type: "button", variant: "secondary", size: "md", onClick: () => handleOAuth(provider), className: "w-full", children: ["Continue with ", provider.charAt(0).toUpperCase() + provider.slice(1)] }, provider))), _jsxs("div", { className: "relative py-2", children: [_jsx("div", { className: "absolute inset-0 flex items-center", children: _jsx("div", { className: "w-full border-t border-base-200" }) }), _jsx("div", { className: "relative flex justify-center text-xs", children: _jsx("span", { className: "bg-base px-2 text-base-contrast-light", children: "or" }) })] })] })), _jsxs("form", { onSubmit: handlePasswordSubmit, className: "space-y-4", children: [capabilities.emailPassword && (_jsxs("div", { children: [_jsx("label", { htmlFor: "email", className: "mb-1.5 block text-sm font-medium text-base-contrast", children: "Email" }), _jsx("input", { id: "email", type: "email", value: email, onChange: (e) => setEmail(e.target.value), required: true, autoComplete: "email", className: "w-full rounded border border-base-200 bg-base px-3 py-2 text-sm text-base-contrast focus:border-base-contrast focus:outline-none focus:ring-1 focus:ring-base-contrast" })] })), _jsx(PasswordInput, { label: "Password", value: password, onChange: setPassword, autoComplete: "current-password" }), error && (_jsx("p", { className: "text-sm text-red-600", children: error })), _jsx(Button, { type: "submit", variant: "primary", size: "md", isLoading: loading, loadingLabel: "Signing in...", className: "w-full", children: "Sign In" })] })] }));
-}

package/dist/components/shell/EditorModal.js

@@ -1,43 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useId, useRef } from "react";
-import { createPortal } from "react-dom";
-import { RemoveIcon } from "../shared/icons";
-import { IconButton } from "../shared/IconButton";
-import { useFocusTrap } from "../../hooks/useFocusTrap";
-import { cn } from "../../lib/cn";
-export function EditorModal({ isOpen, onClose, title, blocking = false, size = "standard", noPadding = false, children }) {
-    const panelRef = useRef(null);
-    const titleId = useId();
-    useFocusTrap(panelRef, isOpen);
-    useEffect(() => {
-        if (!isOpen || blocking)
-            return;
-        const handleKeyDown = (e) => {
-            if (e.key === "Escape")
-                onClose();
-        };
-        document.addEventListener("keydown", handleKeyDown);
-        return () => document.removeEventListener("keydown", handleKeyDown);
-    }, [isOpen, blocking, onClose]);
-    useEffect(() => {
-        if (!isOpen)
-            return;
-        const original = document.body.style.overflow;
-        document.body.style.overflow = "hidden";
-        return () => {
-            document.body.style.overflow = original;
-        };
-    }, [isOpen]);
-    if (!isOpen)
-        return null;
-    return createPortal(_jsx("div", { "data-testid": "modal-backdrop", className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50", onMouseDown: blocking
-            ? undefined
-            : (e) => {
-                if (e.target === e.currentTarget)
-                    onClose();
-            }, children: _jsxs("div", { ref: panelRef, role: "dialog", "aria-modal": "true", "aria-labelledby": titleId, className: cn("mx-4 w-full rounded-lg bg-base shadow-lg", size === "large"
-                ? "max-w-[1400px] max-h-[900px] h-[90vh] flex flex-col"
-                : size === "settings"
-                    ? "max-w-lg flex flex-col min-h-[32rem] max-h-[calc(100vh-4rem)]"
-                    : "max-w-md"), children: [_jsxs("div", { className: "flex items-center justify-between border-b border-base-200 px-6 py-4", children: [_jsx("h3", { id: titleId, className: "text-lg font-semibold text-base-contrast", children: title }), !blocking && (_jsx(IconButton, { icon: _jsx(RemoveIcon, { size: 18 }), label: "Close modal", size: "lg", onClick: onClose, className: "rounded-md hover:bg-base-accent" }))] }), _jsx("div", { className: cn(!noPadding && "px-6 py-4", size === "large" && "flex-1 overflow-y-auto", size === "settings" && "flex-1 flex flex-col overflow-hidden"), children: children })] }) }), document.body);
-}

package/dist/components/shell/EditorModalContext.js

@@ -1,20 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { createContext, useContext, useState, useCallback } from "react";
-const EditorModalContext = createContext(null);
-export function EditorModalProvider({ children }) {
-    const [modalState, setModalState] = useState(null);
-    const openModal = useCallback((title, content) => {
-        setModalState({ title, content });
-    }, []);
-    const closeModal = useCallback(() => {
-        setModalState(null);
-    }, []);
-    return (_jsx(EditorModalContext.Provider, { value: { modalState, openModal, closeModal }, children: children }));
-}
-export function useEditorModal() {
-    const context = useContext(EditorModalContext);
-    if (!context) {
-        throw new Error("useEditorModal must be used within an EditorModalProvider");
-    }
-    return context;
-}