@openrails/contentkit-ui 0.0.0-stage → 0.68.0

package/dist/react/slot.d.ts

@@ -0,0 +1,102 @@
+import { AspectRatio } from '../client/aspect.js';
+import { ContentKitClient } from '../client/client.js';
+import { Size } from '../client/crop.js';
+import { ContentKitError } from '../client/errors.js';
+import { Edit, FileInfo, ReadResult, RefBody } from '../client/generated/wire.js';
+import { CropSource } from '../client/image.js';
+import { Progress } from '../client/media/client.js';
+import { PublicPreset } from '../client/public.js';
+import { Rendition } from '../client/rendition.js';
+export interface SlotImageOptions {
+    ref: RefBody;
+    /** The upload path, e.g. "cover" or "avatar". */
+    path: string;
+    /** The public preset showing the upload. */
+    image?: PublicPreset | null;
+    /** An editor read of the item the host already has; skips the fetch. */
+    read?: ReadResult | null;
+    /** Overrides the provider's client; without one only a supplied read shows. */
+    client?: ContentKitClient | null;
+}
+export interface UseSlotImage {
+    /** The upload at path as an editor reads it; null when there is none. */
+    file: FileInfo | null;
+    /** The current published files; empty until the worker publishes them. */
+    renditions: Rendition[];
+    /** "W:H": the preset's, else "1:1". */
+    aspect: AspectRatio;
+    loading: boolean;
+    error?: ContentKitError;
+    reload: () => void;
+    /** Replaces the upload after a save without refetching. */
+    set: (file: FileInfo | null) => void;
+}
+/** An upload path's state (an editor read) and its public image. */
+export declare function useSlotImage(o: SlotImageOptions): UseSlotImage;
+export type SlotCropMode = "new" | "recrop";
+/** edit: null is the centred crop at the aspect, unrotated. */
+export type SlotCropState = {
+    status: "idle";
+} | {
+    status: "decoding";
+} | {
+    status: "cropping";
+    source: CropSource;
+    edit: Edit | null;
+    mode: SlotCropMode;
+} | {
+    status: "saving";
+    source: CropSource;
+    edit: Edit | null;
+    mode: SlotCropMode;
+    progress?: Progress;
+    rendering?: boolean;
+} | {
+    status: "done";
+    file: FileInfo;
+} | {
+    status: "error";
+    error: ContentKitError;
+    source?: CropSource;
+    edit?: Edit | null;
+    mode?: SlotCropMode;
+};
+export interface SlotCropOptions {
+    ref: RefBody;
+    /** The upload path, e.g. "avatar". */
+    path: string;
+    /** The current upload (useSlotImage's file): its path, size and edit for recrop(). */
+    file?: FileInfo | null;
+    /** The output's "W:H"; default "1:1". */
+    aspect?: AspectRatio;
+    /** "reject": refuse animated images before uploading (the preset's Image.Animation). */
+    animation?: "reject";
+    onSaved?: (file: FileInfo) => void;
+    /** Replaces decodeImage (tests, custom decoders). */
+    decode?: (file: File) => Promise<CropSource>;
+    /** How long save() waits for the worker to render. Default 120 s. */
+    renderTimeout?: number;
+    /** Every failed decode or save (aborts excepted); the state shows it too. */
+    onError?: (e: ContentKitError, operation: "slot.decode" | "slot.save") => void;
+    /** Overrides the provider's client. */
+    client?: ContentKitClient;
+}
+export type UseSlotCrop = SlotCropState & {
+    aspect: AspectRatio;
+    /** The output's size in source pixels (crop, then rotation) while a source is open. */
+    cropped?: Size;
+    /** Opens a picked file for cropping. */
+    pick: (file: File) => Promise<void>;
+    /** Re-crops the committed upload; false when there is none. */
+    canRecrop: boolean;
+    recrop: () => Promise<void>;
+    setEdit: (e: Edit | null) => void;
+    /** Uploads the file and puts it with the edit (new), or edits the upload (recrop); then waits for the render. */
+    save: (edit?: Edit | null) => Promise<FileInfo | undefined>;
+    /** Aborts a save and closes the source. */
+    cancel: () => void;
+};
+/** The edit's output size: its crop (or the centred crop at aspect), turned. */
+export declare function editOutput(source: Size, edit: Edit | null | undefined, shape: AspectRatio): Size;
+/** pick → crop → save → done, and recrop() → crop → save for an existing upload. */
+export declare function useSlotCrop(o: SlotCropOptions): UseSlotCrop;

package/dist/react/slot.js

