@derive-to/artifacts 0.0.0-stage → 0.6.1

package/dist/react/labels.js

@@ -0,0 +1,115 @@
+import { createContext, useContext } from "react";
+export const defaultLabels = {
+    comments: "Comments",
+    otherComments: "Other comments",
+    newComment: "New comment",
+    addComment: "Add a comment",
+    addCommentPlaceholder: "Add a comment…",
+    comment: "Comment",
+    emptyCanComment: "Select text in the artifact to comment on it.",
+    emptyReadOnly: "No comments yet.",
+    reply: "Reply",
+    replyPlaceholder: "Reply…",
+    resolve: "Resolve",
+    reopen: "Reopen",
+    resolved: "Resolved",
+    outdated: "Outdated",
+    commentBy: (name) => `Comment by ${name}`,
+    sending: "Sending…",
+    sendFailed: "Could not send. Try again.",
+    editText: "Edit text",
+    editPage: "Edit",
+    layoutHint: "Edit text. Drag handles to move or resize. Undo with Ctrl or Command + Z.",
+    moveElement: "Drag to move",
+    resizeElement: "Drag to resize",
+    dragInstructions: "Press Space to pick up. Use arrow keys to move. Press Space to drop or Escape to cancel.",
+    layoutChanged: "Layout changed. Save to keep your changes.",
+    editingText: "Editing text",
+    editHint: "Click any text to change it.",
+    cancel: "Cancel",
+    save: "Save",
+    saveFailed: "Could not save. Your changes are kept. Try again.",
+    editConflict: "A newer version is available. Copy the text you want to keep, then choose Cancel to load it.",
+    unsavedChanges: "You have unsaved changes. Save or cancel them first.",
+    previousSlide: "Previous slide",
+    nextSlide: "Next slide",
+    versionHistory: "Version history",
+    version: (n) => `v${n}`,
+    current: "Current",
+    restore: (n) => `Restore v${n}`,
+    restoreFailed: "Could not restore.",
+    people: "People",
+    viewing: (count) => `${count} viewing`,
+    you: (name) => `${name} (you)`,
+    justNow: "just now",
+    loading: "Loading…",
+    loadFailed: "Could not load. Try again.",
+    retry: "Retry",
+    slides: "Slides",
+    present: "Present",
+    exitPresentation: "Exit presentation",
+    zoomSlide: "Zoom",
+    fitSlide: "Fit",
+    panSlide: "Scroll across to read the slide.",
+    history: "History",
+    sharing: "Sharing",
+    share: "Share",
+    page: "Page",
+    kindPage: "Page",
+    kindSlides: "Slides",
+    roleOwner: "Owner",
+    roleEdit: "Can edit",
+    roleComment: "Can comment",
+    roleView: "Can view",
+    viewingVersion: (n) => `Viewing v${n}`,
+    backToCurrent: "Back to current",
+    signInToTakePart: "Sign in to vote or comment.",
+    signIn: "Sign in",
+    notFound: "This document doesn't exist, or you don't have access to it.",
+    accessRevoked: "You no longer have access to this document.",
+    spaceAccessHeading: "Who in your organization can open it",
+    spaceMember: "Everyone in the organization",
+    spaceMemberHint: "Each person gets their own role: editors edit, viewers view.",
+    spaceNone: "Only people invited",
+    spaceNoneHint: "Members without an invite cannot find or open it.",
+    peopleHeading: "People",
+    invitePlaceholder: "Add a person by name",
+    invite: "Invite",
+    removeAccess: (name) => `Remove ${name}`,
+    createdIt: "Created it",
+    linkHeading: "Share link",
+    linkOff: "Off",
+    linkOffHint: "Only your organization and invited people.",
+    linkViewer: "Anyone with the link can view",
+    linkViewerHint: "Signed-out readers can only read.",
+    linkCommenter: "Signed-in holders can comment",
+    linkEditor: "Signed-in holders can edit",
+    copyLink: "Copy link",
+    copied: "Copied",
+    copyFailed: "Copy it by hand",
+    resetLink: "Reset link",
+    resetLinkHint: "Everyone holding the current link loses access.",
+    roleName: (role) => ({ viewer: "Can view", commenter: "Can comment", editor: "Can edit", owner: "Owner" })[role],
+    searchDocuments: "Search documents",
+    filterAll: "All",
+    filterMine: "Mine",
+    filterShared: "Shared with me",
+    noDocuments: "No documents here yet.",
+    openComments: (count) => (count === 1 ? "1 open" : `${count} open`),
+    selected: (count) => `${count} selected`,
+    deleteSelected: "Delete",
+    confirmDelete: (count) => `Delete ${count === 1 ? "this document" : `${count} documents`}? This can't be undone.`,
+    deleteFailed: (count) => `${count === 1 ? "1 document wasn't" : `${count} documents weren't`} deleted. Try again.`,
+    clearSelection: "Clear",
+    loadMore: "Show more",
+    slideNumber: (index) => `Slide ${index}`,
+    slideOf: (index, count) => `Slide ${index} of ${count}`,
+    selectedSlide: (index, count) => `Selected ${index} / ${count}`,
+};
+export const LabelsContext = createContext({
+    labels: defaultLabels,
+    locale: undefined,
+});
+/** The labels and locale the nearest `ArtifactProvider` was given. */
+export const useLabels = () => useContext(LabelsContext);
+//# sourceMappingURL=labels.js.map

