edytor 1.0.0 → 3.0.0

package/dist/plugins/media/empty.svelte.js

@@ -1,5 +1,6 @@
 import { fileUploads } from '../uploads.svelte.js';
 import { listen } from '../../utils/listen.js';
+import { keysOf } from '../list.svelte.js';
 /** Each media kind's icon (the image's too): its menu row, its empty block, its paste offer. */
 export const MEDIA_ICONS = {
     image: '🖼',
@@ -54,7 +55,7 @@ export class MediaEmptyController {
     get readonly() {
         return !this.block || this.block.edytor.readonly;
     }
-    /** The view lists the uploads plugin and the kind takes files: offer Upload. */
+    /** The kind's plugin was given an `upload`: offer Upload. */
     get canUpload() {
         const { block } = this;
         return Boolean(block && fileUploads(block.edytor) && block.definition.upload);
@@ -64,6 +65,19 @@ export class MediaEmptyController {
         const { block } = this;
         return block ? fileUploads(block.edytor)?.of(block.id) : undefined;
     }
+    /**
+     * The file uploading into this block, shown at once: its object URL
+     * (this view's only, never stored; revoked once the upload ends), else `null`.
+     */
+    get preview() {
+        const { pending } = this;
+        return pending?.status === 'uploading' ? pending.preview : null;
+    }
+    /** The share of the upload sent, `0` to `1`; `null` before a report, or with no upload. */
+    get progress() {
+        const { pending } = this;
+        return pending?.status === 'uploading' ? pending.progress : null;
+    }
     /** Store `value` on the block: why it did not take it, or `null`. */
     #store = (value, file) => this.block && this.view ? this.view.store(this.block, value, file) : 'invalid';
     /** Embed `value` (default the `draft`): the block takes the link, or `failed` says why not. */
@@ -73,39 +87,31 @@ export class MediaEmptyController {
             fileUploads(this.block.edytor)?.clear(this.block.id);
     };
     /**
-     * Upload `file` with the view's uploader (`createUploadsPlugin`) and store the URL it answers,
-     * only on the block as it was picked from: still in the tree, of its kind
-     * and empty (a peer may have set a source, or deleted it, meanwhile).
+     * Upload `file` with its kind's uploader (its plugin's `upload`), the
+     * block showing it meanwhile (`pending`, `preview`, `progress`), and
+     * store the URL it answers, only on the block as it was picked from:
+     * still in the tree, of its kind and empty (a peer may have set a
+     * source, or deleted it, meanwhile).
      */
     upload = async (picked) => {
         const { block } = this;
-        const upload = this.canUpload && fileUploads(block?.edytor)?.upload;
-        if (!upload || !block || block.edytor.readonly)
+        const uploads = this.canUpload && fileUploads(block?.edytor);
+        if (!uploads || !block || block.edytor.readonly)
             return;
         const { edytor, id, type } = block;
-        let src;
-        try {
-            src = await upload(picked, { progress: () => { } });
-        }
-        catch {
+        const stored = await uploads.pick(id, picked, (src) => {
+            const live = edytor.idToBlock.get(id);
+            if (!live?.isInTree || live.type !== type || edytor.readonly)
+                return;
+            if (edytor.facade.blockDataOf(id)?.src !== undefined)
+                return;
+            this.failed = this.#store(src, picked);
+        });
+        if (!stored)
             this.failed = 'upload';
-            return;
-        }
-        const live = edytor.idToBlock.get(id);
-        if (!live?.isInTree || live.type !== type || edytor.readonly)
-            return;
-        if (edytor.facade.blockDataOf(id)?.src !== undefined)
-            return;
-        this.failed = this.#store(src, picked);
     };
     /** The link field (`{@attach empty.field}`): Enter embeds its `draft`. */
     field = (node) => {
-        const keydown = (event) => {
-            if (event.key !== 'Enter' || event.isComposing)
-                return;
-            event.preventDefault();
-            this.embed();
-        };
-        return listen(node, 'keydown', keydown);
+        return listen(node, 'keydown', keysOf({ Enter: () => this.embed() }));
     };
 }

package/dist/plugins/media/media.d.ts

@@ -49,6 +49,13 @@ export type FileRowPayload = {
     size: number | undefined;
     /** That size in the view's words (`media.fileSize`), `''` without one. */
     sizeLabel: string;
+    /**
+     * The file is uploading (then `src` is its object URL, this view's only,
+     * never stored): the row shows it at once, with `progress`.
+     */
+    uploading: boolean;
+    /** The share sent while it uploads, `0` to `1`; `null` before a report or once stored. */
+    progress: number | null;
     /**
      * The row's link (`<a href={row.src} {@attach row.link}>`): it downloads
      * the file under its name, in a new tab without the opener, never dragged
@@ -94,67 +101,6 @@ export declare const mediaPlugin: (kind: MediaKind, keywords: string[], own: (ed
     hooks?: PluginOperations & PluginDefinitions;
     record: Partial<BlockDefinition>;
 }) => Plugin;
-/**
- * A web page's URL a media block may store or render: the link sanitizer's
- * reading of it (`sanitizeLinkHref`: ASCII control characters and spaces stripped,
- * tab/newline anywhere), then only an absolute `http:`/`https:` URL with a
- * host. `null` for anything else: a script or `data:` URL, a `mailto:`, a
- * relative path, a bare domain.
- */
-export declare const safeWebUrl: (value: unknown) => string | null;
-/**
- * A media file's source (a video, an audio track, an attachment): a
- * {@link safeWebUrl}, or a `blob:` URL an upload answered. Never `data:`:
- * an inline file would be stored in the document and sent in every update.
- */
-export declare const safeMediaSrc: (value: unknown) => string | null;
-/** One allowlisted embed provider: which links it plays, and its player. */
-export type EmbedProvider = {
-    /** The provider's name: the frame's `title`. */
-    name: string;
-    /**
-     * The player's URL for a link of this provider, else `null`. It must be
-     * `https:` on another origin than the page's: any other answer is
-     * refused (the frame has `allow-scripts` and `allow-same-origin`, so a
-     * player on the page's origin, or on one that can script it, could lift
-     * its own sandbox). Match the host exactly (never a
-     * suffix or a substring) and check every id you copy into the player URL.
-     */
-    embed: (url: URL) => string | null;
-    /** The frame's CSS `aspect-ratio` (default `16 / 9`); ignored with `height`. */
-    aspectRatio?: string;
-    /** A fixed frame height in pixels (a music player). */
-    height?: number;
-};
-/** The frame's `sandbox`: scripts and the provider's own origin, popups that leave it; no top navigation, modals, downloads or forms. */
-export declare const EMBED_SANDBOX = "allow-scripts allow-same-origin allow-popups allow-popups-to-escape-sandbox allow-presentation";
-/** The frame's permissions (`allow`): what a player needs, nothing that reads the viewer. */
-export declare const EMBED_ALLOW = "fullscreen; picture-in-picture; encrypted-media; clipboard-write";
-/**
- * The default allowlist: YouTube (through `youtube-nocookie.com`), Vimeo,
- * Loom, Figma, CodePen and Spotify. A link no provider plays renders no
- * frame. Extend it with `createEmbedPlugin({ providers: [...EMBED_PROVIDERS, mine] })`.
- */
-export declare const EMBED_PROVIDERS: readonly EmbedProvider[];
-/**
- * The player for `value` (a stored or pasted link): the first provider of
- * `providers` that plays it, and its `https:` player URL. `null` when the
- * link is not a {@link safeWebUrl}, no provider plays it, or the player URL
- * a provider answers is not `https:` or is on the page's own origin. The frame's `src` is always this
- * answer, never the stored value.
- */
-export declare const embedSourceOf: (value: unknown, providers?: readonly EmbedProvider[]) => {
-    src: string;
-    provider: EmbedProvider;
-} | null;
-/** A file's display name from its URL's last path segment, decoded. */
-export declare const fileNameOf: (src: string) => string;
-/**
- * The element a media kind's HTML import reads: `element` itself when it
- * is a `tag` (not inside a `figure`, which claims it), or a `figure`'s own
- * `tag` child.
- */
-export declare const claimed: (element: HTMLElement, tag: string) => HTMLElement | undefined;
-/** An imported `video`'s or `audio`'s source: its `src`, else its first `source`'s. */
-export declare const mediaSourceOf: (element: HTMLElement | undefined) => string | null;
+export * from './sources.js';
+import type { EmbedProvider } from './sources.js';
 export { escapeHtml };

package/dist/plugins/media/media.js

@@ -1,6 +1,5 @@
 import { attach } from '../chrome.js';
 import { mediaKinds } from '../../crdt/semantics.js';
-import { sanitizeLinkHref } from '../richtext/richTextOperations.js';
 import { escapeHtml } from '../../clipboard/serializeClipboardFragment.js';
 import { keywordsOf, labelsOf, mediaEnglish } from '../../labels.js';
 import { MEDIA_ICONS } from './empty.svelte.js';
@@ -56,197 +55,5 @@ export const mediaPlugin = (kind, keywords, own) => (edytor) => {
         }
     };
 };
-/**
- * A web page's URL a media block may store or render: the link sanitizer's
- * reading of it (`sanitizeLinkHref`: ASCII control characters and spaces stripped,
- * tab/newline anywhere), then only an absolute `http:`/`https:` URL with a
- * host. `null` for anything else: a script or `data:` URL, a `mailto:`, a
- * relative path, a bare domain.
- */
-export const safeWebUrl = (value) => {
-    const href = sanitizeLinkHref(value);
-    if (href === null)
-        return null;
-    try {
-        const url = new URL(href);
-        return (url.protocol === 'http:' || url.protocol === 'https:') && url.host ? href : null;
-    }
-    catch {
-        return null;
-    }
-};
-/**
- * A media file's source (a video, an audio track, an attachment): a
- * {@link safeWebUrl}, or a `blob:` URL an upload answered. Never `data:`:
- * an inline file would be stored in the document and sent in every update.
- */
-export const safeMediaSrc = (value) => {
-    const blob = typeof value === 'string' ? /^blob:(.*)$/is.exec(value.trim()) : null;
-    const origin = blob && safeWebUrl(blob[1]);
-    return origin ? `blob:${origin}` : safeWebUrl(value);
-};
-/** The frame's `sandbox`: scripts and the provider's own origin, popups that leave it; no top navigation, modals, downloads or forms. */
-export const EMBED_SANDBOX = 'allow-scripts allow-same-origin allow-popups allow-popups-to-escape-sandbox allow-presentation';
-/** The frame's permissions (`allow`): what a player needs, nothing that reads the viewer. */
-export const EMBED_ALLOW = 'fullscreen; picture-in-picture; encrypted-media; clipboard-write';
-const ID = /^[\w-]{1,128}$/;
-const HASH = /^[\da-f]{1,32}$/i;
-/** `url`'s path segments (empty ones dropped) when its host is one of `hosts`, else none. */
-const on = (url, ...hosts) => hosts.includes(url.hostname.toLowerCase()) ? url.pathname.split('/').filter(Boolean) : [];
-/** A YouTube start time (`t=42`, `t=42s`, `start=42`) in seconds. */
-const youtubeStart = (url) => {
-    const t = url.searchParams.get('t') ?? url.searchParams.get('start');
-    return t && /^\d{1,6}s?$/.test(t) ? `?start=${parseInt(t, 10)}` : '';
-};
-const youtube = {
-    name: 'YouTube',
-    embed: (url) => {
-        const [first, second] = on(url, 'youtu.be', 'youtube.com', 'www.youtube.com', 'm.youtube.com', 'music.youtube.com', 'www.youtube-nocookie.com');
-        const id = url.hostname.toLowerCase() === 'youtu.be'
-            ? first
-            : first === 'watch'
-                ? url.searchParams.get('v')
-                : first && ['shorts', 'embed', 'live'].includes(first)
-                    ? second
-                    : undefined;
-        return id && /^[\w-]{11}$/.test(id)
-            ? `https://www.youtube-nocookie.com/embed/${id}${youtubeStart(url)}`
-            : null;
-    }
-};
-const vimeo = {
-    name: 'Vimeo',
-    embed: (url) => {
-        const [player, ...video] = on(url, 'player.vimeo.com');
-        const [id, hash] = player === 'video' ? video : on(url, 'vimeo.com', 'www.vimeo.com');
-        if (!id || !/^\d{1,12}$/.test(id))
-            return null;
-        const h = hash && HASH.test(hash) ? hash : url.searchParams.get('h');
-        return `https://player.vimeo.com/video/${id}${h && HASH.test(h) ? `?h=${h}` : ''}`;
-    }
-};
-const loom = {
-    name: 'Loom',
-    embed: (url) => {
-        const [kind, id] = on(url, 'loom.com', 'www.loom.com');
-        return (kind === 'share' || kind === 'embed') && id && /^[\da-f]{32}$/i.test(id)
-            ? `https://www.loom.com/embed/${id}`
-            : null;
-    }
-};
-const figma = {
-    name: 'Figma',
-    embed: (url) => {
-        const [kind, key] = on(url, 'figma.com', 'www.figma.com');
-        return key &&
-            ID.test(key) &&
-            ['file', 'design', 'proto', 'board', 'slides', 'deck'].includes(kind)
-            ? `https://www.figma.com/embed?embed_host=edytor&url=${encodeURIComponent(url.href)}`
-            : null;
-    }
-};
-const codepen = {
-    name: 'CodePen',
-    embed: (url) => {
-        const [user, kind, id] = on(url, 'codepen.io');
-        return user && ID.test(user) && (kind === 'pen' || kind === 'embed') && id && ID.test(id)
-            ? `https://codepen.io/${user}/embed/${id}?default-tab=result`
-            : null;
-    },
-    height: 400
-};
-const spotify = {
-    name: 'Spotify',
-    embed: (url) => {
-        let parts = on(url, 'open.spotify.com');
-        if (parts[0] === 'embed' || /^intl-[a-z-]+$/i.test(parts[0] ?? ''))
-            parts = parts.slice(1);
-        const [kind, id] = parts;
-        return ['track', 'album', 'playlist', 'episode', 'show', 'artist'].includes(kind) &&
-            id &&
-            /^[A-Za-z0-9]{1,64}$/.test(id)
-            ? `https://open.spotify.com/embed/${kind}/${id}`
-            : null;
-    },
-    height: 352
-};
-/**
- * The default allowlist: YouTube (through `youtube-nocookie.com`), Vimeo,
- * Loom, Figma, CodePen and Spotify. A link no provider plays renders no
- * frame. Extend it with `createEmbedPlugin({ providers: [...EMBED_PROVIDERS, mine] })`.
- */
-export const EMBED_PROVIDERS = Object.freeze([
-    youtube,
-    vimeo,
-    loom,
-    figma,
-    codepen,
-    spotify
-]);
-/**
- * `url` is on the page's own origin (in a browser): a frame there with
- * `allow-scripts` and `allow-same-origin` could remove its own sandbox.
- */
-const sameOrigin = (url) => {
-    const origin = globalThis.location?.origin;
-    return typeof origin === 'string' && url.origin === origin;
-};
-/**
- * The player for `value` (a stored or pasted link): the first provider of
- * `providers` that plays it, and its `https:` player URL. `null` when the
- * link is not a {@link safeWebUrl}, no provider plays it, or the player URL
- * a provider answers is not `https:` or is on the page's own origin. The frame's `src` is always this
- * answer, never the stored value.
- */
-export const embedSourceOf = (value, providers = EMBED_PROVIDERS) => {
-    const href = safeWebUrl(value);
-    if (!href)
-        return null;
-    const url = new URL(href);
-    for (const provider of providers) {
-        let src;
-        try {
-            src = provider.embed(new URL(url.href));
-        }
-        catch {
-            continue;
-        }
-        if (src === null || src === undefined)
-            continue;
-        try {
-            const player = new URL(src);
-            if (player.protocol === 'https:' && safeWebUrl(src) === src && !sameOrigin(player))
-                return { src, provider };
-        }
-        catch {
-            // An unparsable player URL is refused like any other non-https one.
-        }
-        return null;
-    }
-    return null;
-};
-/** A file's display name from its URL's last path segment, decoded. */
-export const fileNameOf = (src) => {
-    try {
-        const last = new URL(src).pathname.split('/').filter(Boolean).at(-1);
-        return last ? decodeURIComponent(last) : src;
-    }
-    catch {
-        return src;
-    }
-};
-/**
- * The element a media kind's HTML import reads: `element` itself when it
- * is a `tag` (not inside a `figure`, which claims it), or a `figure`'s own
- * `tag` child.
- */
-export const claimed = (element, tag) => {
-    if (element.localName === 'figure')
-        return [...element.children].find((child) => child.localName === tag);
-    return element.localName === tag && element.parentElement?.localName !== 'figure'
-        ? element
-        : undefined;
-};
-/** An imported `video`'s or `audio`'s source: its `src`, else its first `source`'s. */
-export const mediaSourceOf = (element) => safeMediaSrc(element?.getAttribute('src') ?? element?.querySelector('source[src]')?.getAttribute('src'));
+export * from './sources.js';
 export { escapeHtml };

package/dist/plugins/media/sources.d.ts

@@ -0,0 +1,60 @@
+/**
+ * The media kinds' pure source rules: which URL a media block may store or
+ * render, the embed providers and their players, a file's name, the element
+ * an import reads. No DOM state, no Svelte: the export entry reads them too.
+ */
+import { safeMediaSrc, safeWebUrl } from '../../utils/sanitize.js';
+export { safeMediaSrc, safeWebUrl };
+/** One allowlisted embed provider: which links it plays, and its player. */
+export type EmbedProvider = {
+    /** The provider's name: the frame's `title`. */
+    name: string;
+    /**
+     * The player's URL for a link of this provider, else `null`. It must be
+     * `https:` on another origin than the page's: any other answer is
+     * refused (the frame has `allow-scripts` and `allow-same-origin`, so a
+     * player on the page's origin, or on one that can script it, could lift
+     * its own sandbox). Match the host exactly (never a
+     * suffix or a substring) and check every id you copy into the player URL.
+     */
+    embed: (url: URL) => string | null;
+    /** The frame's CSS `aspect-ratio` (default `16 / 9`); ignored with `height`. */
+    aspectRatio?: string;
+    /** A fixed frame height in pixels (a music player). */
+    height?: number;
+};
+/** The frame's `sandbox`: scripts and the provider's own origin, popups that leave it; no top navigation, modals, downloads or forms. */
+export declare const EMBED_SANDBOX = "allow-scripts allow-same-origin allow-popups allow-popups-to-escape-sandbox allow-presentation";
+/** The frame's permissions (`allow`): what a player needs, nothing that reads the viewer. */
+export declare const EMBED_ALLOW = "fullscreen; picture-in-picture; encrypted-media; clipboard-write";
+/**
+ * The default allowlist: YouTube (through `youtube-nocookie.com`), Vimeo,
+ * Loom, Figma, CodePen and Spotify. A link no provider plays renders no
+ * frame. Extend it with `createEmbedPlugin({ providers: [...EMBED_PROVIDERS, mine] })`.
+ */
+export declare const EMBED_PROVIDERS: readonly EmbedProvider[];
+/**
+ * The player for `value` (a stored or pasted link): the first provider of
+ * `providers` that plays it, and its `https:` player URL. `null` when the
+ * link is not a {@link safeWebUrl}, no provider plays it, or the player URL
+ * a provider answers is not `https:` or is on the page's own origin. The frame's `src` is always this
+ * answer, never the stored value.
+ */
+export declare const embedSourceOf: (value: unknown, providers?: readonly EmbedProvider[]) => {
+    src: string;
+    provider: EmbedProvider;
+} | null;
+/** A file's display name from its URL's last path segment, decoded. */
+export declare const fileNameOf: (src: string) => string;
+/** A file block's name: its stored `name`, else its source's last segment (`''` without one). */
+export declare const fileNameFor: (data: {
+    name?: unknown;
+} | undefined, src: string | null) => string;
+/**
+ * The element a media kind's HTML import reads: `element` itself when it
+ * is a `tag` (not inside a `figure`, which claims it), or a `figure`'s own
+ * `tag` child.
+ */
+export declare const claimed: (element: HTMLElement, tag: string) => HTMLElement | undefined;
+/** An imported `video`'s or `audio`'s source: its `src`, else its first `source`'s. */
+export declare const mediaSourceOf: (element: HTMLElement | undefined) => string | null;

package/dist/plugins/media/sources.js

@@ -0,0 +1,165 @@
+/**
+ * The media kinds' pure source rules: which URL a media block may store or
+ * render, the embed providers and their players, a file's name, the element
+ * an import reads. No DOM state, no Svelte: the export entry reads them too.
+ */
+import { safeMediaSrc, safeWebUrl } from '../../utils/sanitize.js';
+export { safeMediaSrc, safeWebUrl };
+/** The frame's `sandbox`: scripts and the provider's own origin, popups that leave it; no top navigation, modals, downloads or forms. */
+export const EMBED_SANDBOX = 'allow-scripts allow-same-origin allow-popups allow-popups-to-escape-sandbox allow-presentation';
+/** The frame's permissions (`allow`): what a player needs, nothing that reads the viewer. */
+export const EMBED_ALLOW = 'fullscreen; picture-in-picture; encrypted-media; clipboard-write';
+const ID = /^[\w-]{1,128}$/;
+const HASH = /^[\da-f]{1,32}$/i;
+/** `url`'s path segments (empty ones dropped) when its host is exactly one `hosts` matches, else none. */
+const on = (url, hosts) => hosts.test(url.hostname) ? url.pathname.split('/').filter(Boolean) : [];
+const youtube = {
+    name: 'YouTube',
+    embed: (url) => {
+        const [first = '', second] = on(url, /^((www\.|m\.|music\.)?youtube\.com|youtu\.be|www\.youtube-nocookie\.com)$/);
+        const id = url.hostname === 'youtu.be'
+            ? first
+            : first === 'watch'
+                ? url.searchParams.get('v')
+                : /^(shorts|embed|live)$/.test(first) && second;
+        // A start time (`t=42`, `t=42s`, `start=42`) in seconds.
+        const t = url.searchParams.get('t') ?? url.searchParams.get('start');
+        return id && /^[\w-]{11}$/.test(id)
+            ? `https://www.youtube-nocookie.com/embed/${id}${t && /^\d{1,6}s?$/.test(t) ? `?start=${parseInt(t, 10)}` : ''}`
+            : null;
+    }
+};
+const vimeo = {
+    name: 'Vimeo',
+    embed: (url) => {
+        const [player, ...video] = on(url, /^player\.vimeo\.com$/);
+        const [id, hash] = player === 'video' ? video : on(url, /^(www\.)?vimeo\.com$/);
+        const h = hash && HASH.test(hash) ? hash : url.searchParams.get('h');
+        return id && /^\d{1,12}$/.test(id)
+            ? `https://player.vimeo.com/video/${id}${h && HASH.test(h) ? `?h=${h}` : ''}`
+            : null;
+    }
+};
+const loom = {
+    name: 'Loom',
+    embed: (url) => {
+        const [kind = '', id = ''] = on(url, /^(www\.)?loom\.com$/);
+        return /^(share|embed)$/.test(kind) && /^[\da-f]{32}$/i.test(id)
+            ? `https://www.loom.com/embed/${id}`
+            : null;
+    }
+};
+const figma = {
+    name: 'Figma',
+    embed: (url) => {
+        const [kind = '', key = ''] = on(url, /^(www\.)?figma\.com$/);
+        return ID.test(key) && /^(file|design|proto|board|slides|deck)$/.test(kind)
+            ? `https://www.figma.com/embed?embed_host=edytor&url=${encodeURIComponent(url.href)}`
+            : null;
+    }
+};
+const codepen = {
+    name: 'CodePen',
+    embed: (url) => {
+        const [user = '', kind = '', id = ''] = on(url, /^codepen\.io$/);
+        return ID.test(user) && /^(pen|embed)$/.test(kind) && ID.test(id)
+            ? `https://codepen.io/${user}/embed/${id}?default-tab=result`
+            : null;
+    },
+    height: 400
+};
+const spotify = {
+    name: 'Spotify',
+    embed: (url) => {
+        let parts = on(url, /^open\.spotify\.com$/);
+        if (/^(embed|intl-[a-z-]+)$/i.test(parts[0] ?? ''))
+            parts = parts.slice(1);
+        const [kind = '', id = ''] = parts;
+        return /^(track|album|playlist|episode|show|artist)$/.test(kind) &&
+            /^[A-Za-z0-9]{1,64}$/.test(id)
+            ? `https://open.spotify.com/embed/${kind}/${id}`
+            : null;
+    },
+    height: 352
+};
+/**
+ * The default allowlist: YouTube (through `youtube-nocookie.com`), Vimeo,
+ * Loom, Figma, CodePen and Spotify. A link no provider plays renders no
+ * frame. Extend it with `createEmbedPlugin({ providers: [...EMBED_PROVIDERS, mine] })`.
+ */
+export const EMBED_PROVIDERS = Object.freeze([
+    youtube,
+    vimeo,
+    loom,
+    figma,
+    codepen,
+    spotify
+]);
+/**
+ * `url` is on the page's own origin (in a browser): a frame there with
+ * `allow-scripts` and `allow-same-origin` could remove its own sandbox.
+ */
+const sameOrigin = (url) => {
+    const origin = globalThis.location?.origin;
+    return typeof origin === 'string' && url.origin === origin;
+};
+/**
+ * The player for `value` (a stored or pasted link): the first provider of
+ * `providers` that plays it, and its `https:` player URL. `null` when the
+ * link is not a {@link safeWebUrl}, no provider plays it, or the player URL
+ * a provider answers is not `https:` or is on the page's own origin. The frame's `src` is always this
+ * answer, never the stored value.
+ */
+export const embedSourceOf = (value, providers = EMBED_PROVIDERS) => {
+    const href = safeWebUrl(value);
+    if (!href)
+        return null;
+    const url = new URL(href);
+    for (const provider of providers) {
+        let src;
+        try {
+            src = provider.embed(new URL(url.href));
+        }
+        catch {
+            continue;
+        }
+        if (src === null || src === undefined)
+            continue;
+        try {
+            const player = new URL(src);
+            if (player.protocol === 'https:' && safeWebUrl(src) === src && !sameOrigin(player))
+                return { src, provider };
+        }
+        catch {
+            // An unparsable player URL is refused like any other non-https one.
+        }
+        return null;
+    }
+    return null;
+};
+/** A file's display name from its URL's last path segment, decoded. */
+export const fileNameOf = (src) => {
+    try {
+        const last = new URL(src).pathname.split('/').filter(Boolean).at(-1);
+        return last ? decodeURIComponent(last) : src;
+    }
+    catch {
+        return src;
+    }
+};
+/** A file block's name: its stored `name`, else its source's last segment (`''` without one). */
+export const fileNameFor = (data, src) => String(data?.name || (src && fileNameOf(src)) || '');
+/**
+ * The element a media kind's HTML import reads: `element` itself when it
+ * is a `tag` (not inside a `figure`, which claims it), or a `figure`'s own
+ * `tag` child.
+ */
+export const claimed = (element, tag) => {
+    if (element.localName === 'figure')
+        return [...element.children].find((child) => child.localName === tag);
+    return element.localName === tag && element.parentElement?.localName !== 'figure'
+        ? element
+        : undefined;
+};
+/** An imported `video`'s or `audio`'s source: its `src`, else its first `source`'s. */
+export const mediaSourceOf = (element) => safeMediaSrc(element?.getAttribute('src') ?? element?.querySelector('source[src]')?.getAttribute('src'));

package/dist/plugins/media/upload.css

@@ -0,0 +1,23 @@
+/* Loaded by the preview's module: a file uploading, drawn by the plugin when
+   the view has no empty markup (`createMediaEmptyPlugin`). */
+[data-edytor-upload] {
+	display: flex;
+	position: relative;
+	flex-direction: column;
+	gap: 6px;
+}
+[data-edytor-upload] img {
+	display: block;
+	max-width: 100%;
+}
+[data-edytor-upload] progress {
+	width: 100%;
+	height: 4px;
+}
+[data-edytor-upload-image] progress {
+	position: absolute;
+	right: 8px;
+	bottom: 8px;
+	left: 8px;
+	width: auto;
+}

package/dist/plugins/media/urlPaste.svelte.d.ts

@@ -43,10 +43,11 @@ export declare class UrlPasteController extends ChromeList {
     } | null;
     constructor(edytor: Edytor);
     protected get count(): number;
-    get readonly(): boolean;
     close: () => void;
     /** Pick a row: keep the link, or turn the line into the offer's kind. */
     pick: (option?: UrlPasteOption | undefined) => void;
+    /** Where the menu stands (`ChromeAnchor`): the pasted line, which your `menu` places itself under. */
+    readonly anchor: import("../chrome.js").ChromeAnchor;
 }
 /**
  * Register `offer` on `edytor`'s URL paste menu. The first plugin to offer