@bendyline/squisq-editor-react 2.1.0 → 2.3.0

package/dist/json-editor/index.d.ts

@@ -0,0 +1,27 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { SquisqAnnotatedSchema, JsonFormValidator, JsonFormValidationError } from '@bendyline/squisq/jsonForm';
+import { Theme, SurfaceScheme } from '@bendyline/squisq/schemas';
+
+interface JsonEditorProps {
+    /** Schema describing the value's shape (with optional `squisq` hints). */
+    schema: SquisqAnnotatedSchema;
+    /** Controlled value. */
+    value: unknown;
+    /** Called with the new root after each edit. Omit for read-only behavior. */
+    onChange?: (next: unknown) => void;
+    /** Optional theme. Defaults to `DEFAULT_THEME`. */
+    theme?: Theme;
+    /** Light/dark surface override; `'auto'` uses `prefers-color-scheme`. */
+    surface?: SurfaceScheme | 'auto';
+    /** Padding/gap density. Default: 'comfortable'. */
+    density?: 'comfortable' | 'compact';
+    /** Optional consumer-supplied validator (e.g. ajv-backed). */
+    validate?: JsonFormValidator;
+    /** Notified after validation runs. */
+    onValidate?: (errors: readonly JsonFormValidationError[]) => void;
+    /** Optional CSS class for the outer container. */
+    className?: string;
+}
+declare function JsonEditor(props: JsonEditorProps): react_jsx_runtime.JSX.Element;
+
+export { JsonEditor, type JsonEditorProps };

package/dist/json-editor/index.js

@@ -0,0 +1,7 @@
+import {
+  JsonEditor
+} from "../chunk-54UGTQBO.js";
+import "../chunk-NITZVAXL.js";
+export {
+  JsonEditor
+};

package/dist/monaco.d.ts

@@ -1 +1 @@
-export * from 'monaco-editor/esm/vs/editor/editor.api';
+export * from 'monaco-editor/esm/vs/editor/editor.api.js';

package/dist/monaco.js

@@ -1,4 +1,3 @@
 // src/monaco.ts
 import "monaco-editor/esm/vs/editor/editor.main.js";
-export * from "monaco-editor/esm/vs/editor/editor.api";
-//# sourceMappingURL=monaco.js.map
+export * from "monaco-editor/esm/vs/editor/editor.api.js";

package/dist/recorder/index.d.ts