package/dist/react/labels.js.map

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

package/dist/react/layout-surface.d.ts

@@ -0,0 +1,29 @@
+import { type ReactNode } from "react";
+import { type ArtifactLayout } from "../protocol/index.js";
+import { type LayoutEditorOptions } from "../runtime/index.js";
+export interface LayoutSurfaceHandle {
+    begin(): void;
+    current(): ArtifactLayout | undefined;
+    arrange(layout: ArtifactLayout): void;
+    finish(discard?: boolean): ArtifactLayout | undefined;
+}
+export interface ArtifactLayoutSurfaceProps {
+    /** Host-owned components only. Untrusted artifact HTML stays in ArtifactStage's sandbox. */
+    parts: ReadonlyMap<string, ReactNode>;
+    layout: ArtifactLayout;
+    labels?: {
+        move: string;
+        resize: string;
+        instructions: string;
+        changed?: string | undefined;
+    };
+    className?: string;
+    editing?: boolean;
+    onChange?: LayoutEditorOptions["onChange"];
+    onDrop?: LayoutEditorOptions["onDrop"];
+    onHistory?: LayoutEditorOptions["onHistory"];
+}
+/** Native host widgets use the same direct editor as sandboxed HTML.
+ * Portals keep component state alive when their opaque container changes regions. */
+export declare const ArtifactLayoutSurface: import("react").ForwardRefExoticComponent<ArtifactLayoutSurfaceProps & import("react").RefAttributes<LayoutSurfaceHandle>>;
+//# sourceMappingURL=layout-surface.d.ts.map

package/dist/react/layout-surface.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"layout-surface.d.ts","sourceRoot":"","sources":["../../src/react/layout-surface.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,SAAS,EAKf,MAAM,OAAO,CAAA;AAEd,OAAO,EACL,KAAK,cAAc,EAMpB,MAAM,sBAAsB,CAAA;AAC7B,OAAO,EAGL,KAAK,mBAAmB,EACzB,MAAM,qBAAqB,CAAA;AAG5B,MAAM,WAAW,mBAAmB;IAClC,KAAK,IAAI,IAAI,CAAA;IACb,OAAO,IAAI,cAAc,GAAG,SAAS,CAAA;IACrC,OAAO,CAAC,MAAM,EAAE,cAAc,GAAG,IAAI,CAAA;IACrC,MAAM,CAAC,OAAO,CAAC,EAAE,OAAO,GAAG,cAAc,GAAG,SAAS,CAAA;CACtD;AACD,MAAM,WAAW,0BAA0B;IACzC,4FAA4F;IAC5F,KAAK,EAAE,WAAW,CAAC,MAAM,EAAE,SAAS,CAAC,CAAA;IACrC,MAAM,EAAE,cAAc,CAAA;IACtB,MAAM,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAC;QAAC,YAAY,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;KAAE,CAAA;IAC7F,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,QAAQ,CAAC,EAAE,mBAAmB,CAAC,UAAU,CAAC,CAAA;IAC1C,MAAM,CAAC,EAAE,mBAAmB,CAAC,QAAQ,CAAC,CAAA;IACtC,SAAS,CAAC,EAAE,mBAAmB,CAAC,WAAW,CAAC,CAAA;CAC7C;AAiDD;qFACqF;AACrF,eAAO,MAAM,qBAAqB,4HAwEjC,CAAA"}

