@bendyline/squisq-editor-react 2.11.6 → 2.11.8

package/NOTICE.md

@@ -9,22 +9,22 @@ Third-party components remain under their respective license terms.
 | Package                           | Version              | License                       | Repository                                    |
 | --------------------------------- | -------------------- | ----------------------------- | --------------------------------------------- |
 | @fortawesome/fontawesome-free     | 7.2.0                | CC-BY-4.0 AND OFL-1.1 AND MIT | https://github.com/FortAwesome/Font-Awesome   |
-| @tiptap/core                      | 2.27.2               | MIT                           | https://github.com/ueberdosis/tiptap          |
-| @tiptap/extension-heading         | 2.27.2               | MIT                           | https://github.com/ueberdosis/tiptap          |
-| @tiptap/extension-image           | 2.27.2               | MIT                           | https://github.com/ueberdosis/tiptap          |
-| @tiptap/extension-link            | 2.27.2               | MIT                           | https://github.com/ueberdosis/tiptap          |
-| @tiptap/extension-mention         | 2.27.2               | MIT                           | https://github.com/ueberdosis/tiptap          |
-| @tiptap/extension-placeholder     | 2.27.2               | MIT                           | https://github.com/ueberdosis/tiptap          |
-| @tiptap/extension-table           | 2.27.2               | MIT                           | https://github.com/ueberdosis/tiptap          |
-| @tiptap/extension-table-cell      | 2.27.2               | MIT                           | https://github.com/ueberdosis/tiptap          |
-| @tiptap/extension-table-header    | 2.27.2               | MIT                           | https://github.com/ueberdosis/tiptap          |
-| @tiptap/extension-table-row       | 2.27.2               | MIT                           | https://github.com/ueberdosis/tiptap          |
-| @tiptap/extension-task-item       | 2.27.2               | MIT                           | https://github.com/ueberdosis/tiptap          |
-| @tiptap/extension-task-list       | 2.27.2               | MIT                           | https://github.com/ueberdosis/tiptap          |
-| @tiptap/pm                        | 2.27.2               | MIT                           | https://github.com/ueberdosis/tiptap          |
-| @tiptap/react                     | 2.27.2               | MIT                           | https://github.com/ueberdosis/tiptap          |
-| @tiptap/starter-kit               | 2.27.2               | MIT                           | https://github.com/ueberdosis/tiptap          |
-| @tiptap/suggestion                | 2.27.2               | MIT                           | https://github.com/ueberdosis/tiptap          |
+| @tiptap/core                      | 2.27.3               | MIT                           | https://github.com/ueberdosis/tiptap          |
+| @tiptap/extension-heading         | 2.27.3               | MIT                           | https://github.com/ueberdosis/tiptap          |
+| @tiptap/extension-image           | 2.27.3               | MIT                           | https://github.com/ueberdosis/tiptap          |
+| @tiptap/extension-link            | 2.27.3               | MIT                           | https://github.com/ueberdosis/tiptap          |
+| @tiptap/extension-mention         | 2.27.3               | MIT                           | https://github.com/ueberdosis/tiptap          |
+| @tiptap/extension-placeholder     | 2.27.3               | MIT                           | https://github.com/ueberdosis/tiptap          |
+| @tiptap/extension-table           | 2.27.3               | MIT                           | https://github.com/ueberdosis/tiptap          |
+| @tiptap/extension-table-cell      | 2.27.3               | MIT                           | https://github.com/ueberdosis/tiptap          |
+| @tiptap/extension-table-header    | 2.27.3               | MIT                           | https://github.com/ueberdosis/tiptap          |
+| @tiptap/extension-table-row       | 2.27.3               | MIT                           | https://github.com/ueberdosis/tiptap          |
+| @tiptap/extension-task-item       | 2.27.3               | MIT                           | https://github.com/ueberdosis/tiptap          |
+| @tiptap/extension-task-list       | 2.27.3               | MIT                           | https://github.com/ueberdosis/tiptap          |
+| @tiptap/pm                        | 2.27.3               | MIT                           | https://github.com/ueberdosis/tiptap          |
+| @tiptap/react                     | 2.27.3               | MIT                           | https://github.com/ueberdosis/tiptap          |
+| @tiptap/starter-kit               | 2.27.3               | MIT                           | https://github.com/ueberdosis/tiptap          |
+| @tiptap/suggestion                | 2.27.3               | MIT                           | https://github.com/ueberdosis/tiptap          |
 | mermaid                           | 11.16.1              | MIT                           | https://github.com/mermaid-js/mermaid         |
 | type-fest                         | 4.41.0               | MIT OR CC0-1.0                | https://github.com/sindresorhus/type-fest     |
 | @monaco-editor/react _(bundled)_  | 4.7.0                | MIT                           | https://github.com/suren-atoyan/monaco-react  |

