@bloklabs/presets 1.11.0

package/README.md

@@ -0,0 +1,106 @@
+# @bloklabs/presets
+
+Ready-made [`uploader`](https://blokeditor.com/docs/uploader-api) implementations for [Blok](https://blokeditor.com) — plug in storage you already have instead of hand-writing an upload handler. Five presets ship today: Supabase, S3-compatible storage (presigned URLs), Cloudinary, a generic fetch endpoint, and IndexedDB.
+
+## Install
+
+```bash
+npm install @bloklabs/presets @bloklabs/core
+```
+
+## What a preset is
+
+Blok's `uploader` config option takes an object shaped like this — store the file, return where it landed:
+
+```ts
+import { Blok } from '@bloklabs/core';
+
+new Blok({
+  holder: 'editor',
+  uploader: {
+    async uploadByFile(file, { kind }) {
+      const res = await fetch(`/upload/${kind}`, { method: 'POST', body: file });
+      return { url: (await res.json()).url };
+    },
+  },
+});
+```
+
+Without an `uploadByFile`, an uploaded asset becomes a `blob:` URL that doesn't survive a reload — most projects need to configure one. Each preset in this package is a ready-made implementation of that shape for one storage backend, so you import a preset instead of writing `uploadByFile` yourself.
+
+## Which preset, and what it needs
+
+| Preset | Re-hosts a pasted URL? | Needs on the storage side |
+| --- | --- | --- |
+| `fetchStorage` | **Yes** — your endpoint fetches it server-side | A backend answering `POST /upload` and `POST /upload-by-url` |
+| `supabaseStorage` | No | A Storage bucket, made public (or an anon SELECT policy), plus an INSERT policy |
+| `presignedStorage` | No | A backend that mints presigned PUT URLs, and a CORS rule on the bucket allowing PUT |
+| `cloudinaryStorage` | **Yes** — Cloudinary fetches it itself | An **unsigned** upload preset in the Cloudinary dashboard |
+| `indexedDBStorage` | No | Nothing — see the warning below |
+
+Only `fetchStorage` and `cloudinaryStorage` can turn a pasted remote URL into a re-hosted copy: both have something that fetches the URL on the server side (your endpoint, or Cloudinary's). The other three cannot — a browser is not allowed to fetch a third-party URL and re-upload it itself. Their `uploadByUrl` is deliberately left undefined rather than faked, so Blok falls back to its documented behavior and stores the pasted URL verbatim.
+
+### fetchStorage
+
+```ts
+import { fetchStorage } from '@bloklabs/presets';
+
+new Blok({ holder: 'editor', uploader: fetchStorage({ baseUrl: 'https://api.myapp.com' }) });
+```
+
+Your own backend does the actual storing; this preset just calls it. It must answer `POST {baseUrl}/upload` (multipart) and `POST {baseUrl}/upload-by-url` (`{ url }` JSON), both returning `{ url, fileName? }`. The URL you receive on `/upload-by-url` is user-supplied — validate it server-side and block requests to internal/private addresses before fetching it, or the endpoint becomes an SSRF vector.
+
+### supabaseStorage
+
+```ts
+import { createClient } from '@supabase/supabase-js';
+import { supabaseStorage } from '@bloklabs/presets';
+
+const supabase = createClient(SUPABASE_URL, SUPABASE_ANON_KEY);
+new Blok({ holder: 'editor', uploader: supabaseStorage(supabase, { bucket: 'blok' }) });
+```
+
+Create the bucket first (default name `"blok"`), make it public or add an anon `SELECT` policy — this preset returns `getPublicUrl()` directly, so an unreadable object is a broken image — and add an `INSERT` policy for whichever role the client authenticates as.
+
+### presignedStorage
+
+```ts
+import { presignedStorage } from '@bloklabs/presets';
+
+new Blok({ holder: 'editor', uploader: presignedStorage({ sign: (request) => api.sign(request) }) });
+```
+
+For S3, R2, MinIO, or any S3-compatible store. `sign` is your function: it gets `{ fileName, mimeType, size, kind }` and returns a presigned `{ uploadUrl, publicUrl, headers? }` from your backend. The browser then `PUT`s the file straight to `uploadUrl`, so the bucket needs a CORS rule allowing `PUT` (and `Content-Type`) from your app's origin — that CORS rule is the part that actually blocks people.
+
+### cloudinaryStorage
+
+```ts
+import { cloudinaryStorage } from '@bloklabs/presets';
+
+new Blok({
+  holder: 'editor',
+  uploader: cloudinaryStorage({ cloudName: 'my-cloud', uploadPreset: 'blok-unsigned' }),
+});
+```
+
+`uploadPreset` must be **unsigned** (Cloudinary dashboard → Settings → Upload → Upload presets). A signed preset needs a server to sign the request, which defeats the point of a no-backend preset.
+
+### indexedDBStorage
+
+```ts
+import { indexedDBStorage, resolveBlokObjectUrl } from '@bloklabs/presets';
+
+new Blok({ holder: 'editor', uploader: indexedDBStorage() });
+
+// Wherever you render a stored asset's url, e.g. an <img src>:
+const displayUrl = await resolveBlokObjectUrl(asset.url);
+```
+
+**Not for production.** This preset stores uploaded bytes in the visitor's own browser via IndexedDB. They are gone on another device, in another browser, or the moment the user clears site data — nothing is actually shared or backed up. It exists because Blok's built-in fallback (a `blob:` URL) doesn't even survive a page reload, which makes local demos and prototypes look broken before you've wired up real storage. `uploadByFile` returns a `blok:asset/…` reference, not a directly usable URL — resolve it with `resolveBlokObjectUrl` wherever you render an uploaded asset. If you pass a custom `dbName` to `indexedDBStorage()`, pass the same `dbName` to `resolveBlokObjectUrl(url, { dbName })` — a mismatch resolves to `null` with no error, not a thrown exception. Each call to `resolveBlokObjectUrl` mints a fresh `blob:` URL — nothing is cached, and nothing is revoked. Call `URL.revokeObjectURL()` yourself once a displayed asset is no longer needed, or a view that re-renders it repeatedly will leak memory.
+
+## Docs
+
+- [Uploader API reference](https://blokeditor.com/docs/uploader-api)
+- [Storage presets guide](https://blokeditor.com/presets)
+
+Licensed under Apache-2.0.

package/dist/index.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});function e(e){return new Promise((t,n)=>{var r;let i=new XMLHttpRequest;i.open(e.method,e.url);for(let[t,n]of Object.entries((r=e.headers)==null?{}:r))i.setRequestHeader(t,n);e.onProgress&&(i.upload.onprogress=t=>{var n;!t.lengthComputable||t.total===0||(n=e.onProgress)==null||n.call(e,Math.round(t.loaded/t.total*100))}),i.onload=()=>t({status:i.status,text:i.responseText}),i.onerror=()=>n(Error(`Upload failed: network error`)),i.send(e.body)})}function t(e){"@babel/helpers - typeof";return t=typeof Symbol==`function`&&typeof Symbol.iterator==`symbol`?function(e){return typeof e}:function(e){return e&&typeof Symbol==`function`&&e.constructor===Symbol&&e!==Symbol.prototype?`symbol`:typeof e},t(e)}function n(e,n){if(t(e)!=`object`||!e)return e;var r=e[Symbol.toPrimitive];if(r!==void 0){var i=r.call(e,n||`default`);if(t(i)!=`object`)return i;throw TypeError(`@@toPrimitive must return a primitive value.`)}return(n===`string`?String:Number)(e)}function r(e){var r=n(e,`string`);return t(r)==`symbol`?r:r+``}function i(e,t,n){return(t=r(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function a(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),n.push.apply(n,r)}return n}function o(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]==null?{}:arguments[t];t%2?a(Object(n),!0).forEach(function(t){i(e,t,n[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):a(Object(n)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))})}return e}function s(t){var n;let r=t.baseUrl.replace(/\/+$/,``),i=(n=t.field)==null?`file`:n,a=async()=>{var e;return typeof t.headers==`function`?t.headers():(e=t.headers)==null?{}:e};return{async uploadByFile(t,n){let o=new FormData;o.append(i,t);let{status:s,text:l}=await e({method:`POST`,url:`${r}/upload`,body:o,headers:await a(),onProgress:n.onProgress});if(s<200||s>299)throw Error(`Fetch endpoint upload failed with status ${s}`);return c(l,t.name)},async uploadByUrl(e,t){let n=await fetch(`${r}/upload-by-url`,{method:`POST`,headers:o(o({},await a()),{},{"Content-Type":`application/json`}),body:JSON.stringify({url:e})});if(!n.ok)throw Error(`Fetch endpoint upload failed with status ${n.status}`);return u(l(await n.text()))}}}function c(e,t){var n;let r=u(l(e));return{url:r.url,fileName:(n=r.fileName)==null?t:n}}function l(e){try{return JSON.parse(e)}catch(e){throw Error(`Upload failed: the endpoint returned a malformed response`)}}function u(e){if(typeof e!=`object`||!e||typeof e.url!=`string`)throw Error(`Upload failed: the endpoint returned no url`);let t=e;return{url:t.url,fileName:typeof t.fileName==`string`?t.fileName:void 0}}function d(e,t={}){let n=e=>{var n;return typeof t.bucket==`function`?t.bucket(e):(n=t.bucket)==null?`blok`:n};return{async uploadByFile(r,i){var a,o;let s=(a=(o=t.path)==null?void 0:o.call(t,r,i))==null?f(r.name):a,{data:c,error:l}=await e.storage.from(n(i.kind)).upload(s,r,{contentType:r.type||void 0,upsert:!1});if(l!==null||c===null){var u;throw Error(`Supabase upload failed: ${(u=l==null?void 0:l.message)==null?`unknown error`:u}`)}let{data:d}=e.storage.from(n(i.kind)).getPublicUrl(c.path);return{url:d.publicUrl,fileName:r.name}}}}function f(e){let t=/\.[a-z0-9]+$/i.exec(e),n=t?t[0].toLowerCase():``;return`${crypto.randomUUID()}${n}`}function p(t){return{async uploadByFile(n,r){let i=await t.sign({fileName:n.name,mimeType:n.type,size:n.size,kind:r.kind}),{status:a}=await e({method:`PUT`,url:i.uploadUrl,body:n,headers:o(o({},i.headers),{},{"Content-Type":n.type||`application/octet-stream`}),onProgress:r.onProgress});if(a<200||a>299)throw Error(`Presigned upload failed with status ${a}`);return{url:i.publicUrl,fileName:n.name}}}}var m={image:`image`,video:`video`,audio:`video`,file:`raw`};function h(t){let n=e=>{var n;return`https://api.cloudinary.com/v1_1/${t.cloudName}/${(n=m[e])==null?`raw`:n}/upload`},r=async(r,i,a)=>{let o=new FormData;o.append(`file`,i),o.append(`upload_preset`,t.uploadPreset),t.folder!==void 0&&o.append(`folder`,t.folder);let{status:s,text:c}=await e({method:`POST`,url:n(r),body:o,onProgress:a});return g(c,s,typeof i==`string`?void 0:i.name)};return{uploadByFile:(e,t)=>r(t.kind,e,t.onProgress),uploadByUrl:(e,t)=>r(t.kind,e,t.onProgress)}}function g(e,t,n){let r=_(e,t);if(typeof r.secure_url!=`string`){var i;let e=r.error;throw Error(`Cloudinary upload failed: ${(i=e==null?void 0:e.message)==null?`status ${t}`:i}`)}return{url:r.secure_url,fileName:n}}function _(e,t){try{return JSON.parse(e)}catch(e){throw Error(`Cloudinary upload failed with status ${t}`)}}var v=`blok-assets`,y=`assets`,b=`blok:asset/`;function x(e){return new Promise((t,n)=>{let r=indexedDB.open(e,1);r.onupgradeneeded=()=>{r.result.createObjectStore(y)},r.onsuccess=()=>t(r.result),r.onerror=()=>{var e;return n((e=r.error)==null?Error(`IndexedDB open failed`):e)}})}function S(e,t,n){return new Promise((r,i)=>{let a=n(e.transaction(y,t).objectStore(y));a.onsuccess=()=>r(a.result),a.onerror=()=>{var e;return i((e=a.error)==null?Error(`IndexedDB request failed`):e)}})}function C(e={}){var t;let n=(t=e.dbName)==null?v:t;return{async uploadByFile(e,t){let r=crypto.randomUUID(),i=await x(n);try{await S(i,`readwrite`,t=>t.put({blob:e,name:e.name,type:e.type},r))}finally{i.close()}return{url:`${b}${r}`,fileName:e.name}}}}async function w(e,t={}){var n;if(!e.startsWith(b))return e;let r=await T(await x((n=t.dbName)==null?v:n),e.slice(11));return r?URL.createObjectURL(r.blob):null}function T(e,t){return S(e,`readonly`,e=>e.get(t)).finally(()=>e.close())}exports.cloudinaryStorage=h,exports.fetchStorage=s,exports.indexedDBStorage=C,exports.presignedStorage=p,exports.resolveBlokObjectUrl=w,exports.supabaseStorage=d;

package/dist/index.mjs

@@ -0,0 +1,285 @@
+//#region src/upload-xhr.ts
+function e(e) {
+	return new Promise((t, n) => {
+		var r;
+		let i = new XMLHttpRequest();
+		i.open(e.method, e.url);
+		for (let [t, n] of Object.entries((r = e.headers) == null ? {} : r)) i.setRequestHeader(t, n);
+		e.onProgress && (i.upload.onprogress = (t) => {
+			var n;
+			!t.lengthComputable || t.total === 0 || (n = e.onProgress) == null || n.call(e, Math.round(t.loaded / t.total * 100));
+		}), i.onload = () => t({
+			status: i.status,
+			text: i.responseText
+		}), i.onerror = () => n(/* @__PURE__ */ Error("Upload failed: network error")), i.send(e.body);
+	});
+}
+//#endregion
+//#region \0@oxc-project+runtime@0.139.0/helpers/esm/typeof.js
+function t(e) {
+	"@babel/helpers - typeof";
+	return t = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(e) {
+		return typeof e;
+	} : function(e) {
+		return e && typeof Symbol == "function" && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
+	}, t(e);
+}
+//#endregion
+//#region \0@oxc-project+runtime@0.139.0/helpers/esm/toPrimitive.js
+function n(e, n) {
+	if (t(e) != "object" || !e) return e;
+	var r = e[Symbol.toPrimitive];
+	if (r !== void 0) {
+		var i = r.call(e, n || "default");
+		if (t(i) != "object") return i;
+		throw TypeError("@@toPrimitive must return a primitive value.");
+	}
+	return (n === "string" ? String : Number)(e);
+}
+//#endregion
+//#region \0@oxc-project+runtime@0.139.0/helpers/esm/toPropertyKey.js
+function r(e) {
+	var r = n(e, "string");
+	return t(r) == "symbol" ? r : r + "";
+}
+//#endregion
+//#region \0@oxc-project+runtime@0.139.0/helpers/esm/defineProperty.js
+function i(e, t, n) {
+	return (t = r(t)) in e ? Object.defineProperty(e, t, {
+		value: n,
+		enumerable: !0,
+		configurable: !0,
+		writable: !0
+	}) : e[t] = n, e;
+}
+//#endregion
+//#region \0@oxc-project+runtime@0.139.0/helpers/esm/objectSpread2.js
+function a(e, t) {
+	var n = Object.keys(e);
+	if (Object.getOwnPropertySymbols) {
+		var r = Object.getOwnPropertySymbols(e);
+		t && (r = r.filter(function(t) {
+			return Object.getOwnPropertyDescriptor(e, t).enumerable;
+		})), n.push.apply(n, r);
+	}
+	return n;
+}
+function o(e) {
+	for (var t = 1; t < arguments.length; t++) {
+		var n = arguments[t] == null ? {} : arguments[t];
+		t % 2 ? a(Object(n), !0).forEach(function(t) {
+			i(e, t, n[t]);
+		}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(n)) : a(Object(n)).forEach(function(t) {
+			Object.defineProperty(e, t, Object.getOwnPropertyDescriptor(n, t));
+		});
+	}
+	return e;
+}
+//#endregion
+//#region src/fetch-endpoint.ts
+function s(t) {
+	var n;
+	let r = t.baseUrl.replace(/\/+$/, ""), i = (n = t.field) == null ? "file" : n, a = async () => {
+		var e;
+		return typeof t.headers == "function" ? t.headers() : (e = t.headers) == null ? {} : e;
+	};
+	return {
+		async uploadByFile(t, n) {
+			let o = new FormData();
+			o.append(i, t);
+			let { status: s, text: l } = await e({
+				method: "POST",
+				url: `${r}/upload`,
+				body: o,
+				headers: await a(),
+				onProgress: n.onProgress
+			});
+			if (s < 200 || s > 299) throw Error(`Fetch endpoint upload failed with status ${s}`);
+			return c(l, t.name);
+		},
+		async uploadByUrl(e, t) {
+			let n = await fetch(`${r}/upload-by-url`, {
+				method: "POST",
+				headers: o(o({}, await a()), {}, { "Content-Type": "application/json" }),
+				body: JSON.stringify({ url: e })
+			});
+			if (!n.ok) throw Error(`Fetch endpoint upload failed with status ${n.status}`);
+			return u(l(await n.text()));
+		}
+	};
+}
+function c(e, t) {
+	var n;
+	let r = u(l(e));
+	return {
+		url: r.url,
+		fileName: (n = r.fileName) == null ? t : n
+	};
+}
+function l(e) {
+	try {
+		return JSON.parse(e);
+	} catch (e) {
+		throw Error("Upload failed: the endpoint returned a malformed response");
+	}
+}
+function u(e) {
+	if (typeof e != "object" || !e || typeof e.url != "string") throw Error("Upload failed: the endpoint returned no url");
+	let t = e;
+	return {
+		url: t.url,
+		fileName: typeof t.fileName == "string" ? t.fileName : void 0
+	};
+}
+//#endregion
+//#region src/supabase.ts
+function d(e, t = {}) {
+	let n = (e) => {
+		var n;
+		return typeof t.bucket == "function" ? t.bucket(e) : (n = t.bucket) == null ? "blok" : n;
+	};
+	return { async uploadByFile(r, i) {
+		var a, o;
+		let s = (a = (o = t.path) == null ? void 0 : o.call(t, r, i)) == null ? f(r.name) : a, { data: c, error: l } = await e.storage.from(n(i.kind)).upload(s, r, {
+			contentType: r.type || void 0,
+			upsert: !1
+		});
+		if (l !== null || c === null) {
+			var u;
+			throw Error(`Supabase upload failed: ${(u = l == null ? void 0 : l.message) == null ? "unknown error" : u}`);
+		}
+		let { data: d } = e.storage.from(n(i.kind)).getPublicUrl(c.path);
+		return {
+			url: d.publicUrl,
+			fileName: r.name
+		};
+	} };
+}
+function f(e) {
+	let t = /\.[a-z0-9]+$/i.exec(e), n = t ? t[0].toLowerCase() : "";
+	return `${crypto.randomUUID()}${n}`;
+}
+//#endregion
+//#region src/presigned.ts
+function p(t) {
+	return { async uploadByFile(n, r) {
+		let i = await t.sign({
+			fileName: n.name,
+			mimeType: n.type,
+			size: n.size,
+			kind: r.kind
+		}), { status: a } = await e({
+			method: "PUT",
+			url: i.uploadUrl,
+			body: n,
+			headers: o(o({}, i.headers), {}, { "Content-Type": n.type || "application/octet-stream" }),
+			onProgress: r.onProgress
+		});
+		if (a < 200 || a > 299) throw Error(`Presigned upload failed with status ${a}`);
+		return {
+			url: i.publicUrl,
+			fileName: n.name
+		};
+	} };
+}
+//#endregion
+//#region src/cloudinary.ts
+var m = {
+	image: "image",
+	video: "video",
+	audio: "video",
+	file: "raw"
+};
+function h(t) {
+	let n = (e) => {
+		var n;
+		return `https://api.cloudinary.com/v1_1/${t.cloudName}/${(n = m[e]) == null ? "raw" : n}/upload`;
+	}, r = async (r, i, a) => {
+		let o = new FormData();
+		o.append("file", i), o.append("upload_preset", t.uploadPreset), t.folder !== void 0 && o.append("folder", t.folder);
+		let { status: s, text: c } = await e({
+			method: "POST",
+			url: n(r),
+			body: o,
+			onProgress: a
+		});
+		return g(c, s, typeof i == "string" ? void 0 : i.name);
+	};
+	return {
+		uploadByFile: (e, t) => r(t.kind, e, t.onProgress),
+		uploadByUrl: (e, t) => r(t.kind, e, t.onProgress)
+	};
+}
+function g(e, t, n) {
+	let r = _(e, t);
+	if (typeof r.secure_url != "string") {
+		var i;
+		let e = r.error;
+		throw Error(`Cloudinary upload failed: ${(i = e == null ? void 0 : e.message) == null ? `status ${t}` : i}`);
+	}
+	return {
+		url: r.secure_url,
+		fileName: n
+	};
+}
+function _(e, t) {
+	try {
+		return JSON.parse(e);
+	} catch (e) {
+		throw Error(`Cloudinary upload failed with status ${t}`);
+	}
+}
+//#endregion
+//#region src/indexeddb.ts
+var v = "blok-assets", y = "assets", b = "blok:asset/";
+function x(e) {
+	return new Promise((t, n) => {
+		let r = indexedDB.open(e, 1);
+		r.onupgradeneeded = () => {
+			r.result.createObjectStore(y);
+		}, r.onsuccess = () => t(r.result), r.onerror = () => {
+			var e;
+			return n((e = r.error) == null ? /* @__PURE__ */ Error("IndexedDB open failed") : e);
+		};
+	});
+}
+function S(e, t, n) {
+	return new Promise((r, i) => {
+		let a = n(e.transaction(y, t).objectStore(y));
+		a.onsuccess = () => r(a.result), a.onerror = () => {
+			var e;
+			return i((e = a.error) == null ? /* @__PURE__ */ Error("IndexedDB request failed") : e);
+		};
+	});
+}
+function C(e = {}) {
+	var t;
+	let n = (t = e.dbName) == null ? v : t;
+	return { async uploadByFile(e, t) {
+		let r = crypto.randomUUID(), i = await x(n);
+		try {
+			await S(i, "readwrite", (t) => t.put({
+				blob: e,
+				name: e.name,
+				type: e.type
+			}, r));
+		} finally {
+			i.close();
+		}
+		return {
+			url: `${b}${r}`,
+			fileName: e.name
+		};
+	} };
+}
+async function w(e, t = {}) {
+	var n;
+	if (!e.startsWith(b)) return e;
+	let r = await T(await x((n = t.dbName) == null ? v : n), e.slice(11));
+	return r ? URL.createObjectURL(r.blob) : null;
+}
+function T(e, t) {
+	return S(e, "readonly", (e) => e.get(t)).finally(() => e.close());
+}
+//#endregion
+export { h as cloudinaryStorage, s as fetchStorage, C as indexedDBStorage, p as presignedStorage, w as resolveBlokObjectUrl, d as supabaseStorage };

package/package.json

@@ -0,0 +1,54 @@
+{
+  "name": "@bloklabs/presets",
+  "version": "1.11.0",
+  "description": "Storage presets for Blok — ready-made uploaders for Supabase, S3-compatible storage, Cloudinary, and IndexedDB.",
+  "license": "Apache-2.0",
+  "author": "JackUait",
+  "homepage": "https://blokeditor.com",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/JackUait/blok.git",
+    "directory": "packages/presets"
+  },
+  "bugs": {
+    "url": "https://github.com/JackUait/blok/issues"
+  },
+  "keywords": [
+    "blok",
+    "block-editor",
+    "storage",
+    "file-upload",
+    "uploader",
+    "supabase",
+    "s3",
+    "cloudinary",
+    "indexeddb",
+    "typescript"
+  ],
+  "type": "module",
+  "sideEffects": false,
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.mjs",
+  "types": "./types/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./types/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.cjs"
+    }
+  },
+  "files": [
+    "dist",
+    "types"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "yarn run -T vite build --mode production",
+    "test": "yarn run -T vitest run"
+  },
+  "devDependencies": {
+    "fake-indexeddb": "^6.2.5"
+  }
+}