@@ -0,0 +1,181 @@
+import { ContentKitError as e, toContentKitError as t } from "../client/errors.js";
+import { publicRenditions as n } from "../client/public.js";
+import { ratio as r } from "../client/aspect.js";
+import { samePath as i, stem as a } from "../client/media/client.js";
+import { centeredCrop as o, constrainCrop as s, editedSize as c, rotation as l, sameEdit as u } from "../client/crop.js";
+import { useContentKitClient as d } from "./context.js";
+import { decodeImage as f, isAnimatedImage as p } from "../client/image.js";
+import { withUpload as m } from "./store.js";
+import { useMediaRead as h } from "./read.js";
+import { useCallback as g, useEffect as _, useMemo as v, useRef as y, useState as b } from "react";
+//#region src/react/slot.ts
+function x(e) {
+	let t = h(e.ref, {
+		editor: !0,
+		prefix: a(e.path),
+		read: e.read,
+		client: e.client
+	}), r = t.read, o = r?.files.find((t) => t.upload && i(t.path, e.path)) ?? null, { path: s } = e, c = t.set, l = g((e) => c(m(r, s, e)), [
+		r,
+		s,
+		c
+	]);
+	return {
+		file: o,
+		renditions: v(() => {
+			if (!r) return n(e.image);
+			let t = r.public?.find((t) => i(t.from, s) && (!e.image || t.preset === e.image.preset));
+			return n(t);
+		}, [
+			r,
+			e.image,
+			s
+		]),
+		aspect: e.image?.aspect || "1:1",
+		loading: t.loading,
+		error: t.error,
+		reload: t.reload,
+		set: l
+	};
+}
+function S(e, t, n) {
+	let i = r(n), a = l(t?.rotate ?? 0), u = t?.crop ? s(t.crop, e, i, a) : o(e, i, a);
+	return c({
+		width: u.w,
+		height: u.h
+	}, a);
+}
+function C(n) {
+	let { media: r } = d(n.client), [i, a] = b({ status: "idle" }), o = y(i);
+	o.current = i;
+	let s = y(null), c = y(0), l = y(n);
+	l.current = n;
+	let m = n.aspect ?? "1:1", h = g((e) => {
+		let t = o.current, n = "source" in t ? t.source : void 0, r = "source" in e ? e.source : void 0;
+		n && n !== r && n.revoke?.(), o.current = e, a(e);
+	}, []);
+	_(() => () => {
+		s.current?.abort();
+		let e = o.current;
+		"source" in e && e.source?.revoke?.();
+	}, []);
+	let x = g(async (t, n, r) => {
+		s.current?.abort(), s.current = null;
+		let i = ++c.current;
+		h({ status: "decoding" });
+		try {
+			let e = await t();
+			if (i !== c.current) return e.revoke?.();
+			h({
+				status: "cropping",
+				source: e,
+				edit: r,
+				mode: n
+			});
+		} catch (t) {
+			if (i !== c.current) return;
+			let n = t instanceof e ? t : new e("decode", t instanceof Error ? t.message : String(t), { cause: t });
+			h({
+				status: "error",
+				error: n
+			}), l.current.onError?.(n, "slot.decode");
+		}
+	}, [h]), C = g((t) => x(async () => {
+		if (l.current.animation === "reject" && await p(t)) throw new e("animation_not_allowed", "animated images are not allowed here", { status: 422 });
+		return (l.current.decode ?? f)(t);
+	}, "new", null), [x]), w = !!n.file && !n.file.staged && (n.file.size ?? 0) > 0 && n.file.type.startsWith("image/"), T = g(async () => {
+		let e = l.current.file;
+		e && await x(() => r.editorView(l.current.ref, e.path), "recrop", e.edit ?? null);
+	}, [r, x]), E = g((e) => {
+		let t = o.current;
+		t.status === "cropping" ? u(t.edit, e) || h({
+			...t,
+			edit: e
+		}) : t.status === "error" && t.source && t.mode && h({
+			status: "cropping",
+			source: t.source,
+			edit: e,
+			mode: t.mode
+		});
+	}, [h]), D = g(async (e) => {
+		e !== void 0 && E(e);
+		let n = o.current;
+		if (!(n.status === "cropping" || n.status === "error" && n.source && n.mode)) return;
+		let { source: i, mode: a } = n, c = n.edit ?? null, { ref: u, path: d, renderTimeout: f } = l.current, p = s.current = new AbortController(), m = (e) => p === s.current && h({
+			status: "saving",
+			source: i,
+			edit: c,
+			mode: a,
+			progress: e,
+			rendering: e?.phase === "processing"
+		});
+		m();
+		try {
+			let e;
+			if (a === "new") e = await r.put(i.file, {
+				ref: u,
+				path: d,
+				edit: c,
+				signal: p.signal,
+				timeout: f,
+				onProgress: m
+			});
+			else {
+				let t = l.current.file?.path ?? d;
+				await r.commit(u, [{
+					op: "edit",
+					path: t,
+					...c ? { edit: c } : {}
+				}], { signal: p.signal }), m({
+					phase: "processing",
+					loaded: 0,
+					total: 0
+				}), e = await r.waitFor(u, t, {
+					signal: p.signal,
+					timeout: f
+				});
+			}
+			return p === s.current ? (h({
+				status: "done",
+				file: e
+			}), l.current.onSaved?.(e), e) : void 0;
+		} catch (e) {
+			if (p !== s.current) return;
+			let n = t(e);
+			h(n.code === "aborted" ? {
+				status: "cropping",
+				source: i,
+				edit: c,
+				mode: a
+			} : {
+				status: "error",
+				error: n,
+				source: i,
+				edit: c,
+				mode: a
+			}), n.code !== "aborted" && l.current.onError?.(n, "slot.save");
+			return;
+		}
+	}, [
+		r,
+		h,
+		E
+	]), O = g(() => {
+		c.current++, s.current?.abort(), s.current = null, h({ status: "idle" });
+	}, [h]), k = v(() => "source" in i && i.source ? S(i.source, i.edit, m) : void 0, [i, m]);
+	return {
+		...i,
+		aspect: m,
+		cropped: k,
+		pick: C,
+		canRecrop: w,
+		recrop: T,
+		setEdit: E,
+		save: D,
+		cancel: O
+	};
+}
+//#endregion
+export { S as editOutput, C as useSlotCrop, x as useSlotImage };
+
+//# sourceMappingURL=slot.js.map