package/dist/{chunk-DUO5XZQK.js → chunk-AKWS5KEQ.js}

@@ -1,6 +1,6 @@
 import {
   markdownToTiptap
-} from "./chunk-ES6CPRCW.js";
+} from "./chunk-MFE325P4.js";
 
 // src/blockRange.ts
 import { parseMarkdown } from "@bendyline/squisq/markdown";
@@ -273,6 +273,241 @@ import {
   DocumentVersionManager
 } from "@bendyline/squisq/versions";
 
+// src/mediaEdit/mediaEditTargets.ts
+import { collectDocMediaClips } from "@bendyline/squisq/mediaEdit";
+import { splitKeyValueToken, tokenizeAttrTokens } from "@bendyline/squisq/markdown";
+
+// src/embeddedMedia.ts
+import { parseTimeSeconds } from "@bendyline/squisq/markdown";
+import {
+  createMediaTimeMap,
+  mediaEditValuesFromAttributes,
+  parseMediaEdits
+} from "@bendyline/squisq/mediaEdit";
+import {
+  scheduleMediaClip
+} from "@bendyline/squisq/schemas";
+var VIDEO_EXT = /* @__PURE__ */ new Set(["webm", "mp4", "mov", "m4v", "ogv"]);
+var AUDIO_EXT = /* @__PURE__ */ new Set(["mp3", "wav", "ogg", "oga", "m4a", "aac", "flac", "opus"]);
+function mediaKindFromUrl(url) {
+  const ext = url.split("?")[0].split("#")[0].split(".").pop()?.toLowerCase();
+  if (!ext) return null;
+  if (VIDEO_EXT.has(ext)) return "video";
+  if (AUDIO_EXT.has(ext)) return "audio";
+  return null;
+}
+function mediaTimeAttribute(attributes, kind, name) {
+  const raw = attributes?.[`data-squisq-${kind}-${name}`];
+  if (raw == null) return void 0;
+  return parseTimeSeconds(raw) ?? void 0;
+}
+function collectEmbeddedMedia(block) {
+  const out = [];
+  const visit = (node, line) => {
+    if (!node || typeof node !== "object") return;
+    const n = node;
+    const here = n.position?.start?.line ?? line;
+    if ((n.type === "image" || n.type === "link") && typeof n.url === "string") {
+      const kind = mediaKindFromUrl(n.url);
+      if (kind) out.push({ src: n.url, kind, form: "link", sourceLine: here });
+    }
+    if (n.type === "htmlElement" && (n.tagName === "video" || n.tagName === "audio")) {
+      const kind = n.tagName === "video" ? "video" : "audio";
+      let src = typeof n.attributes?.src === "string" ? n.attributes.src : void 0;
+      if (!src && Array.isArray(n.children)) {
+        for (const child of n.children) {
+          const c = child;
+          if (c.tagName === "source" && typeof c.attributes?.src === "string") {
+            src = c.attributes.src;
+            break;
+          }
+        }
+      }
+      if (src) {
+        const startAt = mediaTimeAttribute(n.attributes, kind, "start-at");
+        const clipStart = mediaTimeAttribute(n.attributes, kind, "clip-start");
+        const clipEnd = mediaTimeAttribute(n.attributes, kind, "clip-end");
+        const edits = parseMediaEdits(mediaEditValuesFromAttributes(kind, n.attributes ?? {}));
+        out.push({
+          src,
+          kind,
+          form: "html",
+          sourceLine: here,
+          ...startAt != null ? { startAt } : {},
+          ...clipStart != null ? { clipStart } : {},
+          ...clipEnd != null ? { clipEnd } : {},
+          ...edits ? { edits } : {}
+        });
+      }
+    }
+    if (Array.isArray(n.children)) n.children.forEach((c) => visit(c, here));
+    if (Array.isArray(n.htmlChildren)) n.htmlChildren.forEach((c) => visit(c, here));
+  };
+  (block.contents ?? []).forEach((node) => visit(node, void 0));
+  return out;
+}
+function resolveEmbeddedMediaTiming(block, media) {
+  const startAt = Math.max(0, media.startAt ?? 0);
+  const sourceIn = Math.max(0, media.clipStart ?? 0);
+  const absoluteStart = block.startTime + startAt;
+  const blockEnd = block.startTime + block.duration;
+  const authoredLength = media.clipEnd == null ? null : createMediaTimeMap({ clipStart: sourceIn, clipEnd: media.clipEnd, cuts: media.edits?.cuts }).playedDuration;
+  const absoluteEnd = authoredLength == null ? blockEnd : Math.min(blockEnd, absoluteStart + authoredLength);
+  return {
+    absoluteStart,
+    absoluteEnd: Math.max(absoluteStart, absoluteEnd),
+    sourceIn
+  };
+}
+function collectEmbeddedMediaSchedule(doc, opts) {
+  const schedule = [];
+  const visit = (blocks) => {
+    for (const block of blocks) {
+      collectEmbeddedMedia(block).forEach((media, index) => {
+        const timing = resolveEmbeddedMediaTiming(block, media);
+        const clip = {
+          id: `embedded:${block.id}:${index}`,
+          src: media.src,
+          kind: media.kind,
+          startAt: media.startAt ?? 0,
+          anchor: "block",
+          ...media.clipStart != null ? { clipStart: timing.sourceIn } : {},
+          ...media.clipEnd != null ? { clipEnd: media.clipEnd } : {},
+          ...media.edits ? { edits: media.edits } : {},
+          ...media.sourceLine != null ? { sourceLine: media.sourceLine } : {}
+        };
+        schedule.push(
+          ...scheduleMediaClip(
+            clip,
+            timing.absoluteStart,
+            timing.absoluteEnd,
+            "block",
+            block.id,
+            opts
+          )
+        );
+      });
+      if (block.children?.length) visit(block.children);
+    }
+  };
+  visit(doc.blocks);
+  return schedule;
+}
+function collectEmbeddedVideoSchedule(doc) {
+  return collectEmbeddedMediaSchedule(doc).filter((clip) => clip.kind === "video");
+}
+function collectTimelinePlaybackSchedule(doc, scheduled, opts) {
+  const scheduledSources = new Set(scheduled.map((clip) => clip.src));
+  const narration = doc.audio.segments.map((segment, index) => {
+    if (scheduledSources.has(segment.src)) return null;
+    return {
+      id: `narration:${index}`,
+      kind: "audio",
+      src: segment.src,
+      absoluteStart: Math.max(0, segment.startTime),
+      absoluteEnd: Math.max(0, segment.startTime) + Math.max(0, segment.duration),
+      sourceIn: 0,
+      anchor: "document"
+    };
+  }).filter(
+    (clip) => clip !== null && clip.absoluteEnd > clip.absoluteStart
+  );
+  return [...scheduled, ...collectEmbeddedMediaSchedule(doc, opts), ...narration];
+}
+
+// src/mediaEdit/mediaEditTargets.ts
+function flatten(blocks, out = []) {
+  for (const block of blocks) {
+    out.push(block);
+    if (block.children?.length) flatten(block.children, out);
+  }
+  return out;
+}
+function listEditableMedia(doc) {
+  const items = [];
+  for (const clip of collectDocMediaClips(doc)) {
+    if (clip.sourceLine == null) continue;
+    items.push({
+      src: clip.src,
+      kind: clip.kind,
+      sourceLine: clip.sourceLine,
+      ...clip.edits ? { edits: clip.edits } : {},
+      ...clip.clipStart != null ? { clipStart: clip.clipStart } : {},
+      ...clip.clipEnd != null ? { clipEnd: clip.clipEnd } : {},
+      startAt: clip.startAt,
+      clip
+    });
+  }
+  for (const block of flatten(doc.blocks)) {
+    collectEmbeddedMedia(block).forEach((media, index) => {
+      if (media.sourceLine == null || media.form !== "html") return;
+      const clip = {
+        id: `embedded:${block.id}:${index}`,
+        src: media.src,
+        kind: media.kind,
+        startAt: media.startAt ?? 0,
+        anchor: "block",
+        sourceLine: media.sourceLine,
+        ...media.clipStart != null ? { clipStart: media.clipStart } : {},
+        ...media.clipEnd != null ? { clipEnd: media.clipEnd } : {},
+        ...media.edits ? { edits: media.edits } : {}
+      };
+      items.push({
+        src: media.src,
+        kind: media.kind,
+        sourceLine: media.sourceLine,
+        ...media.edits ? { edits: media.edits } : {},
+        ...media.clipStart != null ? { clipStart: media.clipStart } : {},
+        ...media.clipEnd != null ? { clipEnd: media.clipEnd } : {},
+        ...media.startAt != null ? { startAt: media.startAt } : {},
+        clip
+      });
+    });
+  }
+  const seen = /* @__PURE__ */ new Set();
+  return items.sort((a, b) => a.sourceLine - b.sourceLine).filter((item) => seen.has(item.sourceLine) ? false : (seen.add(item.sourceLine), true));
+}
+function findEditableMedia(doc, target) {
+  const items = listEditableMedia(doc);
+  if (target.sourceLine != null) {
+    const byLine = items.find((item) => item.sourceLine === target.sourceLine);
+    if (byLine) return byLine;
+  }
+  return items.find((item) => item.src === target.src) ?? null;
+}
+function groupCompanions(doc, item) {
+  const group = item.edits?.group;
+  if (!group) return [];
+  return listEditableMedia(doc).filter(
+    (other) => other.sourceLine !== item.sourceLine && other.edits?.group === group
+  );
+}
+function mediaTargetFromAnnotationText(text) {
+  const match = text.trim().match(/^\{\[(audio|video|media)\b([\s\S]*)\]\}$/);
+  if (!match) return null;
+  let src;
+  for (const token of tokenizeAttrTokens(match[2].trim())) {
+    const kv = splitKeyValueToken(token);
+    if (kv?.key === "src") src = kv.value;
+  }
+  if (!src) return null;
+  return { src, kind: match[1] === "video" ? "video" : "audio" };
+}
+function mediaTargetFromElement(element) {
+  const node = element.closest("[data-squisq-media-src]");
+  if (node) {
+    const src = node.dataset.squisqMediaSrc;
+    const kind = node.dataset.squisqMediaKind === "video" ? "video" : "audio";
+    return src ? { src, kind } : null;
+  }
+  const paragraph = element.closest("p");
+  return paragraph ? mediaTargetFromAnnotationText(paragraph.textContent ?? "") : null;
+}
+function embeddedMediaClips(doc) {
+  const scheduled = new Set(collectDocMediaClips(doc).map((clip) => clip.sourceLine));
+  return listEditableMedia(doc).filter((item) => item.edits && !scheduled.has(item.sourceLine)).map((item) => item.clip);
+}
+
 // src/scene/text/sceneTextChannel.ts
 function createSceneTextChannel() {
   let current = null;
@@ -342,6 +577,10 @@ function useEditorContext() {
   }
   return ctx;
 }