package/dist/react/layout-surface.js

@@ -0,0 +1,111 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useImperativeHandle, useLayoutEffect, useRef, useState, } from "react";
+import { createPortal } from "react-dom";
+import { ELEMENT_ATTRIBUTE, HANDLE_ATTRIBUTE, LAYOUT_ATTRIBUTE, REGION_ATTRIBUTE, serializeLayout, } from "../protocol/index.js";
+import { createLayoutEditor, } from "../runtime/index.js";
+import { useLatest } from "./use-latest.js";
+const mountRegions = (host, source, stable) => {
+    const document = host.ownerDocument;
+    const metadata = document.createElement("script");
+    metadata.type = "application/json";
+    metadata.setAttribute(LAYOUT_ATTRIBUTE, "");
+    metadata.textContent = source;
+    const nodes = new Map();
+    const layout = JSON.parse(source);
+    const regions = layout.regions.map((region) => {
+        const node = document.createElement("div");
+        node.setAttribute(REGION_ATTRIBUTE, region.id);
+        for (const entry of layout.elements.filter((item) => item.region === region.id)) {
+            const element = stable.get(entry.id) ?? document.createElement("div");
+            element.setAttribute(ELEMENT_ATTRIBUTE, entry.id);
+            element.setAttribute("data-anchor", entry.id);
+            nodes.set(entry.id, element);
+            node.append(element);
+        }
+        return node;
+    });
+    host.append(metadata, ...regions);
+    return {
+        nodes,
+        remove: () => {
+            metadata.remove();
+            for (const region of regions)
+                region.remove();
+        },
+    };
+};
+const retainFocus = (host) => {
+    const focused = host.ownerDocument.activeElement;
+    const id = host.contains(focused) ? focused?.getAttribute(HANDLE_ATTRIBUTE) : null;
+    const kind = focused?.classList.contains("oa-layout-move") ? "move" : "resize";
+    return () => {
+        if (!id)
+            return;
+        const handle = [...host.querySelectorAll(`.oa-layout-${kind}`)].find((node) => node.getAttribute(HANDLE_ATTRIBUTE) === id);
+        handle?.focus({ preventScroll: true });
+    };
+};
+/** Native host widgets use the same direct editor as sandboxed HTML.
+ * Portals keep component state alive when their opaque container changes regions. */
+export const ArtifactLayoutSurface = forwardRef(function ArtifactLayoutSurface({ parts, layout, labels, className, editing = false, onChange, onDrop, onHistory }, ref) {
+    const root = useRef(null);
+    const editor = useRef(null);
+    const [containers, setContainers] = useState(new Map());
+    const stableContainers = useRef(new Map());
+    const cleanup = useRef(undefined);
+    const callbacks = useLatest({ onChange, onDrop, onHistory });
+    const source = serializeLayout(layout);
+    const hasHistory = onHistory !== undefined;
+    const activeHistory = useRef(hasHistory);
+    const latestEditing = useLatest(editing);
+    const latestLabels = useLatest(labels);
+    useImperativeHandle(ref, () => ({
+        current: () => editor.current?.current(),
+        arrange: (next) => editor.current?.arrange(next),
+        begin: () => editor.current?.begin(latestLabels.current),
+        finish: (discard = false) => editor.current?.finish(discard),
+    }), [latestLabels]);
+    useLayoutEffect(() => {
+        const host = root.current;
+        if (!host)
+            return;
+        if (editor.current &&
+            serializeLayout(editor.current.current()) === source &&
+            activeHistory.current === hasHistory)
+            return;
+        const document = host.ownerDocument;
+        const restoreFocus = retainFocus(host);
+        cleanup.current?.();
+        const mounted = mountRegions(host, source, stableContainers.current);
+        stableContainers.current = mounted.nodes;
+        editor.current = createLayoutEditor(document, host, {
+            onChange: (next) => callbacks.current.onChange?.(next),
+            onDrop: (drop) => callbacks.current.onDrop?.(drop) ?? false,
+            ...(hasHistory && {
+                onHistory: (action) => callbacks.current.onHistory?.(action),
+            }),
+        });
+        activeHistory.current = hasHistory;
+        if (latestEditing.current)
+            editor.current?.begin(latestLabels.current);
+        restoreFocus();
+        setContainers(mounted.nodes);
+        cleanup.current = () => {
+            editor.current?.destroy();
+            editor.current = null;
+            mounted.remove();
+        };
+    }, [source, hasHistory, callbacks, latestLabels, latestEditing]);
+    useLayoutEffect(() => () => cleanup.current?.(), []);
+    useLayoutEffect(() => {
+        if (editing)
+            editor.current?.begin(latestLabels.current);
+        else
+            editor.current?.finish(false);
+    }, [editing, latestLabels]);
+    return (_jsxs(_Fragment, { children: [_jsx("div", { ref: root, className: className }), [...parts].map(([id, child]) => {
+                const container = containers.get(id);
+                return container ? createPortal(child, container, id) : null;
+            })] }));
+});
+//# sourceMappingURL=layout-surface.js.map