package/dist/react/slot.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"slot.js","names":[],"sources":["../../src/react/slot.ts"],"sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { ratio, type AspectRatio } from \"../client/aspect.js\";\nimport type { ContentKitClient } from \"../client/client.js\";\nimport { centeredCrop, constrainCrop, editedSize, rotation, sameEdit, type Size } from \"../client/crop.js\";\nimport { ContentKitError, toContentKitError } from \"../client/errors.js\";\nimport type { Edit, FileInfo, ReadResult, RefBody } from \"../client/generated/wire.js\";\nimport { decodeImage, isAnimatedImage, type CropSource } from \"../client/image.js\";\nimport { samePath, stem, type Progress } from \"../client/media/client.js\";\nimport { publicRenditions, type PublicPreset } from \"../client/public.js\";\nimport type { Rendition } from \"../client/rendition.js\";\nimport { useContentKitClient } from \"./context.js\";\nimport { useMediaRead } from \"./read.js\";\nimport { withUpload } from \"./store.js\";\n\nexport interface SlotImageOptions {\n  ref: RefBody;\n  /** The upload path, e.g. \"cover\" or \"avatar\". */\n  path: string;\n  /** The public preset showing the upload. */\n  image?: PublicPreset | null;\n  /** An editor read of the item the host already has; skips the fetch. */\n  read?: ReadResult | null;\n  /** Overrides the provider's client; without one only a supplied read shows. */\n  client?: ContentKitClient | null;\n}\n\nexport interface UseSlotImage {\n  /** The upload at path as an editor reads it; null when there is none. */\n  file: FileInfo | null;\n  /** The current published files; empty until the worker publishes them. */\n  renditions: Rendition[];\n  /** \"W:H\": the preset's, else \"1:1\". */\n  aspect: AspectRatio;\n  loading: boolean;\n  error?: ContentKitError;\n  reload: () => void;\n  /** Replaces the upload after a save without refetching. */\n  set: (file: FileInfo | null) => void;\n}\n\n/** An upload path's state (an editor read) and its public image. */\nexport function useSlotImage(o: SlotImageOptions): UseSlotImage {\n  const r = useMediaRead(o.ref, { editor: true, prefix: stem(o.path), read: o.read, client: o.client });\n  const read = r.read;\n  const file = read?.files.find((f) => f.upload && samePath(f.path, o.path)) ?? null;\n  const { path } = o;\n  const update = r.set;\n  const set = useCallback((f: FileInfo | null) => update(withUpload(read, path, f)), [read, path, update]);\n  const renditions = useMemo(() => {\n    if (!read) return publicRenditions(o.image);\n    const published = read.public?.find((p) => samePath(p.from, path) && (!o.image || p.preset === o.image.preset));\n    return publicRenditions(published);\n  }, [read, o.image, path]);\n  return { file, renditions, aspect: o.image?.aspect || \"1:1\", loading: r.loading, error: r.error, reload: r.reload, set };\n}\n\nexport type SlotCropMode = \"new\" | \"recrop\";\n\n/** edit: null is the centred crop at the aspect, unrotated. */\nexport type SlotCropState =\n  | { status: \"idle\" }\n  | { status: \"decoding\" }\n  | { status: \"cropping\"; source: CropSource; edit: Edit | null; mode: SlotCropMode }\n  | { status: \"saving\"; source: CropSource; edit: Edit | null; mode: SlotCropMode; progress?: Progress; rendering?: boolean }\n  | { status: \"done\"; file: FileInfo }\n  | { status: \"error\"; error: ContentKitError; source?: CropSource; edit?: Edit | null; mode?: SlotCropMode };\n\nexport interface SlotCropOptions {\n  ref: RefBody;\n  /** The upload path, e.g. \"avatar\". */\n  path: string;\n  /** The current upload (useSlotImage's file): its path, size and edit for recrop(). */\n  file?: FileInfo | null;\n  /** The output's \"W:H\"; default \"1:1\". */\n  aspect?: AspectRatio;\n  /** \"reject\": refuse animated images before uploading (the preset's Image.Animation). */\n  animation?: \"reject\";\n  onSaved?: (file: FileInfo) => void;\n  /** Replaces decodeImage (tests, custom decoders). */\n  decode?: (file: File) => Promise<CropSource>;\n  /** How long save() waits for the worker to render. Default 120 s. */\n  renderTimeout?: number;\n  /** Every failed decode or save (aborts excepted); the state shows it too. */\n  onError?: (e: ContentKitError, operation: \"slot.decode\" | \"slot.save\") => void;\n  /** Overrides the provider's client. */\n  client?: ContentKitClient;\n}\n\nexport type UseSlotCrop = SlotCropState & {\n  aspect: AspectRatio;\n  /** The output's size in source pixels (crop, then rotation) while a source is open. */\n  cropped?: Size;\n  /** Opens a picked file for cropping. */\n  pick: (file: File) => Promise<void>;\n  /** Re-crops the committed upload; false when there is none. */\n  canRecrop: boolean;\n  recrop: () => Promise<void>;\n  setEdit: (e: Edit | null) => void;\n  /** Uploads the file and puts it with the edit (new), or edits the upload (recrop); then waits for the render. */\n  save: (edit?: Edit | null) => Promise<FileInfo | undefined>;\n  /** Aborts a save and closes the source. */\n  cancel: () => void;\n};\n\n/** The edit's output size: its crop (or the centred crop at aspect), turned. */\nexport function editOutput(source: Size, edit: Edit | null | undefined, shape: AspectRatio): Size {\n  const aspect = ratio(shape);\n  const rot = rotation(edit?.rotate ?? 0);\n  const c = edit?.crop ? constrainCrop(edit.crop, source, aspect, rot) : centeredCrop(source, aspect, rot);\n  return editedSize({ width: c.w, height: c.h }, rot);\n}\n\n/** pick → crop → save → done, and recrop() → crop → save for an existing upload. */\nexport function useSlotCrop(o: SlotCropOptions): UseSlotCrop {\n  const { media } = useContentKitClient(o.client);\n  const [s, setS] = useState<SlotCropState>({ status: \"idle\" });\n  const cur = useRef(s);\n  cur.current = s;\n  const ctl = useRef<AbortController | null>(null);\n  const picks = useRef(0);\n  const opts = useRef(o);\n  opts.current = o;\n  const aspect = o.aspect ?? \"1:1\";\n\n  const set = useCallback((next: SlotCropState) => {\n    const prev = cur.current;\n    const src = \"source\" in prev ? prev.source : undefined;\n    const keep = \"source\" in next ? next.source : undefined;\n    if (src && src !== keep) src.revoke?.();\n    cur.current = next;\n    setS(next);\n  }, []);\n\n  useEffect(\n    () => () => {\n      ctl.current?.abort();\n      const c = cur.current;\n      if (\"source\" in c) c.source?.revoke?.();\n    },\n    [],\n  );\n\n  const open = useCallback(\n    async (load: () => Promise<CropSource>, mode: SlotCropMode, edit: Edit | null) => {\n      ctl.current?.abort();\n      ctl.current = null;\n      const n = ++picks.current;\n      set({ status: \"decoding\" });\n      try {\n        const source = await load();\n        if (n !== picks.current) return source.revoke?.();\n        set({ status: \"cropping\", source, edit, mode });\n      } catch (e) {\n        if (n !== picks.current) return;\n        const error = e instanceof ContentKitError ? e : new ContentKitError(\"decode\", e instanceof Error ? e.message : String(e), { cause: e });\n        set({ status: \"error\", error });\n        opts.current.onError?.(error, \"slot.decode\");\n      }\n    },\n    [set],\n  );\n\n  const pick = useCallback(\n    (file: File) =>\n      open(async () => {\n        if (opts.current.animation === \"reject\" && (await isAnimatedImage(file)))\n          throw new ContentKitError(\"animation_not_allowed\", \"animated images are not allowed here\", { status: 422 });\n        return (opts.current.decode ?? decodeImage)(file);\n      }, \"new\", null),\n    [open],\n  );\n\n  const canRecrop = !!o.file && !o.file.staged && (o.file.size ?? 0) > 0 && o.file.type.startsWith(\"image/\");\n  const recrop = useCallback(async () => {\n    const f = opts.current.file;\n    if (!f) return;\n    await open(() => media.editorView(opts.current.ref, f.path), \"recrop\", f.edit ?? null);\n  }, [media, open]);\n\n  const setEdit = useCallback(\n    (edit: Edit | null) => {\n      const c = cur.current;\n      if (c.status === \"cropping\") {\n        if (!sameEdit(c.edit, edit)) set({ ...c, edit });\n      } else if (c.status === \"error\" && c.source && c.mode) set({ status: \"cropping\", source: c.source, edit, mode: c.mode });\n    },\n    [set],\n  );\n\n  const save = useCallback(\n    async (next?: Edit | null) => {\n      if (next !== undefined) setEdit(next);\n      const c = cur.current;\n      if (!(c.status === \"cropping\" || (c.status === \"error\" && c.source && c.mode))) return undefined;\n      const { source, mode } = c as { source: CropSource; mode: SlotCropMode };\n      const edit = c.edit ?? null;\n      const { ref, path, renderTimeout: timeout } = opts.current;\n      const a = (ctl.current = new AbortController());\n      const saving = (progress?: Progress) =>\n        a === ctl.current && set({ status: \"saving\", source, edit, mode, progress, rendering: progress?.phase === \"processing\" });\n      saving();\n      try {\n        let file: FileInfo;\n        if (mode === \"new\") file = await media.put(source.file!, { ref, path, edit, signal: a.signal, timeout, onProgress: saving });\n        else {\n          const at = opts.current.file?.path ?? path;\n          await media.commit(ref, [{ op: \"edit\", path: at, ...(edit ? { edit } : {}) }], { signal: a.signal });\n          saving({ phase: \"processing\", loaded: 0, total: 0 });\n          file = await media.waitFor(ref, at, { signal: a.signal, timeout });\n        }\n        if (a !== ctl.current) return undefined;\n        set({ status: \"done\", file });\n        opts.current.onSaved?.(file);\n        return file;\n      } catch (e) {\n        if (a !== ctl.current) return undefined;\n        const error = toContentKitError(e);\n        set(error.code === \"aborted\" ? { status: \"cropping\", source, edit, mode } : { status: \"error\", error, source, edit, mode });\n        if (error.code !== \"aborted\") opts.current.onError?.(error, \"slot.save\");\n        return undefined;\n      }\n    },\n    [media, set, setEdit],\n  );\n\n  const cancel = useCallback(() => {\n    picks.current++;\n    ctl.current?.abort();\n    ctl.current = null;\n    set({ status: \"idle\" });\n  }, [set]);\n\n  const cropped = useMemo(() => (\"source\" in s && s.source ? editOutput(s.source, s.edit, aspect) : undefined), [s, aspect]);\n  return { ...s, aspect, cropped, pick, canRecrop, recrop, setEdit, save, cancel };\n}\n"],"mappings":"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"}

