BaseViewer.d.ts 7.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280
  1. /**
  2. * A base viewer for BPMN 2.0 diagrams.
  3. *
  4. * Have a look at {@link Viewer}, {@link NavigatedViewer} or {@link Modeler} for
  5. * bundles that include actual features.
  6. *
  7. */
  8. export default class BaseViewer extends Diagram {
  9. /**
  10. * @param options The options to configure the viewer.
  11. */
  12. constructor(options?: BaseViewerOptions);
  13. /**
  14. * Parse and render a BPMN 2.0 diagram.
  15. *
  16. * Once finished the viewer reports back the result to the
  17. * provided callback function with (err, warnings).
  18. *
  19. * ## Life-Cycle Events
  20. *
  21. * During import the viewer will fire life-cycle events:
  22. *
  23. * * import.parse.start (about to read model from XML)
  24. * * import.parse.complete (model read; may have worked or not)
  25. * * import.render.start (graphical import start)
  26. * * import.render.complete (graphical import finished)
  27. * * import.done (everything done)
  28. *
  29. * You can use these events to hook into the life-cycle.
  30. *
  31. * @throws {ImportXMLError} An error thrown during the import of the XML.
  32. *
  33. * @fires BaseViewer#ImportParseStartEvent
  34. * @fires BaseViewer#ImportParseCompleteEvent
  35. * @fires Importer#ImportRenderStartEvent
  36. * @fires Importer#ImportRenderCompleteEvent
  37. * @fires BaseViewer#ImportDoneEvent
  38. *
  39. * @param xml The BPMN 2.0 XML to be imported.
  40. * @param bpmnDiagram The optional diagram or Id of the BPMN diagram to open.
  41. *
  42. * @return A promise resolving with warnings that were produced during the import.
  43. */
  44. importXML(xml: string, bpmnDiagram?: ModdleElement | string): Promise<ImportXMLResult>;
  45. /**
  46. * Import parsed definitions and render a BPMN 2.0 diagram.
  47. *
  48. * Once finished the viewer reports back the result to the
  49. * provided callback function with (err, warnings).
  50. *
  51. * ## Life-Cycle Events
  52. *
  53. * During import the viewer will fire life-cycle events:
  54. *
  55. * * import.render.start (graphical import start)
  56. * * import.render.complete (graphical import finished)
  57. *
  58. * You can use these events to hook into the life-cycle.
  59. *
  60. * @throws {ImportDefinitionsError} An error thrown during the import of the definitions.
  61. *
  62. * @param definitions The definitions.
  63. * @param bpmnDiagram The optional diagram or ID of the BPMN diagram to open.
  64. *
  65. * @return A promise resolving with warnings that were produced during the import.
  66. */
  67. importDefinitions(definitions: ModdleElement, bpmnDiagram?: ModdleElement | string): Promise<ImportDefinitionsResult>;
  68. /**
  69. * Open diagram of previously imported XML.
  70. *
  71. * Once finished the viewer reports back the result to the
  72. * provided callback function with (err, warnings).
  73. *
  74. * ## Life-Cycle Events
  75. *
  76. * During switch the viewer will fire life-cycle events:
  77. *
  78. * * import.render.start (graphical import start)
  79. * * import.render.complete (graphical import finished)
  80. *
  81. * You can use these events to hook into the life-cycle.
  82. *
  83. * @throws {OpenError} An error thrown during opening.
  84. *
  85. * @param bpmnDiagramOrId The diagram or Id of the BPMN diagram to open.
  86. *
  87. * @return A promise resolving with warnings that were produced during opening.
  88. */
  89. open(bpmnDiagramOrId: ModdleElement | string): Promise<OpenResult>;
  90. /**
  91. * Export the currently displayed BPMN 2.0 diagram as
  92. * a BPMN 2.0 XML document.
  93. *
  94. * ## Life-Cycle Events
  95. *
  96. * During XML saving the viewer will fire life-cycle events:
  97. *
  98. * * saveXML.start (before serialization)
  99. * * saveXML.serialized (after xml generation)
  100. * * saveXML.done (everything done)
  101. *
  102. * You can use these events to hook into the life-cycle.
  103. *
  104. * @throws {Error} An error thrown during export.
  105. *
  106. * @fires BaseViewer#SaveXMLStart
  107. * @fires BaseViewer#SaveXMLDone
  108. *
  109. * @param options The options.
  110. *
  111. * @return A promise resolving with the XML.
  112. */
  113. saveXML(options?: SaveXMLOptions): Promise<SaveXMLResult>;
  114. /**
  115. * Export the currently displayed BPMN 2.0 diagram as
  116. * an SVG image.
  117. *
  118. * ## Life-Cycle Events
  119. *
  120. * During SVG saving the viewer will fire life-cycle events:
  121. *
  122. * * saveSVG.start (before serialization)
  123. * * saveSVG.done (everything done)
  124. *
  125. * You can use these events to hook into the life-cycle.
  126. *
  127. * @throws {Error} An error thrown during export.
  128. *
  129. * @fires BaseViewer#SaveSVGDone
  130. *
  131. * @return A promise resolving with the SVG.
  132. */
  133. saveSVG(): Promise<SaveSVGResult>;
  134. /**
  135. * Return modules to instantiate with.
  136. *
  137. * @return The modules.
  138. */
  139. getModules(): ModuleDeclaration[];
  140. /**
  141. * Register an event listener.
  142. *
  143. * Remove an event listener via {@link BaseViewer#off}.
  144. *
  145. *
  146. * @param events The event(s) to listen to.
  147. * @param callback The callback.
  148. * @param that Value of `this` the callback will be called with.
  149. */
  150. on<T>(events: string | string[], callback: EventBusEventCallback<T>, that?: any): any;
  151. /**
  152. * Register an event listener.
  153. *
  154. * Remove an event listener via {@link BaseViewer#off}.
  155. *
  156. *
  157. * @param events The event(s) to listen to.
  158. * @param priority The priority with which to listen.
  159. * @param callback The callback.
  160. * @param that Value of `this` the callback will be called with.
  161. */
  162. on<T>(
  163. events: string | string[],
  164. priority: number,
  165. callback: EventBusEventCallback<T>,
  166. that?: any
  167. ): any;
  168. /**
  169. * Remove an event listener.
  170. *
  171. * @param events The event(s).
  172. * @param callback The callback.
  173. */
  174. off(events: string | string[], callback?: Function): void;
  175. /**
  176. * Attach the viewer to an HTML element.
  177. *
  178. * @param parentNode The parent node to attach to.
  179. */
  180. attachTo(parentNode: HTMLElement): void;
  181. /**
  182. * Get the definitions model element.
  183. *
  184. * @return The definitions model element.
  185. */
  186. getDefinitions(): ModdleElement;
  187. /**
  188. * Detach the viewer.
  189. *
  190. * @fires BaseViewer#DetachEvent
  191. */
  192. detach(): void;
  193. }
  194. type EventBusEventCallback<T> = import('diagram-js/lib/core/EventBus').EventBusEventCallback<T>;
  195. type ModuleDeclaration = import('didi').ModuleDeclaration;
  196. type Moddle = import('./model/Types').Moddle;
  197. type ModdleElement = import('./model/Types').ModdleElement;
  198. type ModdleExtension = import('./model/Types').ModdleExtension;
  199. export type BaseViewerOptions = {
  200. width?: number | string;
  201. height?: number | string;
  202. position?: string;
  203. container?: string | HTMLElement;
  204. moddleExtensions?: ModdleExtensions;
  205. additionalModules?: ModuleDeclaration[];
  206. } & Record<string, any>;
  207. export type ModdleElementsById = Record<string, ModdleElement>;
  208. export type ModdleExtensions = {
  209. [key: string]: import("./model/Types").ModdleExtension;
  210. };
  211. export type ImportXMLResult = {
  212. warnings: string[];
  213. };
  214. export type ImportXMLError = ImportXMLResult & Error;
  215. export type ImportDefinitionsResult = ImportXMLResult;
  216. export type ImportDefinitionsError = ImportXMLError;
  217. export type OpenResult = ImportXMLResult;
  218. export type OpenError = ImportXMLError;
  219. export type SaveXMLOptions = {
  220. format?: boolean;
  221. preamble?: boolean;
  222. };
  223. export type SaveXMLResult = {
  224. xml?: string;
  225. error?: Error;
  226. };
  227. export type SaveSVGResult = {
  228. svg: string;
  229. };
  230. export type ImportParseStartEvent = {
  231. xml: string;
  232. };
  233. export type ImportParseCompleteEvent = {
  234. error?: ImportXMLError;
  235. definitions?: ModdleElement;
  236. elementsById?: ModdleElementsById;
  237. references?: ModdleElement[];
  238. warnings: string[];
  239. };
  240. export type ImportDoneEvent = {
  241. error?: ImportXMLError;
  242. warnings: string[];
  243. };
  244. export type SaveXMLStartEvent = {
  245. definitions: ModdleElement;
  246. };
  247. export type SaveXMLDoneEvent = SaveXMLResult;
  248. export type SaveSVGDoneEvent = {
  249. error?: Error;
  250. svg: string;
  251. };
  252. import Diagram from 'diagram-js';