@debuffjp/share 0.0.0-stage → 0.9.0

package/README.md

@@ -1,3 +1,28 @@
-# Temporary Holding Version
+# @debuffjp/share
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+Make your game easy to pass around: clips of the last few seconds, the system share sheet, and "beat my run" challenge links. No dependencies, and each export can be used on its own.
+
+```ts
+import { ClipRecorder, challengeLink, clipFile, readChallenge, share } from "@debuffjp/share";
+
+// A friend opened a challenge link: play their seed
+const challenge = readChallenge<{ seed: number; score: number }>();
+if (challenge) game.random.reseed(challenge.seed);
+
+// Keep the last ~12 seconds while a run is going
+const clips = new ClipRecorder(game.canvas, { seconds: 12 });
+clips.start();
+
+// On a "share" button (share needs a click or key press)
+const clip = await clips.clip();
+await share({
+  text: `I scored ${score}. Beat it?`,
+  url: challengeLink({ seed, score }),
+  files: clip ? [clipFile(clip, "my-run")] : [],
+});
+```
+
+- `share()` opens the share sheet where there is one and copies the text and link otherwise. It returns `"shared"`, `"copied"`, `"cancelled"` or `"unsupported"` so you can show the right toast.
+- `ClipRecorder` runs two staggered `MediaRecorder`s, so start it when a run begins rather than on page load. `ClipRecorder.supported()` tells you whether to show a clip button at all.
+- Challenge data is visible in the URL. Put game state in it, never anything personal.
+- `screenshot(canvas)` and `download(blob, name)` cover "save image" buttons.

package/dist/clip.d.ts

@@ -0,0 +1,58 @@
+export interface ClipOptions {
+    /** Longest clip, in seconds. Clips are always at least half this long once recording has run that long. Default 12. */
+    seconds?: number;
+    /** Capture frame rate. Default 30. */
+    fps?: number;
+    /** Video bitrate in bits per second. Default 4 Mbps. */
+    bitrate?: number;
+    /** Preferred container types, first supported wins. Default webm (VP9, then VP8), then mp4. */
+    mimeTypes?: string[];
+}
+export interface Clip {
+    blob: Blob;
+    mimeType: string;
+    /** Suggested file extension without the dot, e.g. `webm`. */
+    extension: string;
+    /** Approximate length in seconds. */
+    seconds: number;
+}
+/**
+ * Rolling recorder for the last few seconds of a canvas, for "share that moment" buttons.
+ *
+ * A WebM file can't be trimmed by dropping its early chunks, so two recorders run staggered by half the
+ * window and restart every window. `clip()` keeps whichever has run longer, so a clip is between half and
+ * all of `seconds` long. That costs two encoders while recording: start it when a run begins, not on load.
+ *
+ * ```ts
+ * const clips = new ClipRecorder(game.canvas);
+ * clips.start();
+ * // later, on a big moment or a "share" button
+ * const clip = await clips.clip();
+ * if (clip) await share({ text: "12x combo!", files: [clipFile(clip, "squish")] });
+ * ```
+ */
+export declare class ClipRecorder {
+    private readonly canvas;
+    readonly mimeType: string | undefined;
+    private readonly seconds;
+    private readonly fps;
+    private readonly bitrate;
+    private stream;
+    private slots;
+    private timers;
+    private now;
+    constructor(canvas: HTMLCanvasElement, options?: ClipOptions);
+    /** First supported clip type, or `undefined` where this browser can't record a canvas. */
+    static supported(types?: string[]): string | undefined;
+    get recording(): boolean;
+    /** Start recording. Returns false (and does nothing) where clips aren't supported. */
+    start(): boolean;
+    /** Stop recording and drop anything buffered. */
+    stop(): void;
+    /** The recent past as a video, or `undefined` if not recording. Recording carries on afterwards. */
+    clip(): Promise<Clip | undefined>;
+    private cycle;
+}
+/** Wrap a clip as a `File` for `share({ files })` or a download. */
+export declare function clipFile(clip: Clip, name?: string): File;
+//# sourceMappingURL=clip.d.ts.map