package/dist/react/layout-surface.js.map

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

package/dist/react/mention-list.d.ts

@@ -0,0 +1,12 @@
+import type { Person } from "./context.js";
+export interface MentionListProps {
+    /** The composer's id; option ids derive from it for aria-activedescendant. */
+    id: string;
+    people: Person[];
+    active: number;
+    onPick(person: Person): void;
+}
+/** People matching what follows "@", under the comment box. Focus stays in the textarea
+ *  (aria-activedescendant), so options take no tab stop. */
+export declare const MentionList: ({ id, people, active, onPick }: MentionListProps) => import("react").JSX.Element;
+//# sourceMappingURL=mention-list.d.ts.map

package/dist/react/mention-list.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mention-list.d.ts","sourceRoot":"","sources":["../../src/react/mention-list.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,cAAc,CAAA;AAG1C,MAAM,WAAW,gBAAgB;IAC/B,8EAA8E;IAC9E,EAAE,EAAE,MAAM,CAAA;IACV,MAAM,EAAE,MAAM,EAAE,CAAA;IAChB,MAAM,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI,CAAA;CAC7B;AAED;4DAC4D;AAC5D,eAAO,MAAM,WAAW,mCAAoC,gBAAgB,gCAyB3E,CAAA"}

package/dist/react/mention-list.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useLabels } from "./labels.js";
+/** People matching what follows "@", under the comment box. Focus stays in the textarea
+ *  (aria-activedescendant), so options take no tab stop. */
+export const MentionList = ({ id, people, active, onPick }) => {
+    const { labels } = useLabels();
+    return (_jsx("div", { id: `${id}-people`, className: "oa-mentions", role: "listbox", "aria-label": labels.people, children: people.map((person, index) => (_jsx("div", { tabIndex: -1, id: `${id}-person-${index}`, 
+            // oxlint-disable-next-line jsx-a11y/prefer-tag-over-role -- options of the listbox above
+            role: "option", "aria-selected": index === active, className: "oa-mention-option", 
+            // Keep focus in the textarea: pick on mousedown, before it would blur.
+            onMouseDown: (event) => {
+                event.preventDefault();
+                onPick(person);
+            }, children: person.name }, person.id))) }));
+};
+//# sourceMappingURL=mention-list.js.map

package/dist/react/mention-list.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mention-list.js","sourceRoot":"","sources":["../../src/react/mention-list.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AAUvC;4DAC4D;AAC5D,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAoB,EAAE,EAAE;IAC9E,MAAM,EAAE,MAAM,EAAE,GAAG,SAAS,EAAE,CAAA;IAC9B,OAAO,CAEL,cAAK,EAAE,EAAE,GAAG,EAAE,SAAS,EAAE,SAAS,EAAC,aAAa,EAAC,IAAI,EAAC,SAAS,gBAAa,MAAM,CAAC,MAAM,YACtF,MAAM,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC,CAC7B,cAEE,QAAQ,EAAE,CAAC,CAAC,EACZ,EAAE,EAAE,GAAG,EAAE,WAAW,KAAK,EAAE;YAC3B,yFAAyF;YACzF,IAAI,EAAC,QAAQ,mBACE,KAAK,KAAK,MAAM,EAC/B,SAAS,EAAC,mBAAmB;YAC7B,uEAAuE;YACvE,WAAW,EAAE,CAAC,KAAK,EAAE,EAAE;gBACrB,KAAK,CAAC,cAAc,EAAE,CAAA;gBACtB,MAAM,CAAC,MAAM,CAAC,CAAA;YAChB,CAAC,YAEA,MAAM,CAAC,IAAI,IAbP,MAAM,CAAC,EAAE,CAcV,CACP,CAAC,GACE,CACP,CAAA;AACH,CAAC,CAAA"}

