SfnDiagramGenerator
Defined in: src/index.ts:315
Class-based API for advanced usage with fluent interface
This class allows you to configure diagram options once and generate multiple
diagrams with the same settings. Options can be updated using the fluent
setOptions() method.
Example
Section titled “Example”import { SfnDiagramGenerator } from 'sfn-diagram';
const generator = new SfnDiagramGenerator({ theme: 'dark', layout: 'LR', nodeWidth: 150});
// Generate multiple diagrams with the same optionsconst diagram1 = generator.generateSvg({ aslDefinition: stateMachine1 });const diagram2 = generator.generateSvg({ aslDefinition: stateMachine2 });
// Update options and generate moregenerator.setOptions({ theme: 'light' });const diagram3 = generator.generateSvg({ aslDefinition: stateMachine3 });Constructors
Section titled “Constructors”Constructor
Section titled “Constructor”new SfnDiagramGenerator(options?): SfnDiagramGenerator;Defined in: src/index.ts:328
Create a new diagram generator with default options
Parameters
Section titled “Parameters”options?
Section titled “options?”DiagramOptions = {}
Default diagram options for all subsequent generations
Returns
Section titled “Returns”SfnDiagramGenerator
Example
Section titled “Example”const generator = new SfnDiagramGenerator({ theme: 'dark', layout: 'LR' });Methods
Section titled “Methods”generate()
Section titled “generate()”generate(params): | SvgOutput | HtmlOutput | MermaidOutput;Defined in: src/index.ts:344
Generate a diagram (auto-detects format from options)
Parameters
Section titled “Parameters”params
Section titled “params”Generation parameters
aslDefinition
Section titled “aslDefinition”string | AslDefinition
ASL definition as an object or JSON string
Returns
Section titled “Returns”| SvgOutput
| HtmlOutput
| MermaidOutput
SVG or Mermaid output based on format option
Example
Section titled “Example”const result = generator.generate({ aslDefinition: myStateMachine });generateMermaid()
Section titled “generateMermaid()”generateMermaid(params): MermaidOutput;Defined in: src/index.ts:378
Generate Mermaid diagram syntax
Parameters
Section titled “Parameters”params
Section titled “params”Generation parameters
aslDefinition
Section titled “aslDefinition”string | AslDefinition
ASL definition as an object or JSON string
Returns
Section titled “Returns”Mermaid output with code and metadata
Example
Section titled “Example”const { code } = generator.generateMermaid({ aslDefinition: myStateMachine });generateSvg()
Section titled “generateSvg()”generateSvg(params): SvgOutput;Defined in: src/index.ts:362
Generate an SVG diagram
Parameters
Section titled “Parameters”params
Section titled “params”Generation parameters
aslDefinition
Section titled “aslDefinition”string | AslDefinition
ASL definition as an object or JSON string
Returns
Section titled “Returns”SVG output with diagram and metadata
Example
Section titled “Example”const { svg } = generator.generateSvg({ aslDefinition: myStateMachine });setOptions()
Section titled “setOptions()”setOptions(options): this;Defined in: src/index.ts:397
Update the generator’s default options (fluent interface)
Parameters
Section titled “Parameters”options
Section titled “options”Partial<DiagramOptions>
Partial options to merge with existing options
Returns
Section titled “Returns”this
This generator instance for method chaining
Example
Section titled “Example”generator .setOptions({ theme: 'dark' }) .setOptions({ layout: 'LR' });
const result = generator.generateSvg({ aslDefinition: myAsl });