package/dist/react/store.d.ts

@@ -0,0 +1,51 @@
+import { ContentKitClient } from '../client/client.js';
+import { ContentKitError } from '../client/errors.js';
+import { FileInfo, ReadResult, RefBody } from '../client/generated/wire.js';
+import { ReadOptions } from '../client/media/api.js';
+export interface ReadEntry {
+    read: ReadResult | null;
+    loading: boolean;
+    /** A read or set() has completed. */
+    loaded: boolean;
+    error?: ContentKitError;
+}
+/** What one reader asks of a shared read beyond the read itself. */
+export interface ReadPolicy {
+    /** Poll at this interval (ms) while uploads process (editor reads). */
+    poll?: number | false;
+    /** Read again shortly before the URLs expire. */
+    refresh?: boolean;
+}
+/**
+ * How load() treats a read in flight: "initial" reads only when nothing is
+ * loaded or loading; "refresh" joins one in flight (timers, a player's grant
+ * refresh); "reload" restarts it (after a change the in-flight read predates).
+ */
+export type LoadMode = "initial" | "refresh" | "reload";
+export declare function readKey(ref: RefBody, o?: ReadOptions): string;
+/** The read with the upload at path replaced by file in place (appended when new, removed when null). */
+export declare function withUpload(read: ReadResult | null, path: string, file: FileInfo | null): ReadResult;
+/**
+ * The reads hooks share, per client: one request per item and options while
+ * any hook shows it. set() updates every reader in place; a commit reloads
+ * the item's reads and a processed upload is patched into its editor reads.
+ * Readers may ask for polling while uploads process and a read before the
+ * URLs expire; the slot runs one timer for all of them.
+ */
+export declare class ReadStore {
+    private readonly client;
+    private readonly slots;
+    constructor(client: ContentKitClient);
+    subscribe(key: string, ref: RefBody, options: ReadOptions, listener: () => void, policy?: ReadPolicy): () => void;
+    snapshot(key: string): ReadEntry;
+    load(key: string, mode?: LoadMode): void;
+    /** Replaces the read for every hook showing it, without refetching. */
+    set(key: string, read: ReadResult): void;
+    private fetch;
+    private schedule;
+    private reloadViewers;
+    private apply;
+    private update;
+}
+/** The client's shared read store. */
+export declare function storeFor(client: ContentKitClient): ReadStore;