package/dist/react/native-stage.d.ts

@@ -0,0 +1,8 @@
+import { type ReactNode } from "react";
+/** Trusted host widgets join the same comment rail without executing artifact HTML. */
+export declare const ArtifactNativeStage: ({ children, version, className, }: {
+    children: ReactNode;
+    version?: number;
+    className?: string;
+}) => import("react").JSX.Element;
+//# sourceMappingURL=native-stage.d.ts.map

package/dist/react/native-stage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"native-stage.d.ts","sourceRoot":"","sources":["../../src/react/native-stage.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAqB,MAAM,OAAO,CAAA;AAIzD,uFAAuF;AACvF,eAAO,MAAM,mBAAmB,sCAI7B;IACD,QAAQ,EAAE,SAAS,CAAA;IACnB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,gCA2CA,CAAA"}

package/dist/react/native-stage.js

@@ -0,0 +1,41 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useRef } from "react";
+import { createAnchoring } from "../runtime/index.js";
+import { useArtifact } from "./context.js";
+/** Trusted host widgets join the same comment rail without executing artifact HTML. */
+export const ArtifactNativeStage = ({ children, version, className, }) => {
+    const root = useRef(null);
+    const mountedVersion = useRef(version);
+    const anchoring = useRef(null);
+    const { threads, activeThreadId, setSelection, setPositions, activate, setView } = useArtifact();
+    useEffect(() => {
+        if (!root.current)
+            return undefined;
+        const controller = createAnchoring(root.current, {
+            selection: ({ quote, rect }) => setSelection(quote && rect ? { quote, rect } : null),
+            positions: ({ positions, missing }) => setPositions(new Map(positions.map((entry) => [entry.id, entry.rect])), new Set(missing)),
+            activate,
+        }, true);
+        mountedVersion.current = version;
+        anchoring.current = controller;
+        setView(null, version);
+        return () => {
+            controller.destroy();
+            anchoring.current = null;
+        };
+    }, [activate, setSelection, setPositions, setView, version]);
+    useEffect(() => {
+        if (version !== mountedVersion.current)
+            return;
+        anchoring.current?.setAnchors(threads.flatMap((thread) => {
+            const quote = thread.comments[0]?.quote;
+            return quote ? [{ id: thread.id, quote, quiet: thread.state !== "open" }] : [];
+        }));
+    }, [threads, version]);
+    useEffect(() => {
+        if (activeThreadId)
+            anchoring.current?.focus(activeThreadId)?.scrollIntoView({ block: "nearest" });
+    }, [activeThreadId]);
+    return (_jsx("div", { ref: root, className: className, children: children }));
+};
+//# sourceMappingURL=native-stage.js.map

package/dist/react/native-stage.js.map

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

package/dist/react/overlays.css

@@ -0,0 +1,43 @@
+.oa-cursors {
+  position: absolute;
+  inset: 0;
+  pointer-events: none;
+  overflow: hidden;
+}
+.oa-cursor {
+  position: absolute;
+  top: 0;
+  left: 0;
+  transition: transform 120ms linear;
+}
+.oa-cursor::before {
+  content: "";
+  display: block;
+  width: 10px;
+  height: 10px;
+  border-radius: 50% 50% 50% 0;
+  background: var(--oa-cursor);
+}
+.oa-cursor-label {
+  display: inline-block;
+  margin: 2px 0 0 8px;
+  padding: 2px 6px;
+  border-radius: 4px;
+  background: var(--oa-cursor);
+  color: var(--oa-accent-text);
+  font: 600 11px / 1.3 var(--oa-font);
+  white-space: nowrap;
+}
+
+.oa-selection-button {
+  position: absolute;
+  z-index: 2;
+  padding: 4px 10px;
+  border: 0;
+  border-radius: 999px;
+  background: var(--oa-accent);
+  color: var(--oa-accent-text);
+  font: 600 12px / 1.4 var(--oa-font);
+  box-shadow: var(--oa-shadow);
+  cursor: pointer;
+}