@atom-forge/brickee 0.0.1 → 0.0.3

package/docs/hu/writing-plugins.md

@@ -21,7 +21,6 @@ Egy plugin egy `BlockPlugin` objektum és két Svelte-komponens: egy **nézet**
 | `accepts` | `string[]` | Egy tároló blokk megengedett beágyazott blokkjai, palettaazonosítókként; az `'md:*'` az összes beépített blokk. Alapértelmezés: minden, amit az alkalmazás kínál. |
 | `markdown` | `(props: P, ctx: MarkdownContext) => string` | A markdown alakja (opcionális). |
 | `unique` | `boolean` | Dokumentumonként legfeljebb egy, csak a legfelső szinten. |
-| `gate` | `boolean` | Az utána következő blokkok védettek; az előnézet megjelöli őket. |
 
 A `P` a plugin props-típusa; `Record<string, unknown>`-t kiterjesztő interfészként deklaráld.
 
@@ -141,7 +140,7 @@ Regisztráld a többi mellé:
 
 > **A props a felhasználóktól jön**
 >
-> Egy plugin propsa az, ami el lett tárolva — amit egy szerkesztő begépelt, beillesztett, vagy amit bárki, aki dokumentumot menthet, elküldött az API-dnak. A séma csak az alakot ellenőrzi. Minden előnézetnek megbízhatatlanként kell kezelnie a propsot: a színeket a `safeColor`-on keresztül vedd át, ellenőrizd a linkeket, korlátozd a számokat, a képeket pedig a médialistában keresd ki, ne a tárolt URL-eket használd. A Svelte escape-eli a `{...}`-ban lévő szöveget; propot soha ne tegyél `{@html}`-be.
+> Egy plugin propsa az, ami el lett tárolva — amit egy szerkesztő begépelt, beillesztett, vagy amit bárki, aki dokumentumot menthet, elküldött az API-dnak. A séma csak az alakot ellenőrzi. Minden előnézetnek megbízhatatlanként kell kezelnie a propsot: a színeket a `safeColor`-on keresztül vedd át, ellenőrizd a linkeket és a képek címét, és korlátozd a számokat. A Svelte escape-eli a `{...}`-ban lévő szöveget; propot soha ne tegyél `{@html}`-be.
 
 ## Mezők
 
@@ -151,9 +150,9 @@ Minden `PropField` egy beállítás a blokk tetején. A szerkesztő rajzolja ki
 |---|---|
 | `key` | A prop, amelyet szerkeszt. |
 | `label` | A címkéje (a `messages`-en keresztül fordítva). |
-| `kind` | `text`, `textarea`, `color`, `select`, `slider`, `image` vagy `images`. |
+| `kind` | `text`, `textarea`, `color`, `select`, `slider` vagy `toggles`. |
 | `placeholder` | Üres szövegmező tippje; opcionális színnél az a szín, amelyről a „none” gombra kattintás indul. |