package/dist/react/store.js

@@ -0,0 +1,164 @@
+import { toContentKitError as e } from "../client/errors.js";
+import { samePath as t, sleep as n } from "../client/media/client.js";
+import { isProcessing as r, processing as i } from "../client/media/windows.js";
+import { expiryDelay as a } from "../client/playback.js";
+//#region src/react/store.ts
+var o = {
+	read: null,
+	loading: !1,
+	loaded: !1
+}, s = 3;
+function c(e, t = {}) {
+	return JSON.stringify([
+		e.kind,
+		e.id,
+		t.prefix ?? "",
+		t.offset ?? 0,
+		t.limit ?? 0,
+		!!t.download,
+		!!t.editor
+	]);
+}
+function l(e, n, r) {
+	let i = e?.files ?? [], a = i.findIndex((e) => e.upload && t(e.path, n)), o = i.filter((e, t) => t !== a);
+	return r && o.splice(a < 0 ? o.length : a, 0, r), {
+		access: "full",
+		expires: 0,
+		total: 0,
+		offset: 0,
+		limit: 0,
+		...e,
+		files: o
+	};
+}
+var u = class {
+	client;
+	slots = /* @__PURE__ */ new Map();
+	constructor(e) {
+		this.client = e, e.subscribe((e) => this.apply(e));
+	}
+	subscribe(e, t, n, r, i = {}) {
+		let a = this.slots.get(e);
+		a || this.slots.set(e, a = {
+			key: e,
+			ref: t,
+			options: n,
+			listeners: /* @__PURE__ */ new Map(),
+			entry: o
+		});
+		let s = a;
+		return s.listeners.set(r, i), this.schedule(s), () => {
+			s.listeners.delete(r), queueMicrotask(() => {
+				if (this.slots.get(e) === s) {
+					if (s.listeners.size) return this.schedule(s);
+					s.ctl?.abort(), clearTimeout(s.timer), this.slots.delete(e);
+				}
+			});
+		};
+	}
+	snapshot(e) {
+		return this.slots.get(e)?.entry ?? o;
+	}
+	load(t, n = "initial") {
+		let r = this.slots.get(t);
+		if (!r || n === "initial" && (r.entry.loaded || r.ctl) || n === "refresh" && r.ctl) return;
+		r.ctl?.abort(), clearTimeout(r.timer);
+		let i = r.ctl = new AbortController();
+		this.update(r, {
+			loading: !0,
+			error: void 0
+		}), this.fetch(r, i.signal).then((e) => {
+			if (r.ctl !== i) return;
+			r.ctl = void 0;
+			let t = r.entry.read;
+			this.update(r, {
+				read: e,
+				loading: !1,
+				loaded: !0,
+				error: void 0
+			}), this.schedule(r), r.options.editor && d(t, e) && this.reloadViewers(r.ref);
+		}, (t) => {
+			r.ctl === i && (r.ctl = void 0, this.update(r, {
+				read: null,
+				loading: !1,
+				loaded: !0,
+				error: e(t)
+			}));
+		});
+	}
+	set(e, t) {
+		let n = this.slots.get(e);
+		n && (n.ctl?.abort(), n.ctl = void 0, this.update(n, {
+			read: t,
+			loading: !1,
+			loaded: !0,
+			error: void 0
+		}), this.schedule(n));
+	}
+	async fetch(t, r) {
+		for (let i = 0;; i++) try {
+			return await this.client.media.read(t.ref, {
+				...t.options,
+				signal: r
+			});
+		} catch (t) {
+			let a = e(t);
+			if (a.code !== "rate_limited" || i >= s || r.aborted) throw a;
+			await n(Math.min(30, a.retryAfter ?? 1) * 1e3, r);
+		}
+	}
+	schedule(e) {
+		clearTimeout(e.timer), e.timer = void 0;
+		let t = e.entry.read;
+		if (!t || e.ctl || !e.listeners.size) return;
+		let n = null, r = [...e.listeners.values()].map((e) => e.poll).filter((e) => typeof e == "number" && e > 0);
+		if (r.length && i(t) && (n = Math.min(...r)), [...e.listeners.values()].some((e) => e.refresh)) {
+			let e = a(t.expires);
+			e !== null && (n = n === null ? e : Math.min(n, e));
+		}
+		n !== null && (e.timer = setTimeout(() => this.load(e.key, "refresh"), n));
+	}
+	reloadViewers(e) {
+		for (let [t, n] of this.slots) !n.options.editor && n.ref.kind === e.kind && n.ref.id === e.id && (n.entry.loaded || n.ctl) && this.load(t, "reload");
+	}
+	apply(e) {
+		if (e.type !== "media.committed" && e.type !== "media.processed") return;
+		let { ref: t } = e;
+		for (let [n, r] of this.slots) {
+			if (r.ref.kind !== t.kind || r.ref.id !== t.id) continue;
+			if (e.type === "media.committed") {
+				(r.entry.loaded || r.ctl) && this.load(n, "reload");
+				continue;
+			}
+			let i = r.entry.read, { file: a } = e;
+			if (i) {
+				if (!r.options.editor) {
+					this.load(n, "reload");
+					continue;
+				}
+				(!r.options.prefix || a.path.startsWith(r.options.prefix)) && (this.update(r, { read: l(i, a.path, a) }), r.ctl && this.load(n, "reload"));
+			}
+		}
+	}
+	update(e, t) {
+		e.entry = {
+			...e.entry,
+			...t
+		};
+		for (let t of e.listeners.keys()) t();
+	}
+};
+function d(e, t) {
+	if (!e) return !1;
+	let n = new Map(t.files.filter((e) => e.upload).map((e) => [e.path, e]));
+	return e.files.some((e) => r(e) && n.has(e.path) && !r(n.get(e.path)));
+}
+var f = /* @__PURE__ */ new WeakMap();
+function p(e) {
+	let t = f.get(e);
+	return t || f.set(e, t = new u(e)), t;
+}
+//#endregion
+export { u as ReadStore, c as readKey, p as storeFor, l as withUpload };
+
+//# sourceMappingURL=store.js.map