package/dist/clip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"clip.d.ts","sourceRoot":"","sources":["../src/clip.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,WAAW;IAC1B,uHAAuH;IACvH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,sCAAsC;IACtC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,wDAAwD;IACxD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,+FAA+F;IAC/F,SAAS,CAAC,EAAE,MAAM,EAAE,CAAC;CACtB;AAED,MAAM,WAAW,IAAI;IACnB,IAAI,EAAE,IAAI,CAAC;IACX,QAAQ,EAAE,MAAM,CAAC;IACjB,6DAA6D;IAC7D,SAAS,EAAE,MAAM,CAAC;IAClB,qCAAqC;IACrC,OAAO,EAAE,MAAM,CAAC;CACjB;AAUD;;;;;;;;;;;;;;GAcG;AACH,qBAAa,YAAY;IAWrB,OAAO,CAAC,QAAQ,CAAC,MAAM;IAVzB,QAAQ,CAAC,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC;IACtC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAS;IACjC,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAS;IAC7B,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAS;IACjC,OAAO,CAAC,MAAM,CAA0B;IACxC,OAAO,CAAC,KAAK,CAAgD;IAC7D,OAAO,CAAC,MAAM,CAAuC;IACrD,OAAO,CAAC,GAAG,CAAe;IAE1B,YACmB,MAAM,EAAE,iBAAiB,EAC1C,OAAO,GAAE,WAAgB,EAO1B;IAED,0FAA0F;IAC1F,MAAM,CAAC,SAAS,CAAC,KAAK,GAAE,MAAM,EAAkB,GAAG,MAAM,GAAG,SAAS,CAIpE;IAED,IAAI,SAAS,IAAI,OAAO,CAEvB;IAED,sFAAsF;IACtF,KAAK,IAAI,OAAO,CAOf;IAED,iDAAiD;IACjD,IAAI,IAAI,IAAI,CAOX;IAED,oGAAoG;IAC9F,IAAI,IAAI,OAAO,CAAC,IAAI,GAAG,SAAS,CAAC,CActC;IAED,OAAO,CAAC,KAAK;CAoBd;AAED,oEAAoE;AACpE,wBAAgB,QAAQ,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,SAAS,GAAG,IAAI,CAExD"}

package/dist/clip.js

