@kokoa/clotho-editor 0.1.4 → 0.3.0

package/dist/clotho-editor.css

@@ -1096,6 +1096,227 @@ body.studio-player-popout #clotho-player-preview {
     color: var(--color-accent);
     background: linear-gradient(90deg, transparent, rgba(99, 102, 241, 0.15));
   }
+  /* Canvas overlay for the camera. Drawn into the editing SVG, which keeps the
+     full-canvas viewBox, so the frame is the part a reader will actually see. */
+  .studio-camera-frame-scrim {
+    /* Fixed rather than themed: this dims the *document's* canvas, which keeps its
+       own background whatever the editor chrome is doing. A themed value goes
+       invisible exactly when the editor is dark and the canvas is white. */
+    fill: rgba(15, 23, 42, 0.32);
+  }
+  .studio-camera-frame-rect {
+    fill: none;
+    stroke: #7c3aed;
+    stroke-width: 2;
+    stroke-dasharray: 6 4;
+  }
+  .studio-camera-frame.is-selected .studio-camera-frame-rect {
+    stroke-dasharray: none;
+    stroke-width: 2.5;
+  }
+  .studio-camera-frame-rect[data-camera-frame] {
+    cursor: pointer;
+  }
+  /* Transparent, but it takes the pan drag — so it needs a fill to be hit. */
+  .studio-camera-frame-body {
+    fill: transparent;
+    cursor: grab;
+  }
+  .studio-camera-frame-body:active {
+    cursor: grabbing;
+  }
+  .studio-camera-frame-handle {
+    fill: var(--color-surface-elevated, #fff);
+    stroke: #7c3aed;
+    stroke-width: 1.5;
+    cursor: nwse-resize;
+  }
+  .studio-camera-frame-handle:hover {
+    fill: #7c3aed;
+  }
+  .studio-camera-frame-label {
+    fill: #7c3aed;
+    font-family: var(--font-mono);
+    font-size: 12px;
+  }
+  .studio-camera-frame-warning {
+    fill: #ef4444;
+    font-family: var(--font-mono);
+    font-size: 11px;
+  }
+  .studio-camera-readout {
+    padding: 0.4rem 0.55rem;
+    margin-bottom: 0.4rem;
+    border-radius: 6px;
+    background-color: var(--color-surface);
+    font-family: var(--font-mono);
+    font-size: 0.7rem;
+    color: var(--color-fg-muted);
+  }
+  .studio-camera-issue {
+    color: #ef4444;
+  }
+  .studio-camera-focus > summary {
+    cursor: pointer;
+    padding: 0.3rem 0;
+    font-family: var(--font-mono);
+    font-size: 0.7rem;
+  }
+  .studio-camera-track {
+    padding: 0.3rem 0;
+    border-top: 1px solid var(--color-border);
+  }
+  .studio-camera-track-head {
+    display: flex;
+    align-items: center;
+    gap: 0.4rem;
+    font-family: var(--font-mono);
+    font-size: 0.72rem;
+  }
+  .studio-camera-track-now {
+    margin-left: auto;
+    color: var(--color-fg-muted);
+    font-size: 0.68rem;
+  }
+  .studio-camera-track .studio-props-empty {
+    margin: 0.2rem 0 0;
+    padding: 0;
+    text-align: left;
+    font-size: 0.68rem;
+  }
+  .studio-camera-control {
+    color: #7c3aed;
+  }
+  .studio-camera-field-label {
+    margin: 0.5rem 0 0.25rem;
+    font-size: 0.72rem;
+    color: var(--color-fg-muted);
+  }
+  .studio-camera-range {
+    margin: 0.45rem 0;
+  }
+  .studio-camera-range-head {
+    display: flex;
+    justify-content: space-between;
+    align-items: baseline;
+    font-size: 0.72rem;
+    color: var(--color-fg-muted);
+  }
+  .studio-camera-range-value {
+    font-family: var(--font-mono);
+    color: var(--color-fg);
+  }
+  .studio-camera-range-row {
+    display: flex;
+    align-items: center;
+    gap: 0.4rem;
+  }
+  .studio-camera-range-row input[type="range"] {
+    flex: 1;
+    min-width: 0;
+  }
+  .studio-camera-range-row input[type="number"] {
+    width: 5.2rem;
+    flex: 0 0 auto;
+  }
+  .studio-camera-hint {
+    margin: 0.2rem 0 0;
+    font-size: 0.66rem;
+    color: var(--color-fg-muted);
+  }
+  .studio-camera-chips {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 0.25rem;
+    margin: 0.25rem 0;
+  }
+  .studio-chip {
+    padding: 0.1rem 0.45rem;
+    border: 1px solid var(--color-border);
+    border-radius: 999px;
+    background: none;
+    color: var(--color-fg-muted);
+    font: inherit;
+    font-size: 0.68rem;
+    cursor: pointer;
+  }
+  .studio-chip.is-on {
+    border-color: #7c3aed;
+    background-color: color-mix(in srgb, #7c3aed 18%, transparent);
+    color: var(--color-fg);
+  }
+  .studio-camera-focus-actions {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 0.3rem;
+    margin: 0.3rem 0;
+  }
+  /* The target list scrolls: a document with forty elements must not push the
+     padding and maxZoom controls off the panel. */
+  .studio-camera-targets {
+    max-height: 11rem;
+    overflow-y: auto;
+    border: 1px solid var(--color-border);
+    border-radius: 6px;
+    padding: 0.2rem;
+  }
+  .studio-camera-target {
+    display: flex;
+    align-items: center;
+    gap: 0.35rem;
+    padding: 0.15rem 0.3rem;
+    border-radius: 4px;
+    font-size: 0.72rem;
+    cursor: pointer;
+  }
+  .studio-camera-target:hover {
+    background-color: color-mix(in srgb, var(--color-accent) 10%, transparent);
+  }
+  .studio-camera-target.is-on {
+    background-color: color-mix(in srgb, #7c3aed 16%, transparent);
+  }
+  .studio-camera-target-name {
+    flex: 1;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+  .studio-camera-target-id,
+  .studio-camera-target-type {
+    font-family: var(--font-mono);
+    font-size: 0.64rem;
+    color: var(--color-fg-muted);
+  }
+  .studio-camera-kf-list {
+    list-style: none;
+    margin: 0.3rem 0 0;
+    padding: 0;
+    display: flex;
+    flex-wrap: wrap;
+    gap: 0.3rem;
+  }
+  .studio-camera-kf-list li {
+    display: flex;
+    align-items: center;
+    gap: 0.25rem;
+    padding: 0.1rem 0.3rem;
+    border: 1px solid var(--color-border);
+    border-radius: 999px;
+    font-family: var(--font-mono);
+    font-size: 0.68rem;
+  }
+  .studio-camera-kf,
+  .studio-camera-kf-del {
+    border: 0;
+    background: none;
+    color: inherit;
+    font: inherit;
+    cursor: pointer;
+    padding: 0;
+  }
+  .studio-camera-kf-del {
+    color: #ef4444;
+  }
   .studio-tl-total {
     margin-top: 0.3rem;
     padding: 0.2rem 0.4rem;
@@ -1885,6 +2106,81 @@ body.studio-player-popout #clotho-player-preview {
     color: #fff;
     border-color: #b91c1c;
   }
+  /* Camera rows: the same shape as an element row, tinted so a document-level
+     track is not mistaken for one belonging to whatever element is above it. */
+  .studio-tl-camera-row {
+    border-bottom: 1px solid var(--color-border);
+    min-height: 30px;
+  }
+  .studio-tl-camera-row.is-selected .studio-tl-gutter,
+  .studio-tl-camera-row.is-selected .studio-tl-body {
+    background-color: color-mix(
+      in srgb,
+      var(--color-accent) 10%,
+      var(--color-surface-elevated)
+    );
+  }
+  .studio-tl-camera-gutter {
+    gap: 0.35rem;
+    color: #7c3aed;
+    font-weight: 700;
+    cursor: pointer;
+  }
+  .studio-tl-camera-gutter.is-sub {
+    color: var(--color-fg-muted);
+    font-weight: 400;
+    padding-left: 1.4rem;
+  }
+  .studio-tl-camera-add {
+    margin-left: auto;
+    border: 1px solid var(--color-border);
+    border-radius: 4px;
+    background: none;
+    color: inherit;
+    font: inherit;
+    line-height: 1;
+    padding: 0 0.3rem;
+    cursor: pointer;
+  }
+  .studio-tl-camera-track {
+    position: relative;
+    height: 100%;
+    min-height: 30px;
+  }
+  .studio-tl-camera-empty {
+    position: absolute;
+    left: 0.5rem;
+    top: 50%;
+    transform: translateY(-50%);
+    font-size: 0.68rem;
+    color: var(--color-fg-muted);
+  }
+  .studio-tl-camera-focus {
+    position: absolute;
+    top: 5px;
+    bottom: 5px;
+    border-radius: 4px;
+    border: 1px solid #7c3aed;
+    background-color: color-mix(in srgb, #7c3aed 22%, transparent);
+    cursor: grab;
+    overflow: hidden;
+    display: flex;
+    align-items: center;
+  }
+  .studio-tl-camera-focus.is-selected {
+    border-color: #ef4444;
+    background-color: color-mix(in srgb, #ef4444 26%, transparent);
+  }
+  .studio-tl-camera-focus-label {
+    padding: 0 0.35rem;
+    font-size: 0.66rem;
+    font-family: var(--font-mono);
+    white-space: nowrap;
+    pointer-events: none;
+  }
+  .studio-tl-camera-keyframe {
+    color: #7c3aed;
+  }
   .studio-tl-playhead {
     position: absolute;
     top: 0;
@@ -2051,3 +2347,132 @@ body.studio-player-popout #clotho-player-preview {
     margin-top: 0.4rem;
   }
 }
+
+.studio-plugin-toolbar {
+  display: contents;
+}
+
+.studio-plugin-panels,
+.studio-plugin-inspectors {
+  display: grid;
+  gap: 0.55rem;
+}
+
+.studio-plugin-panels > section,
+.studio-plugin-inspectors > section {
+  padding: 0.65rem;
+  border: 1px solid var(--color-border);
+  border-radius: 0.55rem;
+  background: var(--color-surface);
+}
+
+.studio-template-panel {
+  display: grid;
+  gap: 0.55rem;
+}
+
+.studio-template-select {
+  width: 100%;
+  padding: 0.35rem 0.45rem;
+  border: 1px solid var(--color-border);
+  border-radius: 0.3rem;
+  background: var(--color-surface);
+  color: var(--color-fg);
+}
+
+.studio-template-status[data-error="true"] {
+  color: var(--color-danger);
+}
+
+.studio-checkpoint-card {
+  margin-bottom: 0.7rem;
+  padding: 0.65rem;
+  border: 1px solid var(--color-border);
+  border-radius: 0.5rem;
+  background: var(--color-surface-raised, var(--color-surface));
+}
+
+.studio-responsive-grid {
+  display: grid;
+  gap: 0.6rem;
+  margin-top: 0.65rem;
+}
+
+.studio-responsive-grid figure {
+  margin: 0;
+  padding: 0.4rem;
+  border: 1px solid var(--color-border);
+  border-radius: 0.45rem;
+  overflow: hidden;
+  background: var(--color-canvas);
+}
+
+.studio-responsive-grid figcaption {
+  margin-bottom: 0.35rem;
+  color: var(--color-fg-muted);
+  font-size: 0.7rem;
+}
+
+.studio-responsive-grid svg {
+  display: block;
+  width: 100%;
+  height: auto;
+}
+
+.studio-profile {
+  display: grid;
+  gap: 0.35rem;
+  margin: 0.55rem 0;
+}
+.studio-profile > div {
+  display: flex;
+  justify-content: space-between;
+  gap: 0.75rem;
+}
+.studio-profile dt {
+  color: var(--color-fg-muted);
+}
+.studio-profile dd {
+  margin: 0;
+  font-family: var(--font-mono);
+}
+
+.studio-lint-list {
+  display: grid;
+  gap: 0.35rem;
+  padding: 0;
+  list-style: none;
+}
+.studio-lint-list button {
+  width: 100%;
+  display: grid;
+  gap: 0.2rem;
+  padding: 0.45rem;
+  border: 1px solid var(--color-border);
+  border-radius: 0.4rem;
+  background: var(--color-surface);
+  color: var(--color-fg);
+  text-align: left;
+}
+.studio-lint-list span {
+  color: var(--color-fg-muted);
+  font-size: 0.72rem;
+}
+.studio-lint-list em {
+  color: var(--color-accent);
+  font-size: 0.68rem;
+  font-style: normal;
+}
+.studio-lint-compare {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 0.4rem;
+}
+.studio-lint-compare figure {
+  min-width: 0;
+  margin: 0;
+}
+.studio-lint-compare svg {
+  width: 100%;
+  height: auto;
+}

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-import { AnimationDocument, SnapshotMap, Appearance, AnimationElement, TrackKeyframe, Chapter, AnimationEffect, GroupElement } from '@kokoa/clotho';
+import { AnimationDocument, SnapshotMap, Appearance, AnimationElement, TrackKeyframe, Chapter, AnimationEffect, CameraFocus, Camera, CameraProperty, DataValue, LayoutMode, Checkpoint, StoryManifest, StoryEdge, AnimationTemplate, GroupElement, ParameterSchema } from '@kokoa/clotho';
 
 interface StudioProps {
     initial: AnimationDocument;
@@ -29,22 +29,12 @@ declare function createLocalStorageRepository(options?: LocalStorageRepositoryOp
 
 type ImageUploadResolver = (file: File) => Promise<string> | string;
 
-interface StudioMountProps {
-    initialId?: string;
-    repository?: AnimationRepository;
-    editorTitle?: string;
-    resolveImage?: ImageUploadResolver;
+interface PaletteCommand {
+    id: string;
+    label: string;
+    hint?: string;
+    run: () => void;
 }
-declare function StudioMount({ initialId, repository, editorTitle, resolveImage, }: StudioMountProps): React.JSX.Element;
-
-/** 검증된 애니메이션 문서를 읽기 쉬운 JSON으로 변환한다. */
-declare function animationDocumentToJson(def: AnimationDocument): string;
-/** 어떤 image 요소에서도 참조하지 않는 asset을 제거한 새 문서를 반환한다. */
-declare function garbageCollectAnimationAssets(def: AnimationDocument): AnimationDocument;
-/** 문서 ID를 운영체제에서 안전하게 사용할 수 있는 파일 이름으로 바꾼다. */
-declare function animationDocumentFileName(def: AnimationDocument): string;
-/** 현재 문서를 브라우저에서 JSON 파일로 내려받는다. */
-declare function downloadAnimationJson(def: AnimationDocument): void;
 
 type Selection = {
     kind: "none";
@@ -60,8 +50,11 @@ type Selection = {
 } | {
     kind: "effect";
     effectId: string;
+} | {
+    kind: "camera";
+    focusIndex?: number;
 };
-type HistoryKind = "meta" | "canvas" | "settings" | "add" | "delete" | "move" | "style" | "rotate" | "resize" | "reorder" | "track" | "appearance" | "chapter" | "effect" | "group" | "asset" | "other";
+type HistoryKind = "meta" | "canvas" | "settings" | "add" | "delete" | "move" | "style" | "rotate" | "resize" | "reorder" | "track" | "appearance" | "chapter" | "effect" | "camera" | "group" | "layout" | "checkpoint" | "asset" | "other";
 interface HistoryEntry {
     snap: string;
     label: string;
@@ -124,9 +117,58 @@ declare function updateEffect(id: string, patch: Partial<AnimationEffect>): void
 declare function deleteEffect(id: string): void;
 declare function updateDuration(ms: number): void;
 
+declare function getCamera(): Camera;
+/** Whether the document actually carries a camera, as opposed to defaults. */
+declare function hasCamera(): boolean;
+/**
+ * Which mechanism decides the view at `time`.
+ *
+ * The renderer's rule is that a focus entry that has already started wins, and the
+ * tracks supply the value otherwise. Direct manipulation on the canvas has to know
+ * which one it is editing — dragging the frame when a focus is in control would
+ * write track keyframes that the focus immediately overrides, and a control that
+ * silently does nothing is worse than one that is disabled.
+ */
+type CameraControl = {
+    kind: "none";
+} | {
+    kind: "tracks";
+} | {
+    kind: "focus";
+    index: number;
+};
+declare function cameraControlAt(time: number): CameraControl;
+declare function setCameraStrokeScaling(value: Camera["strokeScaling"]): void;
+/** Add or replace the keyframe at `time` on one camera property. */
+declare function setCameraKeyframe(property: CameraProperty, time: number, value: number, ease?: CameraKeyframeEase): void;
+type CameraKeyframeEase = NonNullable<Camera["tracks"][number]["keyframes"][number]["ease"]>;
+/**
+ * Move a keyframe in time, keeping its value.
+ *
+ * Separate from `setCameraKeyframe` because a timeline drag has to remove the old
+ * time as well; doing it as remove-then-set would push two history entries for one
+ * gesture.
+ */
+declare function moveCameraKeyframe(property: CameraProperty, from: number, to: number): void;
+declare function removeCameraKeyframe(property: CameraProperty, time: number): void;
+declare function removeCameraTrack(property: CameraProperty): void;
+declare function addCameraFocus(focus: CameraFocus): void;
+/**
+ * Patch one focus entry.
+ *
+ * Sorting can move it, so the selection is re-pointed at the same entry rather than
+ * at whatever ends up at the old index.
+ */
+declare function updateCameraFocus(index: number, patch: Partial<CameraFocus>): void;
+declare function deleteCameraFocus(index: number): void;
+/** Remove the camera entirely, so the document renders as it did without one. */
+declare function clearCamera(): void;
+
 declare function updateMeta(patch: Partial<Pick<AnimationDocument, "title" | "description">>): void;
 /** Update the locales offered to localized text elements in this document. */
 declare function updateLocales(locales: string[]): void;
+declare function updateData(data: Record<string, DataValue>): void;
+declare function updateResponsive(responsive: NonNullable<AnimationDocument["responsive"]>): void;
 declare function updateCanvas(patch: Partial<AnimationDocument["canvas"]>): void;
 declare function updateSettings(patch: Partial<AnimationDocument["settings"]>): void;
 declare function uniqueElementId(type: string): string;
@@ -152,6 +194,107 @@ declare function registerInlineAsset(bytes: Uint8Array, mime: string): string;
  */
 declare function registerDataUriAsset(dataUri: string): string;
 
+interface LayoutCollision {
+    readonly firstId: string;
+    readonly secondId: string;
+}
+declare function createLayout(elementIds: readonly string[], mode: LayoutMode): void;
+declare function detachFromLayout(elementIds: readonly string[]): void;
+declare function layoutIdsFor(elementIds: readonly string[]): string[];
+declare function findLayoutCollisions(def: AnimationDocument): LayoutCollision[];
+
+declare function addCheckpoint(checkpoint: Checkpoint): void;
+declare function updateCheckpoint(id: string, patch: Partial<Checkpoint>): void;
+declare function deleteCheckpoint(id: string): void;
+declare function uniqueCheckpointId(): string;
+
+type EditorPluginSlot = "toolbar" | "panel" | "inspector";
+interface EditorPluginManifestLike {
+    id: string;
+    name: string;
+    capabilities: readonly string[];
+    editor?: {
+        toolbarItems?: readonly string[];
+        panels?: readonly string[];
+        inspectors?: readonly string[];
+    };
+}
+interface EditorPluginPermissions {
+    ui?: boolean;
+    documentRead?: boolean;
+    documentWrite?: boolean;
+}
+interface EditorPluginContext {
+    readonly pluginId: string;
+    getDocument(): AnimationDocument;
+    replaceDocument(document: AnimationDocument): void;
+    getSelection(): Selection;
+    setSelection(selection: Selection): void;
+}
+interface EditorPluginView {
+    id: string;
+    label: string;
+    mount(container: HTMLElement, context: EditorPluginContext): void | (() => void);
+}
+interface EditorPluginDefinition {
+    manifest: EditorPluginManifestLike;
+    toolbarItems?: Record<string, EditorPluginView>;
+    panels?: Record<string, EditorPluginView>;
+    inspectors?: Record<string, EditorPluginView>;
+    commands?: readonly PaletteCommand[];
+}
+type EditorPluginPermissionResolver = (plugin: EditorPluginManifestLike) => EditorPluginPermissions;
+type DocumentImporter = (input: unknown) => AnimationDocument | Promise<AnimationDocument>;
+interface EditorPluginHostState {
+    getDocument(): AnimationDocument | null;
+    replaceDocument(document: AnimationDocument): void;
+    getSelection(): Selection;
+    setSelection(selection: Selection): void;
+}
+interface EditorPluginMountResult {
+    commands: PaletteCommand[];
+    dispose(): void;
+}
+interface EditorPluginIssue {
+    pluginId: string;
+    message: string;
+}
+declare function validateEditorPlugin(plugin: EditorPluginDefinition): EditorPluginIssue[];
+declare function createEditorPluginContext(pluginId: string, permissions: EditorPluginPermissions, state: EditorPluginHostState): EditorPluginContext;
+declare function mountEditorPlugins(root: HTMLElement, plugins: readonly EditorPluginDefinition[], resolvePermissions: EditorPluginPermissionResolver, state: EditorPluginHostState): EditorPluginMountResult;
+
+interface StoryEditorOptions {
+    manifest: StoryManifest;
+    onChange?(manifest: StoryManifest): void;
+}
+declare function replaceStoryNodeDocument(manifest: StoryManifest, nodeId: string, document: AnimationDocument): StoryManifest;
+declare function appendStoryEdge(manifest: StoryManifest, edge: StoryEdge): StoryManifest;
+declare function createStoryEditorPlugin(options: StoryEditorOptions): EditorPluginDefinition;
+
+interface StudioMountProps {
+    initialId?: string;
+    repository?: AnimationRepository;
+    editorTitle?: string;
+    resolveImage?: ImageUploadResolver;
+    importDocument?: DocumentImporter;
+    plugins?: readonly EditorPluginDefinition[];
+    resolvePluginPermissions?: EditorPluginPermissionResolver;
+    /** Trusted build-time templates shown as a parameter panel. */
+    templates?: readonly AnimationTemplate[];
+    /** Optional multi-document Story Graph edited alongside the active node timeline. */
+    story?: StoryEditorOptions;
+}
+declare function StudioMount({ initialId, repository, editorTitle, resolveImage, importDocument, plugins, resolvePluginPermissions, templates, story, }: StudioMountProps): React.JSX.Element;
+
+/** 검증된 애니메이션 문서를 읽기 쉬운 JSON으로 변환한다. */
+declare function animationDocumentToJson(def: AnimationDocument): string;
+/** 어떤 image 요소에서도 참조하지 않는 asset을 제거한 새 문서를 반환한다. */
+declare function garbageCollectAnimationAssets(def: AnimationDocument): AnimationDocument;
+/** 문서 ID를 운영체제에서 안전하게 사용할 수 있는 파일 이름으로 바꾼다. */
+declare function animationDocumentFileName(def: AnimationDocument): string;
+/** 현재 문서를 브라우저에서 JSON 파일로 내려받는다. */
+declare function downloadAnimationJson(def: AnimationDocument): void;
+
 declare function isGroup(el: AnimationElement): el is GroupElement;
 /** Direct children of a group, in document order (which is also paint order). */
 declare function childIdsOf(groupId: string): string[];
@@ -173,4 +316,42 @@ interface HostOptions {
 declare function configureHost(options: HostOptions): void;
 declare function placeholderImageUrl(): string;
 
-export { type AnimationRepository, type AnimationSummary, type HistoryEntry, type HistoryKind, type HostOptions, type ImageUploadResolver, type LocalStorageRepositoryOptions, type Selection, Studio, StudioMount, type StudioMountProps, type StudioProps, addAppearance, addChapter, addEffect, addElement, animationDocumentFileName, animationDocumentToJson, apiBaseUrl, beginTransient, canRedo, canUndo, childIdsOf, configureAnimationRepository, configureApi, configureHost, createLocalStorageRepository, deleteChapter, deleteEffect, deleteElement, downloadAnimationJson, endTransient, garbageCollectAnimationAssets, getCurrentSnapshot, getCurrentTime, getDef, getHistory, getSelectedElementIds, getSelection, groupElements, isDirty, isDraft, isElementSelected, isGroup, jumpBack, jumpForward, markClean, moveElementToEnd, moveElementToFront, placeholderImageUrl, promoteDraftToSaved, redo, registerDataUriAsset, registerExternalAsset, registerInlineAsset, removeAppearance, removeTrack, removeTrackKeyframe, reorderElement, resetHistory, setCurrentTime, setDef, setDraft, setElementValueAtTime, setSelection, setTrackKeyframe, subscribe, toggleSelectionFor, undo, ungroupElement, uniqueChapterId, uniqueEffectId, uniqueElementId, updateAppearance, updateCanvas, updateChapter, updateDuration, updateEffect, updateElementBase, updateLocales, updateMeta, updateSettings };
+declare function initialParameterValue(schema: ParameterSchema): unknown;
+declare function parameterInputValue(schema: ParameterSchema, raw: string | boolean): unknown;
+/** Built-in authoring panel for trusted templates registered by the host. */
+declare function createTemplateEditorPlugin(templates: readonly AnimationTemplate[]): EditorPluginDefinition;
+
+declare function createVisualRegressionPlugin(): EditorPluginDefinition;
+
+declare const RESPONSIVE_VIEWPORTS: readonly [{
+    readonly id: "compact";
+    readonly label: "모바일";
+    readonly width: 375;
+}, {
+    readonly id: "regular";
+    readonly label: "본문";
+    readonly width: 768;
+}, {
+    readonly id: "wide";
+    readonly label: "넓은 화면";
+    readonly width: 1280;
+}];
+declare function addDefaultResponsiveVariants(document: AnimationDocument): AnimationDocument;
+declare function createResponsiveInspectorPlugin(): EditorPluginDefinition;
+
+interface SceneProfile {
+    elementCount: number;
+    trackCount: number;
+    keyframeCount: number;
+    sampleCount: number;
+    totalMs: number;
+    averageMs: number;
+    maxMs: number;
+    overBudget: boolean;
+}
+declare function profileAnimation(document: AnimationDocument, sampleCount?: number, frameBudgetMs?: number): SceneProfile;
+declare function createPerformanceProfilerPlugin(): EditorPluginDefinition;
+
+declare function createLinterPlugin(): EditorPluginDefinition;
+
+export { type AnimationRepository, type AnimationSummary, type CameraControl, type DocumentImporter, type EditorPluginContext, type EditorPluginDefinition, type EditorPluginHostState, type EditorPluginManifestLike, type EditorPluginMountResult, type EditorPluginPermissionResolver, type EditorPluginPermissions, type EditorPluginSlot, type EditorPluginView, type HistoryEntry, type HistoryKind, type HostOptions, type ImageUploadResolver, type LocalStorageRepositoryOptions, RESPONSIVE_VIEWPORTS, type SceneProfile, type Selection, type StoryEditorOptions, Studio, StudioMount, type StudioMountProps, type StudioProps, addAppearance, addCameraFocus, addChapter, addCheckpoint, addDefaultResponsiveVariants, addEffect, addElement, animationDocumentFileName, animationDocumentToJson, apiBaseUrl, appendStoryEdge, beginTransient, cameraControlAt, canRedo, canUndo, childIdsOf, clearCamera, configureAnimationRepository, configureApi, configureHost, createEditorPluginContext, createLayout, createLinterPlugin, createLocalStorageRepository, createPerformanceProfilerPlugin, createResponsiveInspectorPlugin, createStoryEditorPlugin, createTemplateEditorPlugin, createVisualRegressionPlugin, deleteCameraFocus, deleteChapter, deleteCheckpoint, deleteEffect, deleteElement, detachFromLayout, downloadAnimationJson, endTransient, findLayoutCollisions, garbageCollectAnimationAssets, getCamera, getCurrentSnapshot, getCurrentTime, getDef, getHistory, getSelectedElementIds, getSelection, groupElements, hasCamera, initialParameterValue, isDirty, isDraft, isElementSelected, isGroup, jumpBack, jumpForward, layoutIdsFor, markClean, mountEditorPlugins, moveCameraKeyframe, moveElementToEnd, moveElementToFront, parameterInputValue, placeholderImageUrl, profileAnimation, promoteDraftToSaved, redo, registerDataUriAsset, registerExternalAsset, registerInlineAsset, removeAppearance, removeCameraKeyframe, removeCameraTrack, removeTrack, removeTrackKeyframe, reorderElement, replaceStoryNodeDocument, resetHistory, setCameraKeyframe, setCameraStrokeScaling, setCurrentTime, setDef, setDraft, setElementValueAtTime, setSelection, setTrackKeyframe, subscribe, toggleSelectionFor, undo, ungroupElement, uniqueChapterId, uniqueCheckpointId, uniqueEffectId, uniqueElementId, updateAppearance, updateCameraFocus, updateCanvas, updateChapter, updateCheckpoint, updateData, updateDuration, updateEffect, updateElementBase, updateLocales, updateMeta, updateResponsive, updateSettings, validateEditorPlugin };