-| `options` | `{ value, label }[]` a `select`-hez, valamint az értékeken lépkedő `slider`-hez. Egy opció címkéje tartalmazhat `{n}`-t, amelyet az értéke tölt ki. |
+| `options` | `{ value, label }[]` a `select`-hez, valamint az értékeken lépkedő `slider`-hez. Egy opció címkéje tartalmazhat `{n}`-t, amelyet az értéke tölt ki. A `toggles`-hez `{ value, label, icon }[]`: az `icon` a gomb, a `label` a buboréksúgója. |
 | `min`, `max`, `step`, `unit` | Számcsúszka (`slider`): a tartománya, a lépésköze (alapértelmezés 1) és az érték után mutatott mértékegység. |
 | `none` | A beállítatlan állapot címkéje: számcsúszkánál a `min`-től balra lévő rovátka, opcionális színnél a „none” gomb. |
 | `views` | Nézetenkénti értékek egy `slider`-hez (lásd [Nézetenkénti értékek](host-contexts.md#nézetenkénti-értékek)). |
@@ -169,8 +168,7 @@ Az egyes fajták így tárolják az értéküket:
 | `slider` `options`-szel | A csúszka pozíciójában lévő opció értéke. |
 | `slider` `min`-nel és `max`-szal | A szám szövegként (például `'56'`); a `none` rovátka eltávolítja a kulcsot. |
 | `color` | Egy `#rrggbb` szöveg; `none` esetén a törlése eltávolítja a kulcsot. |
-| `image` | A kiválasztott médiaelem `id`-ja; újbóli kiválasztása eltávolítja. |
-| `images` | Azonosítók tömbje, kiválasztási sorrendben; egy már kiválasztott elem újbóli kiválasztása kiveszi. |
+| `toggles` | A bekapcsolt opciók listája az `options` sorrendjében (ha egy sincs, `[]`); ilyen a beépített táblázat fejléce és lábléce. |
 
 Az üres érték (`''`, `null` vagy `undefined`, akkor is, ha a `parse` adja vissza) eltávolítja a kulcsot a `props`-ból, ezért az előnézetnek mindig kezelnie kell a hiányzó propot. A mező `parse`-a jó hely a bemenet normalizálására is: a mellékelt YouTube-mező bármilyen YouTube-linket elfogad, de csak a videó azonosítóját tárolja.
 
@@ -189,7 +187,7 @@ A `props`-ot és a `blocks`-ot akkor is `$bindable()`-lel deklaráld, ha a néze
 
 ## Az előnézet
 
-Az előnézet `PluginPreviewProps`-ot kap: `props`, `blocks` és `plugins`. Ez egy egyszerű Svelte-komponens, amely az oldal számára rendereli a blokkot. A média, a szövegek és a nézet a kontextusokon keresztül érhető el (`useMedia`, `useText`, `useView`; lásd [Az alkalmazás kontextusai](host-contexts.md)).
+Az előnézet `PluginPreviewProps`-ot kap: `props`, `blocks` és `plugins`. Ez egy egyszerű Svelte-komponens, amely az oldal számára rendereli a blokkot. A szövegek és a nézet a kontextusokon keresztül érhető el (`useText`, `useView`; lásd [Az alkalmazás kontextusai](host-contexts.md)); a képek a plugin saját ügyei (lásd [Képek](#képek)).
 
 ## Tárolók
 
@@ -262,23 +260,13 @@ Hogyan működik a beágyazás:
 - Blokkok tárolóba csomagolását az „Átalakítás” menüből, illetve egy tároló másikká alakítását csak akkor kínálja fel, ha a tároló minden bekerülő blokkot elfogad.
 - A `blocksSchemaFor(plugins)` a szerveren ellenőrzi az `accepts`-et (lásd [A szerveren](server-side.md)).
 
-## Egyedi és kapus blokkok
+## Egyedi blokkok
 
-- **`unique: true`** — dokumentumonként legfeljebb egy, a legfelső szinten. Amint a dokumentumban van egy, a plugin eltűnik a perjeles és az „Átalakítás” menüből; beágyazott szerkesztő soha nem kínálja.
-- **`gate: true`** — az első legfelső szintű kapus blokk utáni blokkok védettek. A `Preview` egy „For supporters only” jelölésű, szaggatott vonallal elválasztott szakaszban rendereli őket; a `markGated={false}` kikapcsolja a jelölést. A beágyazott előnézetek soha nem osztódnak ketté.
-
-Mindkettőre tipikus példa egy csak támogatóknak szóló elválasztó: dokumentumonként egy, mögötte a védett tartalommal.
-
-> **A kapu csak jelöl**
->
-> A `gate` semmit sem rejt el: az előnézet továbbra is minden blokkot renderel, és a tárolt dokumentum is mindet tartalmazza. Annak eldöntése, hogy ki olvashatja a védett részt — és hogy mindenki más elől kimaradjon az oldalról —, az alkalmazás feladata, a szerveren (lásd [Védett tartalom](server-side.md#védett-tartalom)). A `unique`-ot a séma sem kényszeríti ki.
+**`unique: true`** — dokumentumonként legfeljebb egy, a legfelső szinten (például egy tartalomjegyzék). Amint a dokumentumban van egy, a plugin eltűnik a perjeles és az „Átalakítás” menüből, a beillesztett második példány a markdown alakjára esik vissza, és beágyazott szerkesztő soha nem kínálja. A séma nem kényszeríti ki.
 
 ## Markdown alak
 
-A `markdown(props, { inner, media })` markdownként adja vissza a blokkot; ezt használja a szerkesztő blokkok másolásakor, és a `toMarkdown`:
-
-- `inner` — a beágyazott blokkok, már markdownként (`''`, ha nincsenek);
-- `media` — a dokumentum médiája, hogy egy kép azonosítóját a `findMedia(media, id)?.url`-lel URL-lé alakíthasd.
+A `markdown(props, { inner })` markdownként adja vissza a blokkot; ezt használja a szerkesztő blokkok másolásakor, és a `toMarkdown`. Az `inner` a beágyazott blokkok, már markdownként (`''`, ha nincsenek).
 
 `''` visszaadásával kihagyod a blokkot. Azoknak a pluginoknak, amelyek kimenetének szövegként nincs értelme (hirdetéshely, a mellékelt `gap`), egyszerűen nincs markdown alakjuk. Három segédfüggvény gondoskodik a jól formált kimenetről:
 
@@ -288,6 +276,145 @@ A `markdown(props, { inner, media })` markdownként adja vissza a blokkot; ezt h
 | `mdJoin(...parts)` | Különálló blokkokként fűzi össze a részeket (köztük üres sorral), kihagyva az üreseket és a hamis értékűeket. |
 | `mdQuote(md)` | Minden sor elé `> `-t tesz, idézetblokként renderelt dobozhoz. |
 
+## Beillesztett táblázatok fogadása
+
+Ha GFM-táblázatot tartalmazó markdownt illesztenek be a szerkesztőbe, vagy a `fromMarkdown(text, { plugins })` olvassa be, a táblázatot az első olyan plugin kapja, amelynek van `fromTable` függvénye. Megkapja a táblázatot, és visszaadja az új blokk propjait:
+
+```ts
+interface MarkdownTable {
+	rows: string[][]; // a cellák inline markdownként, soronként; az első sor a fejléc
+	align: ('left' | 'center' | 'right')[]; // oszloponként, az elválasztó sorból (:--, :-:, --:)
+}
+
+fromTable?(table: MarkdownTable): P;
+```
+
+A beépített `table` pluginnak van ilyen (`fromTable: ({ rows, align }) => ({ rows, heads: ['top'], align })`), így egy olyan szerkesztőbe beillesztett táblázat, amely felkínálja, táblázat blokk lesz. Ilyen plugin nélkül a táblázat szöveg marad.
+
+## Fájlok fogadása
+
+Ha fájlokat illesztenek be a szerkesztőbe (egy kimásolt kép, egy képernyőkép), vagy az oldalon kívülről dobnak rá, a szerkesztő által felkínált pluginok közül az első, amelynek van `fromFiles` függvénye és propokat ad vissza, kap egy saját blokkot:
+
+```ts
+fromFiles?(files: File[]): P | null | Promise<P | null>;
+```
+
+`null`-lal a következő pluginra hagyja a fájlokat. A feltöltés és a tárolás a plugin dolga, ezért visszaadhat promise-t is – feltölt, majd a tárolt URL-lel vagy azonosítóval adja vissza a propokat. A beillesztett fájl a kurzort tartalmazó blokk után kerül (vagy egy üres blokk helyére), a bedobott oda, ahol a húzásjelző vonal mutatja.
+
+```ts
+fromFiles: async (files) => {
+	const file = files.find((f) => f.type.startsWith('image/'));
+	if (!file) return null;
+	const url = await uploadToMyStorage(file); // az alkalmazásod feltöltése
+	return { url, alt: file.name };
+},
+```
+
+## Képek
+
+A szerkesztő nem ismeri a kép fogalmát: nincs képmező, nincs képválasztó, nincs médialista. Hogy egy blokk a kép URL-jét vagy az alkalmazás saját médiatárában lévő kép azonosítóját tárolja, hogyan választja ki a felhasználó, és hogyan lesz a tárolt értékből cím, az az alkalmazás döntése, így a képblokk az alkalmazás egy közönséges pluginja.
+
+Egy minimális `photo` plugin a kép címét tárolja, amelyet egy szövegmezőbe kell beírni, mellette alternatív szöveggel és magasságcsúszkával:
+
+```svelte
+<!-- PhotoView.svelte -->
+<script lang="ts" module>
+	export interface PhotoProps extends Record<string, unknown> {
+		/** A kép címe. */
+		url: string;
+		alt: string;
+		/** A magasság a szélesség %-ában (20–150), vagy beállítatlan a kép saját alakjához. */
+		ratio?: unknown;
+	}
+
+	/** A tárolt cím, ha http(s) vagy az oldalon belüli, különben ''. */
+	export const imageSrc = (u: unknown) => {
+		const s = String(u ?? '').trim();
+		return /^(https?:|\/(?!\/))/.test(s) ? s : '';
+	};
+
+	/** CSS aspect-ratio egy tárolt magasságból, vagy undefined. */
+	export const aspect = (v: unknown) => {
+		const n = Number(v);
+		return n >= 20 && n <= 150 ? `100 / ${n}` : undefined;
+	};
+</script>
+
+<script lang="ts">
+	import { ImageIcon } from '@lucide/svelte';
+	import { Empty, type PluginViewProps } from '@atom-forge/brickee';
+
+	let { props = $bindable(), blocks = $bindable() }: PluginViewProps<PhotoProps> = $props();
+	const src = $derived(imageSrc(props.url));
+</script>
+
+{#if src}
+	<img {src} alt={props.alt} style="max-width: 100%" />
+{:else}
+	<Empty icon={ImageIcon} text="Set the image's address above" />
+{/if}
+```
+
+```svelte
+<!-- PhotoPreview.svelte -->
+<script lang="ts">
+	import { baseValue, type PluginPreviewProps } from '@atom-forge/brickee';
+	import { aspect, imageSrc, type PhotoProps } from './PhotoView.svelte';
+
+	let { props }: PluginPreviewProps<PhotoProps> = $props();
+	const src = $derived(imageSrc(props.url));
+</script>
+
+{#if src}
+	<img {src} alt={props.alt ?? ''} style:aspect-ratio={aspect(baseValue(props.ratio))} />
+{/if}
+
+<style>
+	img {
+		width: 100%;
+		object-fit: cover;
+	}
+</style>
+```
+
+```ts
+// photo.ts
+import { ImageIcon } from '@lucide/svelte';
+import { mdText, type BlockPlugin } from '@atom-forge/brickee';
+import PhotoView, { type PhotoProps } from './PhotoView.svelte';
+import PhotoPreview from './PhotoPreview.svelte';
+
+export const photo: BlockPlugin<PhotoProps> = {
+	type: 'photo',
+	label: 'Photo',
+	hint: 'One image',
+	keys: 'photo image picture',
+	icon: ImageIcon,
+	props: () => ({ url: '', alt: '' }),
+	fields: [
+		{ key: 'url', label: 'Image', kind: 'text', placeholder: 'https://…', parse: (s) => s.trim() },
+		{ key: 'alt', label: 'Alt text', kind: 'text', placeholder: 'What the image shows' },
+		{ key: 'ratio', label: 'Height', kind: 'slider', min: 20, max: 150, unit: '%', none: 'Original' }
+	],
+	tag: () => 'photo',
+	content: 'none',
+	markdown: (p) => {
+		const src = imageSrc(p.url);
+		return src ? `![${mdText(p.alt)}](${src})` : '';
+	},
+	view: PhotoView,
+	preview: PhotoPreview
+};
+```
+
+A cím ugyanolyan prop, mint a többi, tehát megbízhatatlan: a nézet és az előnézet csak akkor rendereli, ha `http(s)` vagy az oldalon belüli cím, ahogy a gomb is ellenőrzi a linkjét.
+
+Más alkalmazások másként döntenek, de mindezt a pluginon belül:
+
+- **Médiatár.** A blokk URL helyett az alkalmazás médiatárában lévő kép azonosítóját tárolja. A nézet, az előnézet és a `markdown` az alkalmazás saját keresésével alakítja címmé az azonosítót: az alkalmazás egy moduljával, vagy egy saját Svelte-kontextussal, amelyet a szerkesztő és az előnézet fölött ad meg (a plugin-komponensek ezek alatt renderelődnek). A `markdown` komponenseken kívül fut — blokkok másolásakor és a `toMarkdown`-ban —, ezért csak modulbeli adatot használhat.
+- **Kiválasztás.** Szövegmező helyett a nézet saját választót is mutathat — egy gombot, amely megnyitja az alkalmazás médiaablakát vagy egy feltöltést —, és az eredményt a `props`-ba írja, amely kötött (bindable).
+- **Több kép.** Egy galéria egyetlen propban tárol egy listát (URL-ekből vagy azonosítókból), és ugyanígy a nézetében szerkeszti.
+
 ## A kit
 
 | Export | Fajta | Használat |
@@ -299,7 +426,6 @@ A `markdown(props, { inner, media })` markdownként adja vissza a blokkot; ezt h
 | `baseValue(value)` | függvény | Egy nézetenkénti prop alapértéke. |
 | `viewValues(value, keys)` | függvény | Egy nézetenkénti prop értéke minden nézetre. |
 | `mdText`, `mdJoin`, `mdQuote` | függvények | Markdown alakok (fent). |
-| `useMedia`, `findMedia` | függvények | A dokumentum képei (lásd [Az alkalmazás kontextusai](host-contexts.md)). |
 | `useText` | függvény | Lefordítja a plugin saját felületi szövegeit. |
 | `useView` | függvény | Az alkalmazás által éppen mutatott nézet. |
 | `Preview` | komponens | Egy tároló beágyazott blokkjait rendereli (`nested`-del). |

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atom-forge/brickee",
-	"version": "0.0.1",
+	"version": "0.0.3",
 	"author": {
 		"name": "Gergely Laborci",
 		"url": "https://github.com/laborci"
@@ -18,6 +18,7 @@
 		"prepare": "svelte-kit sync || echo ''",
 		"prepack": "(svelte-kit sync || true) && svelte-package && publint",
 		"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
+		"test": "vitest run",
 		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
 		"package": "svelte-package",
 		"prepublishOnly": "bun run prepack",
@@ -28,6 +29,7 @@
 	"ship": {
 		"verify": [
 			"bun run check",
+			"bun run test",
 			"bun run prepack",
 			"npm pack --dry-run --ignore-scripts"
 		]
@@ -87,15 +89,25 @@
 		"@atom-forge/ship": "0.2.0",
 		"@atom-forge/ui": "^0.0.37",
 		"@lucide/svelte": "^1.59.0",
-		"@sveltejs/adapter-auto": "^7.0.0",
+		"@sveltejs/adapter-static": "^4.0.1",
 		"@sveltejs/kit": "^2.50.2",
 		"@sveltejs/package": "^2.5.7",
 		"@sveltejs/vite-plugin-svelte": "^6.2.4",
+		"@tailwindcss/forms": "^0.5.11",
+		"@tailwindcss/typography": "^0.5.20",
+		"@tailwindcss/vite": "^4.3.5",
+		"happy-dom": "^21.0.4",
+		"pixelmatch": "^8.0.0",
+		"playwright-core": "^1.65.0",
+		"pngjs": "^7.0.0",
 		"publint": "^0.3.15",
+		"sass": "^1.108.2",
 		"svelte": "^5.57.1",
 		"svelte-check": "^4.4.2",
+		"tailwindcss": "^4.3.5",
 		"typescript": "^5.9.3",
 		"vite": "^7.3.1",
+		"vitest": "^5.1.0",
 		"zod": "^4.6.7"
 	},
 	"keywords": [

package/dist/ImagePicker.svelte

@@ -1,131 +0,0 @@
-<!-- The image picker popup of an image field (see PropsBar): every image attached to the document, grouped. One image:
-     a click picks it and closes; several: clicks add and remove (the numbers show the order), Done or Escape closes. -->
-<script lang="ts">
-	import { Button, getPopupManager } from '@atom-forge/ui';
-	import type { Translate } from './i18n';
-	import type { MediaItem } from './media';
-
-	interface Props {
-		media: MediaItem[];
-		multiple: boolean;
-		/** The picked ids as they are now, in order. */
-		getPicked: () => string[];
-		pick: (id: string) => void;
-		tr: Translate;
-	}
-	let { media, multiple, getPicked, pick, tr }: Props = $props();
-	const popups = getPopupManager();
-	const picked = $derived(getPicked());
-
-	function choose(id: string) {
-		pick(id);
-		if (!multiple) popups.resolve('focus');
-	}
-	function onkeydown(e: KeyboardEvent) {
-		if (e.key === 'Escape') {
-			e.preventDefault();
-			popups.resolve('focus');
-		}
-	}
-	let root = $state<HTMLElement>();
-	$effect(() => root?.focus());
-</script>
-
-<!-- svelte-ignore a11y_no_noninteractive_element_interactions -->
-<div class="light picker" role="dialog" aria-label={tr('Images')} tabindex="-1" {onkeydown} bind:this={root}>
-	{#if media.length}
-		<div class="grid">
-			{#each media as m, n (m.id)}
-				{@const at = picked.indexOf(m.id)}
-				{#if m.group && m.group !== media[n - 1]?.group}<span class="group">{m.group}</span>{/if}
-				<button type="button" class="thumb" class:on={at >= 0} title={m.name} aria-pressed={at >= 0} onclick={() => choose(m.id)}>
-					<img src={m.url} alt={m.name} />
-					{#if at >= 0}<span class="n">{multiple ? at + 1 : '✓'}</span>{/if}
-				</button>
-			{/each}
-		</div>
-		{#if multiple}
-			<div class="foot">
-				<span>{tr('{n} picked', { n: picked.length })}</span>
-				<Button compact onclick={() => popups.resolve('focus')}>{tr('Done')}</Button>
-			</div>
-		{/if}
-	{:else}
-		<p class="none">{tr('No images attached to this page yet.')}</p>
-	{/if}
-</div>
-
-<style>
-	.picker {
-		width: 360px;
-		max-height: min(440px, calc(100vh - 24px));
-		overflow: auto;
-		padding: 10px;
-		display: grid;
-		gap: 10px;
-		background: #fff;
-		color: #1d1d1f;
-		border: 1px solid #e5e5ea;
-		border-radius: 12px;
-		box-shadow: 0 10px 36px rgba(0, 0, 0, 0.2);
-		font: 13px/1.4 system-ui, sans-serif;
-		outline: none;
-	}
-	.grid {
-		display: grid;
-		grid-template-columns: repeat(5, 1fr);
-		gap: 4px;
-	}
-	.group {
-		grid-column: 1 / -1;
-		margin-top: 4px;
-		color: #8e8e96;
-		font-size: 11px;
-	}
-	.thumb {
-		position: relative;
-		padding: 0;
-		border: 2px solid transparent;
-		border-radius: 7px;
-		background: none;
-		cursor: pointer;
-	}
-	.thumb img {
-		display: block;
-		width: 100%;
-		aspect-ratio: 1;
-		object-fit: cover;
-		border-radius: 5px;
-	}
-	.thumb.on {
-		border-color: var(--color-accent, #ea580c);
-	}
-	.n {
-		position: absolute;
-		top: 2px;
-		right: 2px;
-		min-width: 16px;
-		height: 16px;
-		padding: 0 3px;
-		border-radius: 8px;
-		background: var(--color-accent, #ea580c);
-		color: #fff;
-		font: 600 10px/16px system-ui, sans-serif;
-	}
-	.foot {
-		position: sticky;
-		bottom: -10px;
-		margin: 0 -10px -10px;
-		padding: 8px 10px;
-		display: flex;
-		align-items: center;
-		justify-content: space-between;
-		background: #fff;
-		border-top: 1px solid #e5e5ea;
-		color: #8e8e96;
-	}
-	.none {
-		margin: 0;
-		color: #8e8e96;
-	}
-</style>

package/dist/ImagePicker.svelte.d.ts

@@ -1,13 +0,0 @@
-import type { Translate } from './i18n';
-import type { MediaItem } from './media';
-interface Props {
-    media: MediaItem[];
-    multiple: boolean;
-    /** The picked ids as they are now, in order. */
-    getPicked: () => string[];
-    pick: (id: string) => void;
-    tr: Translate;
-}
-declare const ImagePicker: import("svelte").Component<Props, {}, "">;
-type ImagePicker = ReturnType<typeof ImagePicker>;
-export default ImagePicker;

package/dist/media.d.ts

@@ -1,17 +0,0 @@
-export interface MediaItem {
-    /** Stored in the block's props. */
-    id: string;
-    /** File name or title, shown in the picker. */
-    name: string;
-    /** Address of the image (a thumbnail size is fine for the editor). */
-    url: string;
-    /** Where it comes from (e.g. the attachment category), shown as a heading in the picker. */
-    group?: string;
-}
-type Get = () => MediaItem[];
-/** Call in a component's init. Without its own list, a nested editor or preview keeps its parent's. */
-export declare function provideMedia(own: () => MediaItem[] | undefined): void;
-/** Call in a component's init; the returned function reads the current list. */
-export declare const useMedia: () => Get;
-export declare const findMedia: (list: MediaItem[], id: unknown) => MediaItem | undefined;
-export {};

package/dist/media.js

@@ -1,12 +0,0 @@
-// The images a document can use: the host's attachments (on a CMS page, the page's uploaded images). Blocks store
-// an attachment's id; the editor, the preview and the plugins look it up here.
-import { getContext, setContext } from 'svelte';
-const KEY = 'block-editor:media';
-/** Call in a component's init. Without its own list, a nested editor or preview keeps its parent's. */
-export function provideMedia(own) {
-    const parent = getContext(KEY);
-    setContext(KEY, () => own() ?? parent?.() ?? []);
-}
-/** Call in a component's init; the returned function reads the current list. */
-export const useMedia = () => getContext(KEY) ?? (() => []);
-export const findMedia = (list, id) => list.find((m) => m.id === id);