@@ -0,0 +1,115 @@
+const DEFAULT_TYPES = ["video/webm;codecs=vp9", "video/webm;codecs=vp8", "video/webm", "video/mp4"];
+/**
+ * Rolling recorder for the last few seconds of a canvas, for "share that moment" buttons.
+ *
+ * A WebM file can't be trimmed by dropping its early chunks, so two recorders run staggered by half the
+ * window and restart every window. `clip()` keeps whichever has run longer, so a clip is between half and
+ * all of `seconds` long. That costs two encoders while recording: start it when a run begins, not on load.
+ *
+ * ```ts
+ * const clips = new ClipRecorder(game.canvas);
+ * clips.start();
+ * // later, on a big moment or a "share" button
+ * const clip = await clips.clip();
+ * if (clip) await share({ text: "12x combo!", files: [clipFile(clip, "squish")] });
+ * ```
+ */
+export class ClipRecorder {
+    canvas;
+    mimeType;
+    seconds;
+    fps;
+    bitrate;
+    stream;
+    slots = [undefined, undefined];
+    timers = [];
+    now;
+    constructor(canvas, options = {}) {
+        this.canvas = canvas;
+        this.seconds = options.seconds ?? 12;
+        this.fps = options.fps ?? 30;
+        this.bitrate = options.bitrate ?? 4_000_000;
+        this.mimeType = ClipRecorder.supported(options.mimeTypes);
+        this.now = () => performance.now();
+    }
+    /** First supported clip type, or `undefined` where this browser can't record a canvas. */
+    static supported(types = DEFAULT_TYPES) {
+        if (typeof MediaRecorder === "undefined" || typeof HTMLCanvasElement === "undefined")
+            return undefined;
+        if (!("captureStream" in HTMLCanvasElement.prototype))
+            return undefined;
+        return types.find((t) => MediaRecorder.isTypeSupported(t));
+    }
+    get recording() {
+        return this.stream !== undefined;
+    }
+    /** Start recording. Returns false (and does nothing) where clips aren't supported. */
+    start() {
+        if (this.stream)
+            return true;
+        if (!this.mimeType)
+            return false;
+        this.stream = this.canvas.captureStream(this.fps);
+        this.cycle(0);
+        this.timers.push(setTimeout(() => this.cycle(1), (this.seconds * 1000) / 2));
+        return true;
+    }
+    /** Stop recording and drop anything buffered. */
+    stop() {
+        for (const t of this.timers)
+            clearTimeout(t);
+        this.timers = [];
+        for (const slot of this.slots)
+            if (slot && slot.recorder.state !== "inactive")
+                slot.recorder.stop();
+        this.slots = [undefined, undefined];
+        for (const track of this.stream?.getTracks() ?? [])
+            track.stop();
+        this.stream = undefined;
+    }
+    /** The recent past as a video, or `undefined` if not recording. Recording carries on afterwards. */
+    async clip() {
+        const at = this.now();
+        const live = this.slots.filter((s) => s !== undefined);
+        if (!live.length || !this.mimeType)
+            return undefined;
+        const oldest = live.reduce((a, b) => (a.started <= b.started ? a : b));
+        const index = this.slots.indexOf(oldest);
+        const mimeType = this.mimeType;
+        const blob = await new Promise((resolve) => {
+            oldest.recorder.onstop = () => resolve(new Blob(oldest.chunks, { type: mimeType.split(";")[0] ?? mimeType }));
+            oldest.recorder.stop();
+        });
+        // Restart the slot we took so the rolling window keeps going.
+        if (this.stream)
+            this.cycle(index);
+        return { blob, mimeType, extension: mimeType.includes("mp4") ? "mp4" : "webm", seconds: (at - oldest.started) / 1000 };
+    }
+    cycle(index) {
+        if (!this.stream || !this.mimeType)
+            return;
+        const previous = this.slots[index];
+        if (previous && previous.recorder.state !== "inactive") {
+            previous.recorder.onstop = null;
+            previous.recorder.stop();
+        }
+        const recorder = new MediaRecorder(this.stream, { mimeType: this.mimeType, videoBitsPerSecond: this.bitrate });
+        const slot = { recorder, chunks: [], started: this.now() };
+        recorder.ondataavailable = (e) => {
+            if (e.data.size)
+                slot.chunks.push(e.data);
+        };
+        recorder.start(1000);
+        this.slots[index] = slot;
+        const timer = setTimeout(() => {
+            this.timers = this.timers.filter((t) => t !== timer);
+            this.cycle(index);
+        }, this.seconds * 1000);
+        this.timers.push(timer);
+    }
+}
+/** Wrap a clip as a `File` for `share({ files })` or a download. */
+export function clipFile(clip, name = "clip") {
+    return new File([clip.blob], `${name}.${clip.extension}`, { type: clip.blob.type });
+}
+//# sourceMappingURL=clip.js.map

package/dist/clip.js.map

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

package/dist/index.d.ts

@@ -0,0 +1,4 @@
+export { type Clip, type ClipOptions, ClipRecorder, clipFile } from "./clip.js";
+export { CHALLENGE_PARAM, type ChallengeData, challengeLink, readChallenge } from "./link.js";
+export { download, type ShareData, type ShareResult, screenshot, share } from "./share.js";
+//# 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,OAAO,EAAE,KAAK,IAAI,EAAE,KAAK,WAAW,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAChF,OAAO,EAAE,eAAe,EAAE,KAAK,aAAa,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AAC9F,OAAO,EAAE,QAAQ,EAAE,KAAK,SAAS,EAAE,KAAK,WAAW,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC"}

package/dist/index.js

@@ -0,0 +1,4 @@
+export { ClipRecorder, clipFile } from "./clip.js";
+export { CHALLENGE_PARAM, challengeLink, readChallenge } from "./link.js";
+export { download, screenshot, share } from "./share.js";
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAA+B,YAAY,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAChF,OAAO,EAAE,eAAe,EAAsB,aAAa,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AAC9F,OAAO,EAAE,QAAQ,EAAoC,UAAU,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC"}

package/dist/link.d.ts

@@ -0,0 +1,18 @@
+/** Anything JSON can hold: a seed, a level id, a score to beat. */
+export type ChallengeData = Record<string, string | number | boolean | null>;
+/** Query parameter that carries a challenge. */
+export declare const CHALLENGE_PARAM = "challenge";
+/**
+ * A link that opens this game with `data` attached, for "beat my run" sharing. Pair it with a seeded
+ * `game.random` so the friend plays the same run.
+ *
+ * ```ts
+ * const url = challengeLink({ seed: game.random.seed, score: 4200 });
+ * ```
+ *
+ * The data is visible in the URL, so put game state in it, never anything personal.
+ */
+export declare function challengeLink(data: ChallengeData, base?: string): string;
+/** The challenge this page was opened with, or `undefined`. Malformed links read as no challenge. */
+export declare function readChallenge<T extends ChallengeData = ChallengeData>(href?: string): T | undefined;
+//# sourceMappingURL=link.d.ts.map