package/dist/react/store.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"store.js","names":[],"sources":["../../src/react/store.ts"],"sourcesContent":["import type { ContentKitClient } from \"../client/client.js\";\nimport { toContentKitError, type ContentKitError } from \"../client/errors.js\";\nimport type { FileInfo, ReadResult, RefBody } from \"../client/generated/wire.js\";\nimport type { ContentKitChange } from \"../client/http.js\";\nimport type { ReadOptions } from \"../client/media/api.js\";\nimport { samePath, sleep } from \"../client/media/client.js\";\nimport { isProcessing, processing } from \"../client/media/windows.js\";\nimport { expiryDelay } from \"../client/playback.js\";\n\nexport interface ReadEntry {\n  read: ReadResult | null;\n  loading: boolean;\n  /** A read or set() has completed. */\n  loaded: boolean;\n  error?: ContentKitError;\n}\n\n/** What one reader asks of a shared read beyond the read itself. */\nexport interface ReadPolicy {\n  /** Poll at this interval (ms) while uploads process (editor reads). */\n  poll?: number | false;\n  /** Read again shortly before the URLs expire. */\n  refresh?: boolean;\n}\n\n/**\n * How load() treats a read in flight: \"initial\" reads only when nothing is\n * loaded or loading; \"refresh\" joins one in flight (timers, a player's grant\n * refresh); \"reload\" restarts it (after a change the in-flight read predates).\n */\nexport type LoadMode = \"initial\" | \"refresh\" | \"reload\";\n\ninterface Slot {\n  key: string;\n  ref: RefBody;\n  options: ReadOptions;\n  listeners: Map<() => void, ReadPolicy>;\n  entry: ReadEntry;\n  ctl?: AbortController;\n  timer?: ReturnType<typeof setTimeout>;\n}\n\nconst IDLE: ReadEntry = { read: null, loading: false, loaded: false };\n\n/** rate_limited reads are retried this often before the error shows. */\nconst RATE_LIMIT_RETRIES = 3;\n\nexport function readKey(ref: RefBody, o: ReadOptions = {}): string {\n  return JSON.stringify([ref.kind, ref.id, o.prefix ?? \"\", o.offset ?? 0, o.limit ?? 0, !!o.download, !!o.editor]);\n}\n\n/** The read with the upload at path replaced by file in place (appended when new, removed when null). */\nexport function withUpload(read: ReadResult | null, path: string, file: FileInfo | null): ReadResult {\n  const all = read?.files ?? [];\n  const at = all.findIndex((x) => x.upload && samePath(x.path, path));\n  const files = all.filter((_, i) => i !== at);\n  if (file) files.splice(at < 0 ? files.length : at, 0, file);\n  return { access: \"full\", expires: 0, total: 0, offset: 0, limit: 0, ...read, files };\n}\n\n/**\n * The reads hooks share, per client: one request per item and options while\n * any hook shows it. set() updates every reader in place; a commit reloads\n * the item's reads and a processed upload is patched into its editor reads.\n * Readers may ask for polling while uploads process and a read before the\n * URLs expire; the slot runs one timer for all of them.\n */\nexport class ReadStore {\n  private readonly slots = new Map<string, Slot>();\n\n  constructor(private readonly client: ContentKitClient) {\n    client.subscribe((c) => this.apply(c));\n  }\n\n  subscribe(key: string, ref: RefBody, options: ReadOptions, listener: () => void, policy: ReadPolicy = {}): () => void {\n    let s = this.slots.get(key);\n    if (!s) this.slots.set(key, (s = { key, ref, options, listeners: new Map(), entry: IDLE }));\n    const slot = s;\n    slot.listeners.set(listener, policy);\n    this.schedule(slot);\n    return () => {\n      slot.listeners.delete(listener);\n      // Kept across a StrictMode remount; dropped once no hook shows it.\n      queueMicrotask(() => {\n        if (this.slots.get(key) !== slot) return;\n        if (slot.listeners.size) return this.schedule(slot);\n        slot.ctl?.abort();\n        clearTimeout(slot.timer);\n        this.slots.delete(key);\n      });\n    };\n  }\n\n  snapshot(key: string): ReadEntry {\n    return this.slots.get(key)?.entry ?? IDLE;\n  }\n\n  load(key: string, mode: LoadMode = \"initial\"): void {\n    const s = this.slots.get(key);\n    if (!s) return;\n    if (mode === \"initial\" && (s.entry.loaded || s.ctl)) return;\n    if (mode === \"refresh\" && s.ctl) return;\n    s.ctl?.abort();\n    clearTimeout(s.timer);\n    const ctl = (s.ctl = new AbortController());\n    this.update(s, { loading: true, error: undefined });\n    this.fetch(s, ctl.signal).then(\n      (read) => {\n        if (s.ctl !== ctl) return;\n        s.ctl = undefined;\n        const before = s.entry.read;\n        this.update(s, { read, loading: false, loaded: true, error: undefined });\n        this.schedule(s);\n        if (s.options.editor && finished(before, read)) this.reloadViewers(s.ref);\n      },\n      (e) => {\n        if (s.ctl !== ctl) return;\n        s.ctl = undefined;\n        this.update(s, { read: null, loading: false, loaded: true, error: toContentKitError(e) });\n      },\n    );\n  }\n\n  /** Replaces the read for every hook showing it, without refetching. */\n  set(key: string, read: ReadResult): void {\n    const s = this.slots.get(key);\n    if (!s) return;\n    s.ctl?.abort();\n    s.ctl = undefined;\n    this.update(s, { read, loading: false, loaded: true, error: undefined });\n    this.schedule(s);\n  }\n\n  // The client retries transport faults; a read rate limit waits it out here.\n  private async fetch(s: Slot, signal: AbortSignal): Promise<ReadResult> {\n    for (let attempt = 0; ; attempt++) {\n      try {\n        return await this.client.media.read(s.ref, { ...s.options, signal });\n      } catch (e) {\n        const err = toContentKitError(e);\n        if (err.code !== \"rate_limited\" || attempt >= RATE_LIMIT_RETRIES || signal.aborted) throw err;\n        await sleep(Math.min(30, err.retryAfter ?? 1) * 1000, signal);\n      }\n    }\n  }\n\n  // One timer per slot: the soonest of a poll (while uploads process) and the refresh before expiry.\n  private schedule(s: Slot): void {\n    clearTimeout(s.timer);\n    s.timer = undefined;\n    const read = s.entry.read;\n    if (!read || s.ctl || !s.listeners.size) return;\n    let delay: number | null = null;\n    const polls = [...s.listeners.values()].map((p) => p.poll).filter((p): p is number => typeof p === \"number\" && p > 0);\n    if (polls.length && processing(read)) delay = Math.min(...polls);\n    if ([...s.listeners.values()].some((p) => p.refresh)) {\n      const d = expiryDelay(read.expires);\n      if (d !== null) delay = delay === null ? d : Math.min(delay, d);\n    }\n    if (delay !== null) s.timer = setTimeout(() => this.load(s.key, \"refresh\"), delay);\n  }\n\n  // Uploads finished processing: the item's viewer reads list new files and URLs.\n  private reloadViewers(ref: RefBody): void {\n    for (const [key, s] of this.slots) {\n      if (!s.options.editor && s.ref.kind === ref.kind && s.ref.id === ref.id && (s.entry.loaded || s.ctl)) this.load(key, \"reload\");\n    }\n  }\n\n  private apply(change: ContentKitChange): void {\n    if (change.type !== \"media.committed\" && change.type !== \"media.processed\") return;\n    const { ref } = change;\n    for (const [key, s] of this.slots) {\n      if (s.ref.kind !== ref.kind || s.ref.id !== ref.id) continue;\n      if (change.type === \"media.committed\") {\n        if (s.entry.loaded || s.ctl) this.load(key, \"reload\");\n        continue;\n      }\n      const read = s.entry.read;\n      const { file } = change;\n      if (!read) continue;\n      // A viewer read cannot be patched: its URLs and public files change.\n      if (!s.options.editor) {\n        this.load(key, \"reload\");\n        continue;\n      }\n      if (s.options.prefix && !file.path.startsWith(s.options.prefix)) continue;\n      this.update(s, { read: withUpload(read, file.path, file) });\n      // A read in flight may predate the processing.\n      if (s.ctl) this.load(key, \"reload\");\n    }\n  }\n\n  // A new entry per change: useSyncExternalStore compares snapshots by identity.\n  private update(s: Slot, patch: Partial<ReadEntry>): void {\n    s.entry = { ...s.entry, ...patch };\n    for (const l of s.listeners.keys()) l();\n  }\n}\n\n/** Some upload processing in before is done (or failed) in after. */\nfunction finished(before: ReadResult | null, after: ReadResult): boolean {\n  if (!before) return false;\n  const now = new Map(after.files.filter((f) => f.upload).map((f) => [f.path, f]));\n  return before.files.some((f) => isProcessing(f) && now.has(f.path) && !isProcessing(now.get(f.path)!));\n}\n\nconst stores = new WeakMap<ContentKitClient, ReadStore>();\n\n/** The client's shared read store. */\nexport function storeFor(client: ContentKitClient): ReadStore {\n  let s = stores.get(client);\n  if (!s) stores.set(client, (s = new ReadStore(client)));\n  return s;\n}\n"],"mappings":"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"}

