@bpmn-nova/studio 0.3.0-preview → 0.3.1-preview

package/README.md

@@ -1,26 +1,39 @@
 # @bpmn-nova/studio
 
-BPMN Nova 的推荐聚合入口，组合流程设计器、只读 Viewer、审批轨迹、Palette、Properties 和主题。
+BPMN Nova 的 Vanilla JavaScript / TypeScript 完整入口，提供流程设计、只读展示、审批轨迹、主题、属性面板和纯 SVG 导出。
 
-> **English summary:** The recommended aggregate package for BPMN Nova Designer, Viewer, runtime visualization, Palette and Properties.
+> **English summary:** The complete framework-neutral BPMN Nova package for process design, viewing, approval traces, themes, properties, and pure SVG export.
 
-> 当前版本为 `0.3.0-preview`。API 与 BPMN round-trip 能力仍在稳定中，请固定 Preview 版本或使用 `preview` dist-tag。
+> 当前版本为 `0.3.1-preview`。请使用 `@preview` 安装，并在生产接入前验证目标 BPMN XML 与引擎扩展。
+
+![BPMN Nova 流程设计器](https://raw.githubusercontent.com/daxiangme/bpmn-nova/dev/docs/assets/bpmn-nova-designer.jpg)
+
+## 什么时候使用
+
+- Vanilla JavaScript 或 TypeScript 项目安装本包。
+- React 18+ 项目安装 `@bpmn-nova/react`。
+- Vue 3.3+ 项目安装 `@bpmn-nova/vue`。
+- 一个项目只需要选择一个公开包，不需要安装 Core、Viewer、Runtime、Theme 等内部 Module。
 
 ## 安装
 
 ```bash
-npm install @bpmn-nova/studio
+npm install @bpmn-nova/studio@preview
 ```
 
 ```js
 import '@bpmn-nova/studio/styles.css'
 ```
 
-JavaScript 不会隐式注入 CSS；只导入当前视觉包的样式入口。
+BPMN Nova 不会在 JavaScript 中隐式注入 CSS。视觉容器必须有明确高度。
 
-## 最小用法
+## 流程设计
 
-```jsx
+```html
+<div id="studio" style="height: 720px"></div>
+```
+
+```js
 import {
   createEmptyProcess,
   createStudioController,
@@ -29,31 +42,201 @@ import {
 import '@bpmn-nova/studio/styles.css'
 
 const model = createEmptyProcess('flowable')
+model.id = 'Process_PurchaseApproval'
+model.name = '采购申请审批流程'
+
 const studio = createStudioController({ model })
-const shell = createStudioShell({ container, studio, theme: 'auto' })
+const shell = createStudioShell({
+  container: document.querySelector('#studio'),
+  studio,
+  theme: 'auto',
+})
 
 const xml = studio.exportXml()
+
+// 页面卸载时释放实例。
 shell.destroy()
 studio.destroy()
 ```
 
-## 主要接口
+## 只读 Viewer
+
+```js
+import { importBpmn } from '@bpmn-nova/studio'
+import { BpmnViewer } from '@bpmn-nova/studio/viewer'
+import '@bpmn-nova/studio/styles.css'
+
+const viewer = new BpmnViewer({
+  container: document.querySelector('#viewer'),
+  model: importBpmn(xml, 'flowable'),
+  projection: 'standard',
+  theme: 'auto',
+})
+
+viewer.fitView()
+viewer.destroy()
+```
+
+也可以从 `@bpmn-nova/studio` 根入口导入所有公开 Interface；子路径用于明确表达接入场景。
+
+![BPMN Nova 只读流程展示](https://raw.githubusercontent.com/daxiangme/bpmn-nova/dev/docs/assets/bpmn-nova-viewer.jpg)
+
+## 审批轨迹
+
+Viewer 接收引擎中立的 Runtime Snapshot。三种投影使用相同数据：
+
+| 投影 | 配置 | 适用场景 |
+| --- | --- | --- |
+| 实际路径 | `projection: 'approval'` | 只展示实际发生的有效路径 |
+| 移动时间线 | `projection: 'compact'` | 按访问轮次展示动作、图片和附件 |
+| 完整 BPMN | `projection: 'standard'` + `runtime` | 完整结构叠加运行状态 |
+
+```js
+const runtime = {
+  processInstanceId: 'purchase-20260824',
+  status: 'running',
+  activities: [{
+    id: 'activity-manager-1',
+    elementId: 'UserTask_Manager',
+    visitId: 'visit-manager-1',
+    status: 'completed',
+    assignee: '李经理',
+    endTime: '2026-08-24T10:12:00+08:00',
+  }],
+  actions: [{
+    id: 'action-manager-approve',
+    type: 'approve',
+    elementId: 'UserTask_Manager',
+    visitId: 'visit-manager-1',
+    activityId: 'activity-manager-1',
+    actor: { id: 'manager-li', name: '李经理' },
+    occurredAt: '2026-08-24T10:12:00+08:00',
+    content: {
+      plainText: '资料完整，同意提交总经理审批。',
+      blocks: [
+        { type: 'paragraph', text: '资料完整，同意提交总经理审批。' },
+        { type: 'image', assetId: 'quotation-preview' },
+        { type: 'file', assetId: 'purchase-checklist' },
+      ],
+      assets: [
+        {
+          id: 'quotation-preview',
+          name: '现场报价单.png',
+          mediaType: 'image/png',
+          width: 1280,
+          height: 720,
+        },
+        {
+          id: 'purchase-checklist',
+          name: '采购核验清单.txt',
+          mediaType: 'text/plain',
+          size: 248,
+        },
+      ],
+    },
+  }],
+  visitedEdges: [],
+}
+
+const runtimeAssetResolver = async (asset, { purpose, signal }) => {
+  const response = await fetch(
+    `/api/runtime-assets/${encodeURIComponent(asset.id)}?purpose=${purpose}`,
+    { signal },
+  )
+  if (!response.ok) return null
+  return response.url
+}
+
+viewer.setRuntime(runtime)
+viewer.setProjection('compact')
+viewer.setDisplayOptions({ runtimeAssetResolver })
+```
 
-- `createStudioController / BpmnStudioController`
-- `createStudioShell / BpmnStudioShell`
-- `BpmnCanvas 与 InteractionController`
-- `ContextMenu、Template、Palette、Properties Registries`
-- `Studio 聚合导出的 Core、XML、Runtime、Theme、Designer 与 Viewer API`
+Snapshot 只保存资源引用，不保存 URL、Base64、Blob 或 HTML。上传、权限签发和资源存储由宿主业务系统负责。
 
-参数、默认值、事件和实例方法以随包发布的 TypeScript 声明为准。
+| 实际路径 | 移动时间线 |
+| --- | --- |
+| ![审批实际路径](https://raw.githubusercontent.com/daxiangme/bpmn-nova/dev/docs/assets/bpmn-nova-approval-effective-path.jpg) | ![移动审批时间线](https://raw.githubusercontent.com/daxiangme/bpmn-nova/dev/docs/assets/bpmn-nova-approval-mobile-timeline.jpg) |
 
-## 文档
+![完整 BPMN 审批轨迹](https://raw.githubusercontent.com/daxiangme/bpmn-nova/dev/docs/assets/bpmn-nova-approval-full-bpmn.jpg)
 
+## 主题与运行态配色
+
+```js
+shell.setTheme({
+  mode: 'auto',
+  dark: {
+    colors: {
+      canvas: '#0b1018',
+      surface: '#18202b',
+    },
+  },
+})
+
+shell.setRuntimeAppearance({
+  statuses: { completed: 'success', active: 'primary' },
+  actions: {
+    approve: { label: '通过', tone: 'success' },
+    reject: { label: '驳回', tone: 'danger' },
+  },
+})
+```
+
+主题限定在实例根节点；`auto` 会跟随并监听浏览器系统主题变化，不修改宿主页面的 `<html>`。
+
+![BPMN Nova 深色运行态](https://raw.githubusercontent.com/daxiangme/bpmn-nova/dev/docs/assets/bpmn-nova-dark-runtime.jpg)
+
+## SVG 导出
+
+```js
+// 打开确认预览，用户确认后下载。
+shell.openSvgExportPreview({
+  theme: 'current',
+  transparentBackground: false,
+  filename: '采购申请审批流程.svg',
+})
+
+// 或只创建 Artifact，不触发下载。
+const artifact = await shell.exportSvg({ theme: 'dark' })
+console.log(artifact.svg, artifact.warnings)
+```
+
+导出完整业务内容，不受当前缩放、平移或滚动影响。图片会通过 Resolver 嵌入 SVG，普通附件只展示摘要。
+
+![SVG 导出确认预览](https://raw.githubusercontent.com/daxiangme/bpmn-nova/dev/docs/assets/bpmn-nova-svg-export-preview.jpg)
+
+## 支持的子路径
+
+```js
+import { BpmnDesigner } from '@bpmn-nova/studio/designer'
+import { BpmnViewer } from '@bpmn-nova/studio/viewer'
+import { createRuntimePresentation } from '@bpmn-nova/studio/runtime'
+import { createThemeController } from '@bpmn-nova/studio/theme'
+import { exportDiagramSvg } from '@bpmn-nova/studio/export-svg'
+import { flowableProfile } from '@bpmn-nova/studio/flowable'
+import { activitiProfile } from '@bpmn-nova/studio/activiti'
+```
+
+## 常见问题
+
+- **界面为空或高度为 0：** 为 Studio/Viewer 的父容器设置明确高度。
+- **界面没有样式：** 导入一次 `@bpmn-nova/studio/styles.css`。
+- **附件不可用：** 提供 `runtimeAssetResolver`，并为不同 purpose 返回当前有效地址。
+- **SSR 报错：** 在浏览器挂载阶段创建实例，服务端只准备 XML 和 Runtime 数据。
+- **重复安装：** 不直接安装任何未列出的 `@bpmn-nova/*` 内部 Module。
+
+## 文档与 AI
+
+- [项目首页](https://github.com/daxiangme/bpmn-nova)
 - [快速开始](https://github.com/daxiangme/bpmn-nova/blob/dev/docs/GETTING-STARTED.md)
-- [组件参数](https://github.com/daxiangme/bpmn-nova/blob/dev/docs/COMPONENTS.md)
-- [API](https://github.com/daxiangme/bpmn-nova/blob/dev/docs/API.md)
+- [公开 Interface](https://github.com/daxiangme/bpmn-nova/blob/dev/docs/API.md)
 - [自定义指南](https://github.com/daxiangme/bpmn-nova/blob/dev/docs/CUSTOMIZATION.md)
-- [Properties Panel](https://github.com/daxiangme/bpmn-nova/blob/dev/docs/PROPERTIES-PANEL.md)
+- [AI 接入入口](https://raw.githubusercontent.com/daxiangme/bpmn-nova/dev/llms.txt)
+- [AI 完整上下文](https://raw.githubusercontent.com/daxiangme/bpmn-nova/dev/llms-full.txt)
+
+## 能力边界
+
+BPMN Nova 负责建模、展示、审批轨迹、主题和 SVG 导出；不负责流程引擎执行、审批提交、附件上传存储、权限签发或 PNG/PDF 导出。当前 Preview 不声明 BPMN Schema 100% 覆盖。
 
 ## License
 

package/dist/canvas.js

@@ -8,9 +8,9 @@ import {
   NODE_DEFINITIONS,
   resolveContainment,
   snapNodePosition,
-} from '@bpmn-nova/core';
-import { DiagramRenderer } from '@bpmn-nova/renderer';
-import { hydrateIcons } from '@bpmn-nova/icons';
+} from './modules/core/index.js';
+import { DiagramRenderer } from './modules/renderer-svg/index.js';
+import { hydrateIcons } from './modules/icons/index.js';
 import { canCreateSequenceFlow } from './controller.js';
 import { createDefaultContextMenuRegistry } from './context-menu.js';
 import { CREATE_INTENT_MIME } from './interactions.js';
@@ -904,6 +904,8 @@ export class BpmnCanvas {
   startConnect(nodeId) { this.renderer.closeTransientOverlays?.(); return this.studio.startConnect(nodeId); }
   editEdgeName(edgeId) { return this.renderer.editEdgeName?.(edgeId) || false; }
   fitView(padding, options) { this.renderer.fitView(padding, { minZoom: 0.7, ...(options || {}) }); }
+  exportSvg(options) { return this.renderer.exportSvg(options); }
+  openSvgExportPreview(options) { return this.renderer.openSvgExportPreview(options); }
   fitSelection(padding = 72) {
     const bounds = this.studio.getSelectionBounds();
     if (!bounds) return false;

package/dist/context-menu.js

@@ -3,7 +3,7 @@ import {
   getEdge,
   getNode,
   isEmbeddedSubProcess,
-} from '@bpmn-nova/core';
+} from './modules/core/index.js';
 import { selectedDiagramNodes, selectedGroupableNodes, selectedLayoutNodes } from './selection-layout.js';
 
 function insert(actions, action) {

package/dist/controller.js

@@ -24,8 +24,8 @@ import {
   resolveSwimlaneLabelPlacement,
   scopeExists,
   validateParallelGateway,
-} from '@bpmn-nova/core';
-import { exportBpmn, importBpmn } from '@bpmn-nova/bpmn-model';
+} from './modules/core/index.js';
+import { exportBpmn, importBpmn } from './modules/bpmn-model/index.js';
 import {
   applySelectionArrangement,
   mergeSelectionRefs,

package/dist/index.d.ts

@@ -1,14 +1,15 @@
-export * from '@bpmn-nova/core'
-export * from '@bpmn-nova/bpmn-model'
-export * from '@bpmn-nova/runtime'
-export * from '@bpmn-nova/theme'
-export * from '@bpmn-nova/designer'
-export * from '@bpmn-nova/viewer'
-export * from '@bpmn-nova/flowable'
-export * from '@bpmn-nova/activiti'
-export * from '@bpmn-nova/properties'
-export * from '@bpmn-nova/icons'
-export * from '@bpmn-nova/palette'
+export * from './modules/core/index.js'
+export * from './modules/bpmn-model/index.js'
+export * from './modules/runtime/index.js'
+export * from './modules/theme/index.js'
+export * from './modules/export-svg/index.js'
+export * from './modules/designer/index.js'
+export * from './modules/viewer/index.js'
+export * from './modules/engine-flowable/index.js'
+export * from './modules/engine-activiti/index.js'
+export * from './modules/properties/index.js'
+export * from './modules/icons/index.js'
+export * from './modules/palette/index.js'
 
 import type {
   BpmnEdge,
@@ -20,20 +21,21 @@ import type {
   Point,
   ProcessModel,
   SelectionRect,
-} from '@bpmn-nova/core'
-import type { IconRegistry } from '@bpmn-nova/icons'
-import type { PaletteRegistry } from '@bpmn-nova/palette'
-import type { PropertiesRegistry } from '@bpmn-nova/properties'
-import type { DiagramNodeRenderer, DiagramRendererOptions } from '@bpmn-nova/renderer'
+} from './modules/core/index.js'
+import type { IconRegistry } from './modules/icons/index.js'
+import type { PaletteRegistry } from './modules/palette/index.js'
+import type { PropertiesRegistry } from './modules/properties/index.js'
+import type { DiagramNodeRenderer, DiagramRendererOptions } from './modules/renderer-svg/index.js'
+import type { RuntimeTimelineSvgRenderer, SvgExportArtifact, SvgExportOptions, SvgExportPreviewController, SvgNodeRenderer } from './modules/export-svg/index.js'
 import type {
   ActivityInstance as RuntimeActivityInstance,
   ProcessInstanceSnapshot as RuntimeProcessInstanceSnapshot,
-} from '@bpmn-nova/runtime'
-import type { NovaThemeInput, NovaThemeMode, NovaThemeState, RuntimeAppearanceOptions, RuntimeAppearanceResolver } from '@bpmn-nova/theme'
+} from './modules/runtime/index.js'
+import type { NovaThemeInput, NovaThemeMode, NovaThemeState, RuntimeAppearanceOptions, RuntimeAppearanceResolver } from './modules/theme/index.js'
 import type {
   RuntimeDetailsRenderer,
   RuntimeTransitionDetailsRenderer,
-} from '@bpmn-nova/viewer'
+} from './modules/viewer/index.js'
 
 // Aggregate compatibility surface. Studio re-exports the package-level types,
 // and keeps these frequently consumed declarations visible at its own entry.
@@ -84,12 +86,12 @@ export interface RuntimeTransitionRoute {
   anchorStrategy: 'outer-same-side' | 'flow-axis-fallback'
   portConflicts: number
 }
-export function routeRuntimeTransition(model: ProcessModel, transition: import('@bpmn-nova/runtime').RuntimeTransition, options?: RuntimeTransitionRouteOptions): RuntimeTransitionRoute | null
+export function routeRuntimeTransition(model: ProcessModel, transition: import('./modules/runtime/index.js').RuntimeTransition, options?: RuntimeTransitionRouteOptions): RuntimeTransitionRoute | null
 
-export type RuntimeParticipant = import('@bpmn-nova/runtime').RuntimeParticipant
-export type RuntimeTransition = import('@bpmn-nova/runtime').RuntimeTransition
-export type NodeRuntimePresentation = import('@bpmn-nova/runtime').NodeRuntimePresentation
-export type RuntimePresentation = import('@bpmn-nova/runtime').RuntimePresentation
+export type RuntimeParticipant = import('./modules/runtime/index.js').RuntimeParticipant
+export type RuntimeTransition = import('./modules/runtime/index.js').RuntimeTransition
+export type NodeRuntimePresentation = import('./modules/runtime/index.js').NodeRuntimePresentation
+export type RuntimePresentation = import('./modules/runtime/index.js').RuntimePresentation
 export interface ActivityInstance extends RuntimeActivityInstance {
   visitId?: string
   multiInstanceId?: string
@@ -104,18 +106,18 @@ export interface ProcessInstanceSnapshot extends RuntimeProcessInstanceSnapshot
 }
 
 export type ViewerProjection = 'auto' | 'standard' | 'approval' | 'compact'
-export type RuntimeTraceProjection = import('@bpmn-nova/viewer').RuntimeTraceProjection
-export type RuntimeTraceItem = import('@bpmn-nova/viewer').RuntimeTraceItem
-export type RuntimeTraceLink = import('@bpmn-nova/viewer').RuntimeTraceLink
-export type RuntimeTraceGroup = import('@bpmn-nova/viewer').RuntimeTraceGroup
+export type RuntimeTraceProjection = import('./modules/viewer/index.js').RuntimeTraceProjection
+export type RuntimeTraceItem = import('./modules/viewer/index.js').RuntimeTraceItem
+export type RuntimeTraceLink = import('./modules/viewer/index.js').RuntimeTraceLink
+export type RuntimeTraceGroup = import('./modules/viewer/index.js').RuntimeTraceGroup
 export interface RuntimeTraceProjectionOptions {
   includePredicted?: boolean
   showStartMilestone?: boolean
   showEndMilestone?: boolean
 }
 export interface ViewerTimelineOptions {
-  title?: string | null | ((context: import('@bpmn-nova/viewer').ViewerTimelineContext) => string | null)
-  description?: string | null | ((context: import('@bpmn-nova/viewer').ViewerTimelineContext) => string | null)
+  title?: string | null | ((context: import('./modules/viewer/index.js').ViewerTimelineContext) => string | null)
+  description?: string | null | ((context: import('./modules/viewer/index.js').ViewerTimelineContext) => string | null)
 }
 export interface RuntimeDetailsLayoutOptions {
   placement?: 'popover' | 'center' | 'bottom'
@@ -129,13 +131,15 @@ export interface RuntimeDetailsOptions {
   desktop?: RuntimeDetailsLayoutOptions
   mobile?: RuntimeDetailsLayoutOptions
 }
-export type RuntimeTimelineRenderer = import('@bpmn-nova/viewer').RuntimeTimelineRenderer
-export type RuntimeTraceClickEvent = import('@bpmn-nova/viewer').RuntimeTraceClickEvent
+export type RuntimeTimelineRenderer = import('./modules/viewer/index.js').RuntimeTimelineRenderer
+export type RuntimeTraceClickEvent = import('./modules/viewer/index.js').RuntimeTraceClickEvent
 export interface ViewerOptions {
   container: HTMLElement
   model: ProcessModel
   runtime?: ProcessInstanceSnapshot | null
   iconRegistry?: IconRegistry
+  nodeRenderers?: Record<string, Function>
+  nodeRenderer?: Function
   projection?: ViewerProjection
   responsive?: boolean
   timeline?: ViewerTimelineOptions
@@ -143,15 +147,47 @@ export interface ViewerOptions {
   runtimeTraceOptions?: RuntimeTraceProjectionOptions
   onTraceClick?: (event: RuntimeTraceClickEvent) => void
   runtimePresenter?: (context: { model: ProcessModel; runtime: ProcessInstanceSnapshot | null; appearance: RuntimeAppearanceResolver }) => RuntimePresentation
+  runtimeTraceProjector?: import('./modules/viewer/index.js').ViewerOptions['runtimeTraceProjector']
+  runtimeAssetResolver?: import('./modules/viewer/index.js').RuntimeAssetResolver
+  theme?: NovaThemeInput
+  runtimeAppearance?: RuntimeAppearanceOptions
+  svgExport?: SvgExportOptions & { label?: string; nodeRenderers?: Record<string, SvgNodeRenderer>; runtimeTimelineRenderer?: RuntimeTimelineSvgRenderer }
+  onThemeChange?: (state: NovaThemeState) => void
+  runtimeTimelineRenderer?: RuntimeTimelineRenderer
+  onRuntimeTraceItemClick?: import('./modules/viewer/index.js').ViewerOptions['onRuntimeTraceItemClick']
+  onProjectionChange?: import('./modules/viewer/index.js').ViewerOptions['onProjectionChange']
   runtimeDetailsRenderer?: RuntimeDetailsRenderer | null
-  onRuntimeDetailsOpen?: Function
+  onRuntimeDetailsOpen?: import('./modules/viewer/index.js').ViewerOptions['onRuntimeDetailsOpen']
   runtimeTransitionDetailsRenderer?: RuntimeTransitionDetailsRenderer | null
-  onRuntimeTransitionDetailsOpen?: Function
+  onRuntimeTransitionDetailsOpen?: import('./modules/viewer/index.js').ViewerOptions['onRuntimeTransitionDetailsOpen']
+  onElementClick?: import('./modules/viewer/index.js').ViewerOptions['onElementClick']
 }
 export class BpmnViewer {
   constructor(options: ViewerOptions)
-  setDisplayOptions(options: { timeline?: ViewerTimelineOptions; runtimeDetails?: RuntimeDetailsOptions; runtimeTraceOptions?: RuntimeTraceProjectionOptions }): void
+  model: ProcessModel
+  runtime: ProcessInstanceSnapshot | null
+  projection: ViewerProjection
+  responsive: boolean
+  activeProjection: Exclude<ViewerProjection, 'auto'>
+  traceProjection: RuntimeTraceProjection | null
+  setModel(model: ProcessModel): void
+  setRuntime(runtime: ProcessInstanceSnapshot | null): void
+  setDisplayOptions(options: { timeline?: ViewerTimelineOptions; runtimeDetails?: RuntimeDetailsOptions; runtimeTraceOptions?: RuntimeTraceProjectionOptions; runtimeAssetResolver?: import('./modules/viewer/index.js').RuntimeAssetResolver | null }): void
+  setProjection(projection: ViewerProjection): void
+  setTheme(theme: NovaThemeInput): NovaThemeState
+  setThemeMode(mode: NovaThemeMode): NovaThemeState
+  getThemeState(): NovaThemeState
+  exportSvg(options?: SvgExportOptions): Promise<SvgExportArtifact>
+  openSvgExportPreview(options?: SvgExportOptions & { previewTitle?: string; onDownload?: (artifact: SvgExportArtifact) => void }): SvgExportPreviewController
+  setRuntimeAppearance(options: RuntimeAppearanceOptions | null): void
   fitView(): void
+  zoomBy(delta: number): void
+  clearSelection(): void
+  openRuntimeDetails(node: BpmnNode, presentation?: NodeRuntimePresentation, anchor?: Element | null): boolean
+  openRuntimeTransitionDetails(transition: import('./modules/runtime/index.js').RuntimeTransitionPresentation | string, anchor?: Element | null): boolean
+  closeRuntimeAssetPreview(): void
+  closeRuntimeDetails(): void
+  refresh(): void
   destroy(): void
 }
 
@@ -387,6 +423,8 @@ export class BpmnCanvas {
   setTheme(theme: NovaThemeInput): NovaThemeState
   setThemeMode(mode: NovaThemeMode): NovaThemeState
   getThemeState(): NovaThemeState
+  exportSvg(options?: SvgExportOptions): Promise<SvgExportArtifact>
+  openSvgExportPreview(options?: SvgExportOptions & { previewTitle?: string; onDownload?: (artifact: SvgExportArtifact) => void }): SvgExportPreviewController
   closeContextMenu(): void
   destroy(): void
 }
@@ -426,6 +464,7 @@ export interface StudioShellOptions {
   rightWidth?: number
   theme?: NovaThemeInput
   runtimeAppearance?: RuntimeAppearanceOptions
+  svgExport?: SvgExportOptions & { label?: string; nodeRenderers?: Record<string, SvgNodeRenderer>; runtimeTimelineRenderer?: RuntimeTimelineSvgRenderer }
   onThemeChange?: (state: NovaThemeState) => void
 }
 export class BpmnStudioShell {
@@ -442,6 +481,8 @@ export class BpmnStudioShell {
   setRuntimeAppearance(options: RuntimeAppearanceOptions | null): void
   fitView(): void
   zoomBy(factor: number): void
+  exportSvg(options?: SvgExportOptions): Promise<SvgExportArtifact>
+  openSvgExportPreview(options?: SvgExportOptions & { previewTitle?: string; onDownload?: (artifact: SvgExportArtifact) => void }): SvgExportPreviewController | null
   destroy(): void
 }
 export function createStudioShell(options: StudioShellOptions): BpmnStudioShell

package/dist/index.js

@@ -1,16 +1,17 @@
-export * from '@bpmn-nova/core';
-export * from '@bpmn-nova/bpmn-model';
-export * from '@bpmn-nova/runtime';
-export * from '@bpmn-nova/theme';
-export * from '@bpmn-nova/designer';
-export * from '@bpmn-nova/viewer';
-export * from '@bpmn-nova/flowable';
-export * from '@bpmn-nova/activiti';
-export * from '@bpmn-nova/properties';
+export * from './modules/core/index.js';
+export * from './modules/bpmn-model/index.js';
+export * from './modules/runtime/index.js';
+export * from './modules/theme/index.js';
+export * from './modules/export-svg/index.js';
+export * from './modules/designer/index.js';
+export * from './modules/viewer/index.js';
+export * from './modules/engine-flowable/index.js';
+export * from './modules/engine-activiti/index.js';
+export * from './modules/properties/index.js';
 export * from './controller.js';
 export * from './interactions.js';
 export * from './canvas.js';
 export * from './context-menu.js';
 export * from './shell.js';
-export * from '@bpmn-nova/icons';
-export * from '@bpmn-nova/palette';
+export * from './modules/icons/index.js';
+export * from './modules/palette/index.js';

package/dist/interactions.js

@@ -1,4 +1,4 @@
-import { NODE_DEFINITIONS } from '@bpmn-nova/core';
+import { NODE_DEFINITIONS } from './modules/core/index.js';
 
 export const CREATE_INTENT_MIME = 'application/x-bpmn-nova-create-intent+json';
 

package/dist/modules/bpmn-model/index.d.ts

@@ -0,0 +1,11 @@
+import type { EngineId, ProcessModel } from '../core/index.js'
+import type { FlowableEngineProfile } from '../engine-flowable/index.js'
+import type { ActivitiEngineProfile } from '../engine-activiti/index.js'
+
+export const engineProfiles: {
+  flowable: FlowableEngineProfile
+  activiti: ActivitiEngineProfile
+}
+export function detectEngineFromXml(xml: string): EngineId
+export function importBpmn(xml: string, engineHint?: EngineId): ProcessModel
+export function exportBpmn(model: ProcessModel, engineOverride?: EngineId): string