package/dist/link.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"link.d.ts","sourceRoot":"","sources":["../src/link.ts"],"names":[],"mappings":"AAAA,mEAAmE;AACnE,MAAM,MAAM,aAAa,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,IAAI,CAAC,CAAC;AAE7E,gDAAgD;AAChD,eAAO,MAAM,eAAe,cAAc,CAAC;AAc3C;;;;;;;;;GASG;AACH,wBAAgB,aAAa,CAAC,IAAI,EAAE,aAAa,EAAE,IAAI,GAAE,MAAsB,GAAG,MAAM,CAKvF;AAED,qGAAqG;AACrG,wBAAgB,aAAa,CAAC,CAAC,SAAS,aAAa,GAAG,aAAa,EAAE,IAAI,GAAE,MAAsB,GAAG,CAAC,GAAG,SAAS,CASlH"}

package/dist/link.js

@@ -0,0 +1,43 @@
+/** Query parameter that carries a challenge. */
+export const CHALLENGE_PARAM = "challenge";
+function encode(text) {
+    const bytes = new TextEncoder().encode(text);
+    let binary = "";
+    for (const b of bytes)
+        binary += String.fromCharCode(b);
+    return btoa(binary).replace(/\+/g, "-").replace(/\//g, "_").replace(/=+$/, "");
+}
+function decode(value) {
+    const binary = atob(value.replace(/-/g, "+").replace(/_/g, "/"));
+    return new TextDecoder().decode(Uint8Array.from(binary, (c) => c.charCodeAt(0)));
+}
+/**
+ * A link that opens this game with `data` attached, for "beat my run" sharing. Pair it with a seeded
+ * `game.random` so the friend plays the same run.
+ *
+ * ```ts
+ * const url = challengeLink({ seed: game.random.seed, score: 4200 });
+ * ```
+ *
+ * The data is visible in the URL, so put game state in it, never anything personal.
+ */
+export function challengeLink(data, base = location.href) {
+    const url = new URL(base);
+    url.hash = "";
+    url.searchParams.set(CHALLENGE_PARAM, encode(JSON.stringify(data)));
+    return url.toString();
+}
+/** The challenge this page was opened with, or `undefined`. Malformed links read as no challenge. */
+export function readChallenge(href = location.href) {
+    const value = new URL(href).searchParams.get(CHALLENGE_PARAM);
+    if (!value)
+        return undefined;
+    try {
+        const data = JSON.parse(decode(value));
+        return data && typeof data === "object" && !Array.isArray(data) ? data : undefined;
+    }
+    catch {
+        return undefined;
+    }
+}
+//# sourceMappingURL=link.js.map

package/dist/link.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"link.js","sourceRoot":"","sources":["../src/link.ts"],"names":[],"mappings":"AAGA,gDAAgD;AAChD,MAAM,CAAC,MAAM,eAAe,GAAG,WAAW,CAAC;AAE3C,SAAS,MAAM,CAAC,IAAY;IAC1B,MAAM,KAAK,GAAG,IAAI,WAAW,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IAC7C,IAAI,MAAM,GAAG,EAAE,CAAC;IAChB,KAAK,MAAM,CAAC,IAAI,KAAK;QAAE,MAAM,IAAI,MAAM,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC;IACxD,OAAO,IAAI,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC,OAAO,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;AACjF,CAAC;AAED,SAAS,MAAM,CAAC,KAAa;IAC3B,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,CAAC;IACjE,OAAO,IAAI,WAAW,EAAE,CAAC,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AACnF,CAAC;AAED;;;;;;;;;GASG;AACH,MAAM,UAAU,aAAa,CAAC,IAAmB,EAAE,IAAI,GAAW,QAAQ,CAAC,IAAI;IAC7E,MAAM,GAAG,GAAG,IAAI,GAAG,CAAC,IAAI,CAAC,CAAC;IAC1B,GAAG,CAAC,IAAI,GAAG,EAAE,CAAC;IACd,GAAG,CAAC,YAAY,CAAC,GAAG,CAAC,eAAe,EAAE,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IACpE,OAAO,GAAG,CAAC,QAAQ,EAAE,CAAC;AACxB,CAAC;AAED,qGAAqG;AACrG,MAAM,UAAU,aAAa,CAA0C,IAAI,GAAW,QAAQ,CAAC,IAAI;IACjG,MAAM,KAAK,GAAG,IAAI,GAAG,CAAC,IAAI,CAAC,CAAC,YAAY,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IAC9D,IAAI,CAAC,KAAK;QAAE,OAAO,SAAS,CAAC;IAC7B,IAAI,CAAC;QACH,MAAM,IAAI,GAAY,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;QAChD,OAAO,IAAI,IAAI,OAAO,IAAI,KAAK,QAAQ,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAE,IAAU,CAAC,CAAC,CAAC,SAAS,CAAC;IAC5F,CAAC;IAAC,MAAM,CAAC;QACP,OAAO,SAAS,CAAC;IACnB,CAAC;AACH,CAAC"}