package/types/index.d.ts

@@ -0,0 +1,175 @@
+/**
+ * `BlokUploader` and its supporting types below, mirrored from
+ * `types/configs/uploader.d.ts` (and `AssetKind` from
+ * `types/tools/block-tool.d.ts`) rather than imported — and deliberately not
+ * exported, since this package's public surface is only what each preset's
+ * brief asks it to produce (`fetchStorage`, `supabaseStorage`, and so on as
+ * each ships).
+ *
+ * A published `.d.ts` under `types/` ships as-is inside this package's own
+ * tarball (`files: ["dist", "types"]`) — a relative specifier like
+ * `../../../types/configs/uploader` resolves inside this monorepo, but once
+ * installed at `node_modules/@bloklabs/presets/types/index.d.ts` there is no
+ * repo root three levels up to reach, so every consumer's `tsc` would fail
+ * with TS2307. This package also declares zero dependencies, so it cannot
+ * import `@bloklabs/core`'s published types either (and `BlokUploader` is not
+ * part of that package's public surface regardless). Keep these definitions
+ * in sync with core's by hand until a generator exists (see `types/icons.d.ts`
+ * + `scripts/generate-icons-dts.mjs` for that pattern).
+ */
+
+/** The kind of asset being uploaded. */
+type AssetKind = 'image' | 'video' | 'audio' | 'file';
+
+/** A resolved upload result. */
+interface UploadedAsset {
+  /** Public URL the asset is reachable at once stored. */
+  url: string;
+  /** Original filename, when the host preserved one. */
+  fileName?: string;
+}
+
+/**
+ * Describes a single upload request.
+ *
+ * `kind` is the kind of asset being uploaded — NOT the tool that asked for
+ * it (an audio block uploading cover art sends `kind: 'image'`).
+ */
+interface UploadContext {
+  /** Kind of asset being uploaded. */
+  kind: AssetKind;
+  /** Name of the block tool that requested the upload, when known. */
+  tool?: string;
+  /** Upload progress in percent (0–100), when the host reports it. */
+  onProgress?(percent: number): void;
+}
+
+/**
+ * Editor-level uploader, keyed by asset kind rather than by tool. Both
+ * methods are optional and resolved independently.
+ */
+interface BlokUploader {
+  /** Store a file chosen by the user and return its public URL. */
+  uploadByFile?(file: File, ctx: UploadContext): Promise<UploadedAsset>;
+  /** Re-host an asset the user supplied by URL, and return the stored URL. */
+  uploadByUrl?(url: string, ctx: UploadContext): Promise<UploadedAsset>;
+}
+
+export interface FetchStorageOptions {
+  /** Base URL of a service speaking Blok's upload contract, e.g. `https://blok.myapp.com`. */
+  baseUrl: string;
+  /** Multipart field name the endpoint reads. Defaults to `file`. */
+  field?: string;
+  /**
+   * Extra headers. Pass a function to mint a short-lived access pass per
+   * request — the preset never inspects what it returns.
+   */
+  headers?: Record<string, string> | (() => Promise<Record<string, string>>);
+}
+
+/**
+ * Uploader for any endpoint speaking Blok's documented upload wire contract
+ * — including the `blok-server` sidecar, or a backend a consumer already
+ * wrote against that contract.
+ */
+export function fetchStorage(options: FetchStorageOptions): BlokUploader;
+
+/**
+ * Structural shape of a Supabase JS client's storage API. Matched
+ * structurally rather than imported from `@supabase/supabase-js`, which this
+ * package never depends on — the consumer passes their own client instance,
+ * so their own auth session applies.
+ */
+export interface SupabaseLike {
+  storage: {
+    from(bucket: string): {
+      upload(
+        path: string,
+        file: File,
+        options?: { contentType?: string; upsert?: boolean }
+      ): Promise<{ data: { path: string } | null; error: { message: string } | null }>;
+      getPublicUrl(path: string): { data: { publicUrl: string } };
+    };
+  };
+}
+
+export interface SupabaseStorageOptions {
+  /** Bucket name, or a function of the asset kind for per-kind buckets. */
+  bucket?: string | ((kind: AssetKind) => string);
+  /** Object path. Defaults to a random name that keeps the original extension. */
+  path?: (file: File, ctx: UploadContext) => string;
+}
+
+/**
+ * Uploader backed by a Supabase Storage bucket. Declares no `uploadByUrl`:
+ * re-hosting a remote URL needs a server-side fetch the browser cannot do, so
+ * Blok's documented fallback (store the URL verbatim) applies instead.
+ */
+export function supabaseStorage(client: SupabaseLike, options?: SupabaseStorageOptions): BlokUploader;
+
+/** What the preset asks its signer for before it can PUT a file. */
+export interface SignRequest {
+  fileName: string;
+  mimeType: string;
+  size: number;
+  kind: AssetKind;
+}
+
+/** What the signer hands back so the browser can PUT straight to the bucket. */
+export interface SignedTarget {
+  /** Short-lived URL the browser PUTs to. */
+  uploadUrl: string;
+  /** Where the object will be readable once stored. */
+  publicUrl: string;
+  /** Headers the signature covers — they must be sent verbatim or it fails. */
+  headers?: Record<string, string>;
+}
+
+export interface PresignedStorageOptions {
+  sign(request: SignRequest): Promise<SignedTarget>;
+}
+
+/**
+ * Uploader for any provider fronted by a signer — S3, R2, or anything
+ * S3-compatible. The consumer's own backend mints the signed URL, so
+ * credentials never reach the browser. Declares no `uploadByUrl`, same
+ * reasoning as {@link supabaseStorage}.
+ */
+export function presignedStorage(options: PresignedStorageOptions): BlokUploader;
+
+export interface CloudinaryStorageOptions {
+  cloudName: string;
+  /** An UNSIGNED upload preset — a signed one would need a server. */
+  uploadPreset: string;
+  folder?: string;
+}
+
+/**
+ * Uploader backed by Cloudinary's unsigned upload API. Unlike the other
+ * presets, this one declares a real `uploadByUrl`: Cloudinary fetches remote
+ * URLs server-side itself, so re-hosting works without any server of the
+ * consumer's own.
+ */
+export function cloudinaryStorage(options: CloudinaryStorageOptions): BlokUploader;
+
+export interface IndexedDBStorageOptions {
+  dbName?: string;
+}
+
+/**
+ * Uploader backed by IndexedDB — for demos and local-first apps with no
+ * backend. Returns a `blok:asset/<id>` reference rather than a `blob:` URL:
+ * blob URLs are scoped to the page that created them, so saving one produces
+ * a broken image after a reload, which is exactly what this preset exists to
+ * avoid.
+ */
+export function indexedDBStorage(options?: IndexedDBStorageOptions): BlokUploader;
+
+/**
+ * Turns a `blok:asset/<id>` reference back into a `blob:` URL an `<img>` can
+ * display. Any value that is not a `blok:asset/` reference — `http(s)`, or
+ * anything else — is returned unchanged; validating that a URL is safe to
+ * render remains the host's job. Resolves `null` when the reference is not
+ * (or no longer) stored.
+ */
+export function resolveBlokObjectUrl(url: string, options?: IndexedDBStorageOptions): Promise<string | null>;