+function useEditorContextOptional() {
+  return useContext(EditorContext);
+}
+var MEDIA_EDIT_GC_DELAY_MS = 5e3;
 var DEFAULT_PRUNE_POLICY = { type: "keep-last-n", n: 50 };
 var DEFAULT_AUTOSAVE_IDLE_MS = 5e3;
 function normalizeBlockTagVisibility(value) {
@@ -361,6 +600,7 @@ function EditorProvider({
   versioningAutoSaveIdleMs = DEFAULT_AUTOSAVE_IDLE_MS,
   onSaveVersion,
   mediaProvider = null,
+  mediaEditRenders = null,
   imageDisplayMode = "inline",
   mentionProvider = null,
   proofing = null,
@@ -488,6 +728,13 @@ function EditorProvider({
   const closeImageEdit = useCallback2(() => {
     setImageEditTarget(null);
   }, []);
+  const [mediaEditTarget, setMediaEditTarget] = useState2(null);
+  const openMediaEdit = useCallback2((target) => {
+    setMediaEditTarget(target);
+  }, []);
+  const closeMediaEdit = useCallback2(() => {
+    setMediaEditTarget(null);
+  }, []);
   const bumpMediaRevision = useCallback2(() => {
     setMediaRevision((n) => n + 1);
   }, []);
@@ -886,6 +1133,20 @@ function EditorProvider({
       setParseError(err instanceof Error ? err.message : "Stringify error");
     }
   }, []);
+  useEffect(() => {
+    if (mediaEditRenders && doc) mediaEditRenders.sync(doc, embeddedMediaClips(doc));
+  }, [mediaEditRenders, doc]);
+  const latestDocRef = useRef(doc);
+  latestDocRef.current = doc;
+  useEffect(() => {
+    if (!mediaEditRenders) return;
+    const timer = setTimeout(() => {
+      const current = latestDocRef.current;
+      if (current) void mediaEditRenders.collectGarbage(current).catch(() => {
+      });
+    }, MEDIA_EDIT_GC_DELAY_MS);
+    return () => clearTimeout(timer);
+  }, [mediaEditRenders]);
   const value = useMemo2(
     () => ({
       markdownSource,
@@ -911,6 +1172,7 @@ function EditorProvider({
       activeBlockStartLine,
       selectionVersion,
       imageEditTarget,
+      mediaEditTarget,
       mediaRevision,
       allowRecording,
       allowNarrate,
@@ -923,6 +1185,7 @@ function EditorProvider({
       versioning,
       saveVersion,
       mediaProvider,
+      mediaEditRenders,
       imageDisplayMode,
       mentionProvider,
       proofing,
@@ -965,6 +1228,8 @@ function EditorProvider({
       replaceAll,
       openImageEdit,
       closeImageEdit,
+      openMediaEdit,
+      closeMediaEdit,
       bumpMediaRevision
     }),
     [
@@ -998,6 +1263,7 @@ function EditorProvider({
       versioning,
       saveVersion,
       mediaProvider,
+      mediaEditRenders,
       imageDisplayMode,
       mentionProvider,
       proofing,
@@ -1039,12 +1305,15 @@ function EditorProvider({
       insertAtCursor,
       replaceAll,
       imageEditTarget,
+      mediaEditTarget,
       mediaRevision,
       allowRecording,
       allowNarrate,
       preserveSourceWrapping,
       openImageEdit,
       closeImageEdit,
+      openMediaEdit,
+      closeMediaEdit,
       bumpMediaRevision
     ]
   );
@@ -1628,7 +1897,15 @@ export {
   detectLanguageFromFileName,
   resolveFileKind,
   useBlockNavigator,
+  collectEmbeddedMedia,
+  resolveEmbeddedMediaTiming,
+  collectEmbeddedVideoSchedule,
+  collectTimelinePlaybackSchedule,
+  findEditableMedia,
+  groupCompanions,
+  mediaTargetFromElement,
   useEditorContext,
+  useEditorContextOptional,
   EditorProvider,
   reviewUnderlineClass,
   findUniqueTextRange,

package/dist/{chunk-UYKOTWJM.js → chunk-E5QXSFW3.js}

@@ -1,7 +1,7 @@
 import {
   markdownToTiptap,
   tiptapToMarkdown
-} from "./chunk-ES6CPRCW.js";
+} from "./chunk-MFE325P4.js";
 
 // src/jsonEditor/JsonEditorContext.tsx
 import { createContext, useContext, useEffect, useMemo } from "react";