@@ -0,0 +1,407 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { MediaProvider } from '@bendyline/squisq/schemas';
+import { ContentContainer } from '@bendyline/squisq/storage';
+import { CSSProperties, RefObject } from 'react';
+
+/**
+ * Format probing for MediaRecorder.
+ *
+ * Different browsers expose different container/codec combinations. Chrome
+ * and Firefox produce WebM (VP8/VP9 + Opus); Safari produces MP4 (H.264 +
+ * AAC). We probe at runtime via `MediaRecorder.isTypeSupported()` and pick
+ * the best supported option, falling back to whatever the browser hands
+ * back when no probe succeeds.
+ */
+/** What the recorded stream is intended to capture. */
+type CaptureKind = 'audio' | 'video';
+/** A probed format choice — what to pass to `MediaRecorder` and where to write it. */
+interface ResolvedFormat {
+    /** MIME type to pass to `new MediaRecorder(stream, { mimeType })`. Empty string means "let the browser pick". */
+    mimeType: string;
+    /** File extension to use when writing to the container, including the leading dot. */
+    extension: string;
+    /** Container directory inside the `ContentContainer` (no trailing slash). */
+    directory: 'audio' | 'video';
+}
+/**
+ * Resolve the format the recorder will use for a given capture kind. If a
+ * `preferred` MIME type is supported, it wins; otherwise we fall through
+ * the priority list. When nothing matches (extremely old browser), we
+ * return an empty `mimeType` — `MediaRecorder` will pick a default and we
+ * tag the file with `.webm` as a best guess.
+ */
+declare function resolveFormat(kind: CaptureKind, preferred?: string): ResolvedFormat;
+/**
+ * `MediaRecorder` support probe. Returns false when running in a
+ * non-browser environment (e.g. SSR) or on a browser that doesn't
+ * implement the API at all.
+ */
+declare function supportsMediaRecorder(): boolean;
+/**
+ * `getUserMedia` support probe (for mic / camera capture).
+ */
+declare function supportsUserMedia(): boolean;
+/**
+ * `getDisplayMedia` support probe (for screen capture). Browsers may
+ * implement `mediaDevices` without `getDisplayMedia` (Firefox on Android
+ * being the long-standing example), so this is its own probe.
+ */
+declare function supportsDisplayMedia(): boolean;
+/**
+ * Build a default filename for a recording. `basename` is a hint
+ * (e.g. user-typed name); when omitted, a sortable timestamp is used so
+ * concurrent recordings don't collide.
+ */
+declare function buildFilename(kind: CaptureKind, extension: string, basename?: string): string;
+
+/**
+ * useMediaRecorder
+ *
+ * React wrapper around `MediaRecorder` that handles stream acquisition,
+ * the recorder lifecycle, and produces a single `Blob` on stop. Selects
+ * a browser-supported MIME type via {@link resolveFormat}.
+ *
+ * Mirrors the shape of `useVideoExport` in `@bendyline/squisq-video-react`
+ * (request → start → stop → blob), inverted for capture rather than
+ * export.
+ */
+
+/** Which capture source to use. `screen+mic` mixes the microphone into the screen stream. */
+type RecorderSource = 'mic' | 'camera' | 'screen' | 'screen+mic';
+/** Discriminated state describing what the recorder is currently doing. */
+type RecorderState = 'idle' | 'requesting' | 'ready' | 'recording' | 'stopping' | 'stopped' | 'error';
+interface UseMediaRecorderOptions {
+    /** Which capture pipeline to use (default: `'mic'`). */
+    source?: RecorderSource;
+    /**
+     * Preferred MIME type override. When the browser supports it, this
+     * wins over the default candidate list. When unset (or unsupported),
+     * the hook probes a built-in priority list.
+     */
+    mimeType?: string;
+    /** Video track constraints for camera / screen sources. */
+    videoConstraints?: MediaTrackConstraints | boolean;
+    /** Audio track constraints for mic / camera / screen+mic sources. */
+    audioConstraints?: MediaTrackConstraints | boolean;
+    /**
+     * Bits-per-second hint passed to `MediaRecorder`. Most browsers cap to
+     * reasonable defaults internally; leaving this undefined is usually
+     * fine.
+     */
+    bitsPerSecond?: number;
+    /**
+     * Whether to attempt to capture system audio when `source === 'screen'`
+     * or `'screen+mic'`. Browser support is limited (desktop Chromium
+     * only); when unsupported the resulting stream simply omits it.
+     */
+    systemAudio?: boolean;
+    /**
+     * For `source === 'camera'`, whether to include the microphone track.
+     * Defaults to `true` (camera + mic). Set `false` to capture silent
+     * video. Ignored for other sources, whose mic handling is encoded in
+     * the source itself (`'mic'`, `'screen+mic'`).
+     */
+    includeMicrophone?: boolean;
+}
+interface UseMediaRecorderResult {
+    /** Current recorder state. */
+    state: RecorderState;
+    /** Live `MediaStream` after `request()` succeeds; useful for preview. */
+    stream: MediaStream | null;
+    /** Final `Blob` after `stop()` resolves, or `null` while recording. */
+    blob: Blob | null;
+    /** MIME type the recorder actually used (after `request()`). */
+    mimeType: string | null;
+    /** File extension matching `mimeType` (e.g. `.webm`). */
+    extension: string | null;
+    /** Suggested container directory (`'audio'` for mic, `'video'` for camera/screen). */
+    directory: 'audio' | 'video' | null;
+    /** Milliseconds elapsed since `start()` was called. Updates ~10× per second while recording. */
+    durationMs: number;
+    /** Most recent error, if any. */
+    error: Error | null;
+    /**
+     * Acquire the stream and prepare a `MediaRecorder`. After this resolves
+     * the hook is in `'ready'` state and a `<video>`/`<audio>` element can
+     * preview `stream`. Call `start()` to begin recording.
+     */
+    request: () => Promise<void>;
+    /** Start recording. Must be called from `'ready'`. */
+    start: () => void;
+    /**
+     * Stop recording and resolve with the resulting `Blob`. Safe to call
+     * from `'recording'`; a no-op from any other state (resolves with the
+     * existing `blob`, or `null`).
+     */
+    stop: () => Promise<Blob | null>;
+    /**
+     * Tear everything down — stops the recorder if running, releases all
+     * tracks, disposes the AudioContext mixer (if any), and returns to
+     * `'idle'`. Always safe to call.
+     */
+    cancel: () => void;
+    /** Reset state without releasing the stream. Useful for re-recording. */
+    reset: () => void;
+}
+/**
+ * Returns the kind of capture that the given source produces. Exposed
+ * separately from {@link useMediaRecorder} so non-React callers
+ * (e.g. headless tests) can resolve a format up front.
+ */
+declare function getCaptureKind(source: RecorderSource): CaptureKind;
+declare function useMediaRecorder(options?: UseMediaRecorderOptions): UseMediaRecorderResult;
+
+type RecorderColorScheme = 'light' | 'dark';
+interface RecorderModalProps {
+    /** Required — recordings are written here. */
+    mediaProvider: MediaProvider;
+    /**
+     * Optional — when provided, narration-mode recordings drop a
+     * `.timing.json` sidecar at the matching container path so
+     * `resolveAudioMapping()` can auto-link them. Without it, only the
+     * raw recording is saved.
+     */
+    container?: ContentContainer | null;
+    /** Initial capture source. Defaults to `'mic'` (narration). */
+    initialMode?: RecorderSource;
+    /** Light/dark chrome scheme. Defaults to `'light'`. */
+    colorScheme?: RecorderColorScheme;
+    /** Called after the modal is dismissed (save or cancel). */
+    onClose: () => void;
+    /**
+     * Fired after a successful save. Hosts typically use this to insert a
+     * markdown reference at the cursor — see {@link RecorderSaveResult}
+     * for the fields a host needs to build that reference.
+     */
+    onSave?: (result: RecorderSaveResult) => void;
+}
+/** Payload handed to {@link RecorderModalProps.onSave} on a successful save. */
+interface RecorderSaveResult {
+    /** Path returned by `mediaProvider.addMedia()` — what the doc should reference. */
+    relativePath: string;
+    /** Filename the modal chose (e.g. `narration-20260516-091200.webm`). */
+    filename: string;
+    /** Capture source the user picked. */
+    source: RecorderSource;
+    /** MIME type of the saved blob. */
+    mimeType: string;
+    /** Recording length in seconds. */
+    duration: number;
+    /** Whether a narration sidecar was written. Always `false` for video sources. */
+    hasTimingSidecar: boolean;
+    /** Script text the user typed (narration only). */
+    sourceText?: string;
+}
+declare function RecorderModal({ mediaProvider, container, initialMode, colorScheme, onClose, onSave, }: RecorderModalProps): react_jsx_runtime.JSX.Element;
+
+interface RecorderButtonProps {
+    /** Where to write the resulting recording. Required. */
+    mediaProvider: MediaProvider;
+    /** Optional container for narration `.timing.json` sidecar writes. */
+    container?: ContentContainer | null;
+    /** Initial capture source. Defaults to `'mic'`. */
+    initialMode?: RecorderSource;
+    /** Light/dark chrome scheme copied onto the portaled modal. */
+    colorScheme?: RecorderColorScheme;
+    /** Fired after a successful save. */
+    onSave?: (result: RecorderSaveResult) => void;
+    /** Button label. Defaults to `'Record'`. */
+    label?: string;
+    /** Optional inline button styles. */
+    style?: CSSProperties;
+    /** Whether the button is disabled. */
+    disabled?: boolean;
+}
+declare function RecorderButton({ mediaProvider, container, initialMode, colorScheme, onSave, label, style, disabled, }: RecorderButtonProps): react_jsx_runtime.JSX.Element;
+
+interface RecorderPanelProps {
+    mediaProvider: MediaProvider;
+    container?: ContentContainer | null;
+    initialMode?: RecorderSource;
+    /** Light/dark chrome scheme copied onto the portaled modal. */
+    colorScheme?: RecorderColorScheme;
+    onSave?: (result: RecorderSaveResult) => void;
+    /** ARIA / tooltip label. Defaults to `'Record media'`. */
+    tooltip?: string;
+    /** Optional className for the trigger button. */
+    className?: string;
+    /** Controlled modal state. Omit to let the panel manage its own state. */
+    open?: boolean;
+    /** Called whenever the trigger or modal requests an open-state change. */
+    onOpenChange?: (open: boolean) => void;
+    /** Render the built-in trigger button. Defaults to true. */
+    showTrigger?: boolean;
+}
+declare function RecorderPanel({ mediaProvider, container, initialMode, colorScheme, onSave, tooltip, className, open: controlledOpen, onOpenChange, showTrigger, }: RecorderPanelProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * useStreamPreview — binds a `MediaStream` to a `<video>` element's
+ * `srcObject`. Decouples the preview surface from `useMediaRecorder`,
+ * letting hosts compose the preview element however they like.
+ */
+
+/**
+ * Assign `stream` to `<video>.srcObject` whenever either changes; clears
+ * it on unmount or when `stream` is `null`. The element is set to
+ * `playsInline` + `muted` automatically because previewing your own
+ * microphone with audio playthrough creates a feedback loop.
+ *
+ * @example
+ * ```tsx
+ * const videoRef = useRef<HTMLVideoElement>(null);
+ * const { stream } = useMediaRecorder({ source: 'camera' });
+ * useStreamPreview(videoRef, stream);
+ * return <video ref={videoRef} autoPlay />;
+ * ```
+ */
+declare function useStreamPreview(ref: RefObject<HTMLVideoElement | null>, stream: MediaStream | null): void;
+
+/**
+ * Microphone-only capture via `getUserMedia({ audio: true })`.
+ */
+/**
+ * Request a microphone-only `MediaStream`. Caller owns the stream and
+ * must stop its tracks when done.
+ *
+ * @param constraints - Optional audio constraints (sample rate, device
+ *   id, echo cancellation, etc.). Defaults to `true` — let the browser
+ *   pick.
+ * @throws When `mediaDevices` is unavailable, or when the user denies
+ *   permission (the underlying `getUserMedia` rejection propagates).
+ */
+declare function requestMicStream(constraints?: MediaTrackConstraints): Promise<MediaStream>;
+
+/**
+ * Camera + microphone capture via `getUserMedia({ video, audio })`.
+ */
+interface CameraStreamOptions {
+    /** Video track constraints (resolution, facing mode, frame rate). Pass `true` for browser default, or `false` to omit video. */
+    video?: boolean | MediaTrackConstraints;
+    /** Audio track constraints. Pass `true` for browser default, or `false` to omit audio. */
+    audio?: boolean | MediaTrackConstraints;
+}
+/**
+ * Request a camera + mic `MediaStream`. Caller owns the stream and must
+ * stop its tracks when done.
+ *
+ * Both tracks are requested by default. To capture video only, pass
+ * `audio: false`; to capture audio only use {@link requestMicStream}
+ * instead.
+ *
+ * @throws When `mediaDevices` is unavailable, or when the user denies
+ *   permission.
+ */
+declare function requestCameraStream(options?: CameraStreamOptions): Promise<MediaStream>;
+
+/**
+ * Screen capture via `getDisplayMedia`, with optional microphone mixing.
+ *
+ * The browser-native `getDisplayMedia({ audio: true })` flag only
+ * captures *system* audio (and only on Chromium on desktop). For
+ * narrated screencasts, hosts usually want the speaker's voice too —
+ * we provide an opt-in "include mic" path that pulls a parallel
+ * `getUserMedia` audio track and mixes it into the screen stream via
+ * `AudioContext`, so the resulting `MediaStream` carries a single audio
+ * track and a single video track.
+ */
+interface ScreenStreamOptions {
+    /** Video constraints for the screen surface. Pass `true` for browser default. */
+    video?: boolean | MediaTrackConstraints;
+    /**
+     * Whether to attempt to capture the system audio (tab / window / monitor
+     * audio). Browser support is limited (desktop Chromium only); when the
+     * platform doesn't honor this flag, the resulting stream simply omits
+     * the system audio track.
+     */
+    systemAudio?: boolean;
+    /**
+     * Whether to also pull the microphone via `getUserMedia` and mix it
+     * into the resulting stream's audio track. When both `systemAudio` and
+     * `includeMicrophone` produce tracks, they're combined via
+     * `AudioContext` into a single output track.
+     */
+    includeMicrophone?: boolean;
+    /** Microphone track constraints, when `includeMicrophone` is true. */
+    microphoneConstraints?: MediaTrackConstraints;
+}
+/**
+ * Handle returned by {@link requestScreenStream}. The `stream` is what
+ * gets handed to `MediaRecorder`; the `dispose()` callback shuts down
+ * any auxiliary resources (the mic-mix `AudioContext` plus the raw
+ * source tracks feeding it). Callers must also stop the stream's tracks
+ * via `stream.getTracks().forEach(t => t.stop())` when done —
+ * `dispose()` cleans up everything that isn't the stream itself.
+ *
+ * IMPORTANT for callers: when the microphone is mixed in, the raw
+ * system-audio / mic tracks are deliberately NOT members of `stream`
+ * (only the single mixed output track is). So stopping `stream`'s tracks
+ * alone leaves those captures live — `dispose()` is what releases them,
+ * and it must always be called alongside the stream teardown or the
+ * screen-share indicator stays lit.
+ */
+interface ScreenStreamHandle {
+    stream: MediaStream;
+    /** Auxiliary cleanup beyond the stream tracks. Safe to call multiple times. */
+    dispose: () => void;
+}
+/**
+ * Request a screen-capture `MediaStream`, optionally with a mixed-in
+ * microphone track. Caller owns the resulting stream.
+ *
+ * @throws When `getDisplayMedia` isn't available, or when the user
+ *   cancels the picker / denies permission.
+ */
+declare function requestScreenStream(options?: ScreenStreamOptions): Promise<ScreenStreamHandle>;
+
+/**
+ * Build the `.timing.json` sidecar that pairs with a narration recording.
+ *
+ * The shape matches what `resolveAudioMapping()` in
+ * `@bendyline/squisq` reads at runtime: `sourceText`, `duration`, and
+ * `bookmarks[]`. Sidecars are stored at `<audio-path>.timing.json`
+ * inside the same `ContentContainer`, so the recorder can drop them
+ * alongside its audio file and have the existing audio-mapping pipeline
+ * pick them up with no schema changes.
+ */
+/**
+ * Word-level timing bookmark — same shape as `AudioBookmark` in
+ * `@bendyline/squisq`. Recorder output produces an empty `bookmarks`
+ * array; word-level timing is the domain of TTS pipelines, not
+ * browser-side dictation.
+ */
+interface RecordedBookmark {
+    id: string;
+    time: number;
+    charOffset: number;
+    textFragment?: string;
+}
+interface TimingJson {
+    /** Plain text the user said (or intended to say) during the recording. */
+    sourceText: string;
+    /** Recording length in seconds. */
+    duration: number;
+    /** Word-level timing data. Empty by default — populated only when a downstream tool aligns the audio. */
+    bookmarks: RecordedBookmark[];
+}
+/**
+ * Build a `TimingJson` payload from a user-typed script and the
+ * recording's measured duration. Both fields are required by the
+ * downstream `parseTimingJson()` validator; missing them produces a
+ * sidecar that gets silently dropped by the audio-mapping pipeline.
+ */
+declare function buildTimingJson(sourceText: string, durationSec: number): TimingJson;
+/**
+ * Serialize a `TimingJson` payload to a `Uint8Array` ready to hand to
+ * `ContentContainer.writeFile()`. Pretty-printed so authors can hand-
+ * edit the sidecar if they ever want to.
+ */
+declare function encodeTimingJson(timing: TimingJson): Uint8Array;
+/**
+ * The container path convention `resolveAudioMapping()` expects:
+ * `<audio-path>.timing.json`. Pass the audio file's relative path
+ * (e.g. `'audio/narration-001.webm'`) and the matching sidecar path is
+ * returned (`'audio/narration-001.webm.timing.json'`).
+ */
+declare function timingPathFor(audioRelativePath: string): string;
+
+export { type CameraStreamOptions, type CaptureKind, type RecordedBookmark, RecorderButton, type RecorderButtonProps, type RecorderColorScheme, RecorderModal, type RecorderModalProps, RecorderPanel, type RecorderPanelProps, type RecorderSaveResult, type RecorderSource, type RecorderState, type ResolvedFormat, type ScreenStreamHandle, type ScreenStreamOptions, type TimingJson, type UseMediaRecorderOptions, type UseMediaRecorderResult, buildFilename, buildTimingJson, encodeTimingJson, getCaptureKind, requestCameraStream, requestMicStream, requestScreenStream, resolveFormat, supportsDisplayMedia, supportsMediaRecorder, supportsUserMedia, timingPathFor, useMediaRecorder, useStreamPreview };

package/dist/recorder/index.js

@@ -0,0 +1,43 @@
+import {
+  RecorderButton
+} from "../chunk-6VDYKI3L.js";
+import {
+  RecorderModal,
+  RecorderPanel,
+  getCaptureKind,
+  requestScreenStream,
+  useMediaRecorder
+} from "../chunk-MJJK7YQB.js";
+import "../chunk-GS7QWYFT.js";
+import {
+  buildFilename,
+  buildTimingJson,
+  encodeTimingJson,
+  requestCameraStream,
+  requestMicStream,
+  resolveFormat,
+  supportsDisplayMedia,
+  supportsMediaRecorder,
+  supportsUserMedia,
+  timingPathFor,
+  useStreamPreview
+} from "../chunk-5Q4JN4I5.js";
+export {
+  RecorderButton,
+  RecorderModal,
+  RecorderPanel,
+  buildFilename,
+  buildTimingJson,
+  encodeTimingJson,
+  getCaptureKind,
+  requestCameraStream,
+  requestMicStream,
+  requestScreenStream,
+  resolveFormat,
+  supportsDisplayMedia,
+  supportsMediaRecorder,
+  supportsUserMedia,
+  timingPathFor,
+  useMediaRecorder,
+  useStreamPreview
+};

package/dist/shell/index.d.ts

@@ -0,0 +1,9 @@
+export { B as BlockTagVisibility, D as DocumentLinkCandidate, b as DocumentLinkProvider, E as EditorActions, c as EditorColorScheme, d as EditorContextValue, e as EditorMode, f as EditorProvider, g as EditorProviderProps, h as EditorShell, i as EditorShellProps, j as EditorState, k as EditorView, I as ImageDisplayMode, L as LayoutMode, M as MentionCandidate, l as MentionProvider, P as PreviewPanel, m as PreviewPanelProps, R as RawEditor, n as RawEditorProps, T as ThemeInheritance, V as ViewPreferences, o as WysiwygEditor, p as WysiwygEditorProps, u as useEditorContext } from '../shell-BxSCBm4H.js';
+import 'react/jsx-runtime';
+import 'react';
+import '@bendyline/squisq/schemas';
+import '@bendyline/squisq/markdown';
+import '@bendyline/squisq/storage';
+import '@bendyline/squisq/versions';
+import '@tiptap/core';
+import 'monaco-editor';

package/dist/shell/index.js

@@ -0,0 +1,22 @@
+import {
+  EditorProvider,
+  EditorShell,
+  PreviewPanel,
+  RawEditor,
+  WysiwygEditor,
+  useEditorContext
+} from "../chunk-TRCKHRBS.js";
+import "../chunk-NITZVAXL.js";
+import "../chunk-V44VP242.js";
+import "../chunk-MJJK7YQB.js";
+import "../chunk-GS7QWYFT.js";
+import "../chunk-5JMHFAVW.js";
+import "../chunk-5Q4JN4I5.js";
+export {
+  EditorProvider,
+  EditorShell,
+  PreviewPanel,
+  RawEditor,
+  WysiwygEditor,
+  useEditorContext
+};