package/dist/share.d.ts

@@ -0,0 +1,20 @@
+export interface ShareData {
+    title?: string;
+    text?: string;
+    /** Defaults to the current page. */
+    url?: string;
+    /** Clips or screenshots. Dropped where the share sheet can't take files. */
+    files?: File[];
+}
+/** How a `share()` call ended. */
+export type ShareResult = "shared" | "copied" | "cancelled" | "unsupported";
+/**
+ * Share with the system share sheet where there is one (phones, most desktops), otherwise copy the text
+ * and link to the clipboard. Call it from a click or key handler: browsers only allow it after user input.
+ */
+export declare function share(data: ShareData): Promise<ShareResult>;
+/** Save a blob (a clip, a screenshot) as a file download. */
+export declare function download(blob: Blob, filename: string): void;
+/** The canvas as it is now, as a PNG. Call it right after a frame renders (e.g. in `onRender`). */
+export declare function screenshot(canvas: HTMLCanvasElement): Promise<Blob | undefined>;
+//# sourceMappingURL=share.d.ts.map

package/dist/share.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"share.d.ts","sourceRoot":"","sources":["../src/share.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,SAAS;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,oCAAoC;IACpC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,4EAA4E;IAC5E,KAAK,CAAC,EAAE,IAAI,EAAE,CAAC;CAChB;AAED,kCAAkC;AAClC,MAAM,MAAM,WAAW,GAAG,QAAQ,GAAG,QAAQ,GAAG,WAAW,GAAG,aAAa,CAAC;AAE5E;;;GAGG;AACH,wBAAsB,KAAK,CAAC,IAAI,EAAE,SAAS,GAAG,OAAO,CAAC,WAAW,CAAC,CAyBjE;AAED,6DAA6D;AAC7D,wBAAgB,QAAQ,CAAC,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,GAAG,IAAI,CAO3D;AAED,mGAAmG;AACnG,wBAAgB,UAAU,CAAC,MAAM,EAAE,iBAAiB,GAAG,OAAO,CAAC,IAAI,GAAG,SAAS,CAAC,CAE/E"}

package/dist/share.js

@@ -0,0 +1,50 @@
+/**
+ * Share with the system share sheet where there is one (phones, most desktops), otherwise copy the text
+ * and link to the clipboard. Call it from a click or key handler: browsers only allow it after user input.
+ */
+export async function share(data) {
+    const url = data.url ?? location.href;
+    const nav = typeof navigator === "undefined" ? undefined : navigator;
+    if (nav?.share) {
+        const payload = { url };
+        if (data.title !== undefined)
+            payload.title = data.title;
+        if (data.text !== undefined)
+            payload.text = data.text;
+        if (data.files?.length && nav.canShare?.({ files: data.files }))
+            payload.files = data.files;
+        try {
+            await nav.share(payload);
+            return "shared";
+        }
+        catch (err) {
+            if (err instanceof DOMException && err.name === "AbortError")
+                return "cancelled";
+            // Some browsers expose share() but refuse it (permissions policy, iframes): fall through to copy.
+        }
+    }
+    if (nav?.clipboard?.writeText) {
+        try {
+            await nav.clipboard.writeText([data.text, url].filter(Boolean).join(" "));
+            return "copied";
+        }
+        catch {
+            // Clipboard blocked too.
+        }
+    }
+    return "unsupported";
+}
+/** Save a blob (a clip, a screenshot) as a file download. */
+export function download(blob, filename) {
+    const href = URL.createObjectURL(blob);
+    const a = document.createElement("a");
+    a.href = href;
+    a.download = filename;
+    a.click();
+    setTimeout(() => URL.revokeObjectURL(href), 0);
+}
+/** The canvas as it is now, as a PNG. Call it right after a frame renders (e.g. in `onRender`). */
+export function screenshot(canvas) {
+    return new Promise((resolve) => canvas.toBlob((blob) => resolve(blob ?? undefined), "image/png"));
+}
+//# sourceMappingURL=share.js.map