package/dist/react/upload.d.ts

@@ -0,0 +1,85 @@
+import { AspectRatio } from '../client/aspect.js';
+import { ContentKitClient } from '../client/client.js';
+import { Rotation, Size } from '../client/crop.js';
+import { ContentKitError } from '../client/errors.js';
+import { Crop, Edit, EncodeProgress, FileInfo } from '../client/generated/wire.js';
+import { Progress, PutOptions, UploadedFile, UploadOptions } from '../client/media/client.js';
+import { UploadQueue, QueueOptions, QueueSnapshot } from '../client/media/queue.js';
+export interface UseUploadQueue extends QueueSnapshot {
+    queue: UploadQueue;
+    add: UploadQueue["add"];
+    move: UploadQueue["move"];
+    update: UploadQueue["update"];
+    remove: UploadQueue["remove"];
+    retry: UploadQueue["retry"];
+    start: UploadQueue["start"];
+    pause: UploadQueue["pause"];
+    commit: UploadQueue["commit"];
+}
+export interface UploadQueueOptions extends QueueOptions {
+    /** Overrides the provider's client. */
+    client?: ContentKitClient;
+}
+/**
+ * A file queue for one item (options are read once; key the component by
+ * ref to switch items). Unmounting pauses running uploads.
+ */
+export declare function useUploadQueue({ client: own, ...options }: UploadQueueOptions): UseUploadQueue;
+export interface UploadStatus {
+    status: "idle" | "uploading" | "done" | "error";
+    progress?: Progress;
+    error?: ContentKitError;
+    result?: UploadedFile & {
+        file?: FileInfo;
+    };
+}
+export interface UseUpload extends UploadStatus {
+    /**
+     * Uploads one file; with put it also commits it to its path (put's edit,
+     * meta and index) and waits until it is processed (result.file).
+     */
+    upload: (file: File, opts: Omit<UploadOptions, "signal" | "onProgress"> & {
+        put?: PutOptions;
+    }) => Promise<UploadedFile & {
+        file?: FileInfo;
+    }>;
+    cancel: () => void;
+}
+/** One upload at a time (a cover, an inline image); a new upload cancels the previous. */
+export declare function useUpload({ client: own }?: {
+    client?: ContentKitClient;
+}): UseUpload;
+export interface UseCropOptions {
+    /** The upload's size (an editor read's w and h). */
+    source: Size;
+    /** The edited image's "W:H", e.g. the public preset's aspect; "" or omitted is free. */
+    aspect?: AspectRatio;
+    /** The current edit to start from. */
+    initial?: Edit | null;
+}
+export interface UseCrop {
+    /** In original pixels, inside the source and at the aspect. */
+    crop: Crop;
+    rotate: Rotation;
+    /** Ready for an edit or put op; null when nothing changes. Its identity changes only with its value. */
+    edit: Edit | null;
+    /** A rect in original pixels. */
+    setCrop: (rect: Crop) => void;
+    /** A rect on the image as displayed (after the rotation) at display size: a cropper's output. */
+    setFromDisplay: (rect: Crop, display: Size) => void;
+    /** Turns clockwise by deg (a multiple of 90); the crop keeps the aspect. */
+    rotateBy: (deg: number) => void;
+    reset: () => void;
+}
+/** Headless crop state for any cropper UI: a rect in original pixels, a rotation and the resulting edit. */
+export declare function useCrop({ source: given, aspect: shape, initial }: UseCropOptions): UseCrop;
+export interface UseEncodeProgress {
+    progress?: EncodeProgress;
+    /** Seconds left, counting down each second between reports; undefined while unknown. */
+    remaining?: number;
+}
+/**
+ * A pending video file's encode progress from the read API (`files[i].progress`),
+ * with the ETA counted down locally between polls.
+ */
+export declare function useEncodeProgress(progress?: EncodeProgress | null): UseEncodeProgress;