package/dist/share.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"share.js","sourceRoot":"","sources":["../src/share.ts"],"names":[],"mappings":"AAYA;;;GAGG;AACH,MAAM,CAAC,KAAK,UAAU,KAAK,CAAC,IAAe;IACzC,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,IAAI,QAAQ,CAAC,IAAI,CAAC;IACtC,MAAM,GAAG,GAAG,OAAO,SAAS,KAAK,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC;IACrE,IAAI,GAAG,EAAE,KAAK,EAAE,CAAC;QACf,MAAM,OAAO,GAAc,EAAE,GAAG,EAAE,CAAC;QACnC,IAAI,IAAI,CAAC,KAAK,KAAK,SAAS;YAAE,OAAO,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;QACzD,IAAI,IAAI,CAAC,IAAI,KAAK,SAAS;YAAE,OAAO,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;QACtD,IAAI,IAAI,CAAC,KAAK,EAAE,MAAM,IAAI,GAAG,CAAC,QAAQ,EAAE,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC;YAAE,OAAO,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;QAC5F,IAAI,CAAC;YACH,MAAM,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;YACzB,OAAO,QAAQ,CAAC;QAClB,CAAC;QAAC,OAAO,GAAG,EAAE,CAAC;YACb,IAAI,GAAG,YAAY,YAAY,IAAI,GAAG,CAAC,IAAI,KAAK,YAAY;gBAAE,OAAO,WAAW,CAAC;YACjF,kGAAkG;QACpG,CAAC;IACH,CAAC;IACD,IAAI,GAAG,EAAE,SAAS,EAAE,SAAS,EAAE,CAAC;QAC9B,IAAI,CAAC;YACH,MAAM,GAAG,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC;YAC1E,OAAO,QAAQ,CAAC;QAClB,CAAC;QAAC,MAAM,CAAC;YACP,yBAAyB;QAC3B,CAAC;IACH,CAAC;IACD,OAAO,aAAa,CAAC;AACvB,CAAC;AAED,6DAA6D;AAC7D,MAAM,UAAU,QAAQ,CAAC,IAAU,EAAE,QAAgB;IACnD,MAAM,IAAI,GAAG,GAAG,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;IACvC,MAAM,CAAC,GAAG,QAAQ,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;IACtC,CAAC,CAAC,IAAI,GAAG,IAAI,CAAC;IACd,CAAC,CAAC,QAAQ,GAAG,QAAQ,CAAC;IACtB,CAAC,CAAC,KAAK,EAAE,CAAC;IACV,UAAU,CAAC,GAAG,EAAE,CAAC,GAAG,CAAC,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC;AACjD,CAAC;AAED,mGAAmG;AACnG,MAAM,UAAU,UAAU,CAAC,MAAyB;IAClD,OAAO,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,OAAO,CAAC,IAAI,IAAI,SAAS,CAAC,EAAE,WAAW,CAAC,CAAC,CAAC;AACpG,CAAC"}

package/package.json

@@ -1,6 +1,46 @@
 {
   "name": "@debuffjp/share",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+  "version": "0.9.0",
+  "description": "Clips, share sheets and challenge links for debuff games",
+  "keywords": [
+    "game",
+    "gamedev",
+    "game-engine",
+    "2d",
+    "html5-game",
+    "browser-game",
+    "debuff",
+    "share",
+    "clip",
+    "social",
+    "web-share"
+  ],
+  "license": "MIT",
+  "homepage": "https://debuff.jp",
+  "bugs": "https://github.com/debuffjp/debuff/issues",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/debuffjp/debuff.git",
+    "directory": "packages/share"
+  },
+  "type": "module",
+  "sideEffects": false,
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.js"
+    }
+  },
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "scripts": {
+    "build": "tsc -b"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}