diff --git a/packages/mermaid/scripts/create-types-from-json-schema.mts b/packages/mermaid/scripts/create-types-from-json-schema.mts index 82e21695c4..317d6b5470 100644 --- a/packages/mermaid/scripts/create-types-from-json-schema.mts +++ b/packages/mermaid/scripts/create-types-from-json-schema.mts @@ -10,18 +10,16 @@ /* eslint-disable no-console */ +import _Ajv2019, { type JSONSchemaType } from 'ajv/dist/2019.js'; +import { JSON_SCHEMA, load } from 'js-yaml'; +import { compile, type JSONSchema } from 'json-schema-to-typescript'; import assert from 'node:assert'; import { execFile } from 'node:child_process'; import { readFile, writeFile } from 'node:fs/promises'; import { join } from 'node:path'; import { promisify } from 'node:util'; - -import { JSON_SCHEMA, load } from 'js-yaml'; -import { compile, type JSONSchema } from 'json-schema-to-typescript'; import prettier from 'prettier'; -import _Ajv2019, { type JSONSchemaType } from 'ajv/dist/2019.js'; - // Workaround for wrong AJV types, see // https://github.com/ajv-validator/ajv/issues/2132#issuecomment-1290409907 const Ajv2019 = _Ajv2019 as unknown as typeof _Ajv2019.default; @@ -34,28 +32,6 @@ const verifyOnly = process.argv.includes('--verify'); /** If `true`, automatically `git add` any changes (i.e. during `pnpm run pre-commit`)*/ const git = process.argv.includes('--git'); -/** - * All of the keys in the mermaid config that have a mermaid diagram config. - */ -const MERMAID_CONFIG_DIAGRAM_KEYS = [ - 'flowchart', - 'sequence', - 'gantt', - 'journey', - 'class', - 'state', - 'er', - 'pie', - 'quadrantChart', - 'xyChart', - 'requirement', - 'mindmap', - 'timeline', - 'gitGraph', - 'c4', - 'sankey', -]; - /** * Loads the MermaidConfig JSON schema YAML file. * @@ -131,53 +107,9 @@ async function generateTypescript(mermaidConfigSchema: JSONSchemaType) { - return { - ...schema, - properties: Object.fromEntries( - Object.entries(schema.properties).map(([key, propertySchema]) => { - if (MERMAID_CONFIG_DIAGRAM_KEYS.includes(key)) { - const { $ref, ...propertySchemaWithoutRef } = propertySchema as JSONSchemaType; - if ($ref === undefined) { - throw Error( - `subSchema ${key} is in MERMAID_CONFIG_DIAGRAM_KEYS but does not have a $ref field` - ); - } - const [ - _root, // eslint-disable-line @typescript-eslint/no-unused-vars - _defs, // eslint-disable-line @typescript-eslint/no-unused-vars - defName, - ] = $ref.split('/'); - return [ - key, - { - ...propertySchemaWithoutRef, - tsType: defName, - }, - ]; - } - return [key, propertySchema]; - }) - ), - }; - } - assert.ok(mermaidConfigSchema.$defs); const modifiedSchema = { - ...unrefSubschemas(mermaidConfigSchema), + ...mermaidConfigSchema, $defs: Object.fromEntries( Object.entries(mermaidConfigSchema.$defs).map(([key, subSchema]) => { return [key, replaceAllOfWithExtends(subSchema as JSONSchemaType>)]; diff --git a/packages/mermaid/src/config.type.ts b/packages/mermaid/src/config.type.ts index 221763eff1..512e867123 100644 --- a/packages/mermaid/src/config.type.ts +++ b/packages/mermaid/src/config.type.ts @@ -5,17 +5,6 @@ * and run json-schema-to-typescript to regenerate this file. */ -/** - * Configuration options to pass to the `dompurify` library. - */ -export type DOMPurifyConfiguration = import('dompurify').Config; -/** - * MermaidConfig with all fields optional - * - * This interface was referenced by `MermaidConfig`'s JSON-Schema - * via the `definition` "PartialMermaidConfig". - */ -export type PartialMermaidConfig = import('type-fest').PartialDeep; /** * JavaScript function that returns a `FontConfig`. * @@ -57,6 +46,17 @@ export type SankeyLinkColor = 'source' | 'target' | 'gradient'; * via the `definition` "SankeyNodeAlignment". */ export type SankeyNodeAlignment = 'left' | 'right' | 'center' | 'justify'; +/** + * Configuration options to pass to the `dompurify` library. + */ +export type DOMPurifyConfiguration = import('dompurify').Config; +/** + * MermaidConfig with all fields optional + * + * This interface was referenced by `MermaidConfig`'s JSON-Schema + * via the `definition` "PartialMermaidConfig". + */ +export type PartialMermaidConfig = import('type-fest').PartialDeep; /** * The font size to use */ @@ -182,36 +182,77 @@ export interface MermaidConfig { suppressErrorRendering?: boolean; } /** - * The object containing configurations specific for packet diagrams. + * The object containing configurations specific for flowcharts * * This interface was referenced by `MermaidConfig`'s JSON-Schema - * via the `definition` "PacketDiagramConfig". + * via the `definition` "FlowchartDiagramConfig". */ -export interface PacketDiagramConfig extends BaseDiagramConfig { +export interface FlowchartDiagramConfig extends BaseDiagramConfig { /** - * The height of each row in the packet diagram. + * Margin top for the text over the diagram */ - rowHeight?: number; + titleTopMargin: number; /** - * The width of each bit in the packet diagram. + * Defines a top/bottom margin for subgraph titles + * */ - bitWidth?: number; + subGraphTitleMargin: { + top?: number; + bottom?: number; + }; + arrowMarkerAbsolute?: boolean; /** - * The number of bits to display per row. + * The amount of padding around the diagram as a whole so that embedded + * diagrams have margins, expressed in pixels. + * */ - bitsPerRow?: number; + diagramPadding: number; /** - * Toggle to display or hide bit numbers. + * Flag for setting whether or not a html tag should be used for rendering labels on the edges. + * */ - showBits?: boolean; + htmlLabels: boolean; /** - * The horizontal padding between the blocks in a row. + * Defines the spacing between nodes on the same level + * + * Pertains to horizontal spacing for TB (top to bottom) or BT (bottom to top) graphs, + * and the vertical spacing for LR as well as RL graphs. + * */ - paddingX?: number; + nodeSpacing: number; /** - * The vertical padding between the rows. + * Defines the spacing between nodes on different levels + * + * Pertains to horizontal spacing for TB (top to bottom) or BT (bottom to top) graphs, + * and the vertical spacing for LR as well as RL graphs. + * */ - paddingY?: number; + rankSpacing: number; + /** + * Defines how mermaid renders curves for flowcharts. + * + */ + curve: 'basis' | 'linear' | 'cardinal'; + /** + * Represents the padding between the labels and the shape + * + * **Only used in new experimental rendering.** + * + */ + padding?: number; + /** + * Decides which rendering engine that is to be used for the rendering. + * + */ + defaultRenderer: 'dagre-d3' | 'dagre-wrapper' | 'elk'; + /** + * Width of nodes where text is wrapped. + * + * When using markdown strings the text ius wrapped automatically, this + * value sets the max width of a text before it continues on a new line. + * + */ + wrappingWidth: number; } /** * This interface was referenced by `MermaidConfig`'s JSON-Schema @@ -228,455 +269,512 @@ export interface BaseDiagramConfig { useMaxWidth?: boolean; } /** - * The object containing configurations specific for block diagrams. - * - * This interface was referenced by `MermaidConfig`'s JSON-Schema - * via the `definition` "BlockDiagramConfig". - */ -export interface BlockDiagramConfig extends BaseDiagramConfig { - padding?: number; -} -/** - * The object containing configurations specific for c4 diagrams + * The object containing configurations specific for sequence diagrams * * This interface was referenced by `MermaidConfig`'s JSON-Schema - * via the `definition` "C4DiagramConfig". + * via the `definition` "SequenceDiagramConfig". */ -export interface C4DiagramConfig extends BaseDiagramConfig { +export interface SequenceDiagramConfig extends BaseDiagramConfig { + arrowMarkerAbsolute?: boolean; + hideUnusedParticipants?: boolean; /** - * Margin to the right and left of the c4 diagram, must be a positive value. - * + * Width of the activation rect */ - diagramMarginX: number; + activationWidth: number; /** - * Margin to the over and under the c4 diagram, must be a positive value. - * + * Margin to the right and left of the sequence diagram */ - diagramMarginY: number; + diagramMarginX: number; /** - * Margin between shapes + * Margin to the over and under the sequence diagram */ - c4ShapeMargin: number; + diagramMarginY: number; /** - * Padding between shapes + * Margin between actors */ - c4ShapePadding: number; + actorMargin: number; /** - * Width of person boxes + * Width of actor boxes */ width: number; /** - * Height of person boxes + * Height of actor boxes */ height: number; /** - * Margin around boxes + * Margin around loop boxes */ boxMargin: number; /** - * How many shapes to place in each row. + * Margin around the text in loop/alt/opt boxes */ - c4ShapeInRow: number; - nextLinePaddingX?: number; + boxTextMargin: number; /** - * How many boundaries to place in each row. + * Margin around notes */ - c4BoundaryInRow: number; + noteMargin: number; /** - * This sets the font size of Person shape for the diagram + * Space between messages. */ - personFontSize?: string | number; + messageMargin: number; /** - * This sets the font weight of Person shape for the diagram + * Multiline message alignment */ - personFontFamily?: string; + messageAlign: 'left' | 'center' | 'right'; /** - * This sets the font weight of Person shape for the diagram + * Mirror actors under diagram + * */ - personFontWeight?: string | number; + mirrorActors: boolean; /** - * This sets the font size of External Person shape for the diagram + * forces actor popup menus to always be visible (to support E2E testing). + * */ - external_personFontSize?: string | number; + forceMenus: boolean; /** - * This sets the font family of External Person shape for the diagram + * Prolongs the edge of the diagram downwards. + * + * Depending on css styling this might need adjustment. + * */ - external_personFontFamily?: string; + bottomMarginAdj: number; /** - * This sets the font weight of External Person shape for the diagram + * Curved Arrows become Right Angles + * + * This will display arrows that start and begin at the same node as + * right angles, rather than as curves. + * */ - external_personFontWeight?: string | number; + rightAngles: boolean; /** - * This sets the font size of System shape for the diagram + * This will show the node numbers */ - systemFontSize?: string | number; + showSequenceNumbers: boolean; /** - * This sets the font family of System shape for the diagram + * This sets the font size of the actor's description */ - systemFontFamily?: string; + actorFontSize: string | number; /** - * This sets the font weight of System shape for the diagram + * This sets the font family of the actor's description */ - systemFontWeight?: string | number; + actorFontFamily: string; /** - * This sets the font size of External System shape for the diagram + * This sets the font weight of the actor's description */ - external_systemFontSize?: string | number; + actorFontWeight: string | number; /** - * This sets the font family of External System shape for the diagram + * This sets the font size of actor-attached notes */ - external_systemFontFamily?: string; + noteFontSize: string | number; /** - * This sets the font weight of External System shape for the diagram + * This sets the font family of actor-attached notes */ - external_systemFontWeight?: string | number; + noteFontFamily: string; /** - * This sets the font size of System DB shape for the diagram + * This sets the font weight of actor-attached notes */ - system_dbFontSize?: string | number; + noteFontWeight: string | number; /** - * This sets the font family of System DB shape for the diagram + * This sets the text alignment of actor-attached notes */ - system_dbFontFamily?: string; + noteAlign: 'left' | 'center' | 'right'; /** - * This sets the font weight of System DB shape for the diagram + * This sets the font size of actor messages */ - system_dbFontWeight?: string | number; + messageFontSize: string | number; /** - * This sets the font size of External System DB shape for the diagram + * This sets the font family of actor messages */ - external_system_dbFontSize?: string | number; + messageFontFamily: string; /** - * This sets the font family of External System DB shape for the diagram + * This sets the font weight of actor messages */ - external_system_dbFontFamily?: string; + messageFontWeight: string | number; /** - * This sets the font weight of External System DB shape for the diagram + * This sets the auto-wrap state for the diagram */ - external_system_dbFontWeight?: string | number; + wrap?: boolean; /** - * This sets the font size of System Queue shape for the diagram + * This sets the auto-wrap padding for the diagram (sides only) */ - system_queueFontSize?: string | number; + wrapPadding?: number; /** - * This sets the font family of System Queue shape for the diagram + * This sets the width of the loop-box (loop, alt, opt, par) */ - system_queueFontFamily?: string; + labelBoxWidth?: number; /** - * This sets the font weight of System Queue shape for the diagram + * This sets the height of the loop-box (loop, alt, opt, par) */ - system_queueFontWeight?: string | number; + labelBoxHeight?: number; + messageFont?: FontCalculator; + noteFont?: FontCalculator; + actorFont?: FontCalculator; +} +/** + * The object containing configurations specific for gantt diagrams + * + * + * This interface was referenced by `MermaidConfig`'s JSON-Schema + * via the `definition` "GanttDiagramConfig". + */ +export interface GanttDiagramConfig extends BaseDiagramConfig { /** - * This sets the font size of External System Queue shape for the diagram + * Margin top for the text over the diagram */ - external_system_queueFontSize?: string | number; + titleTopMargin: number; /** - * This sets the font family of External System Queue shape for the diagram + * The height of the bars in the graph */ - external_system_queueFontFamily?: string; + barHeight: number; /** - * This sets the font weight of External System Queue shape for the diagram + * The margin between the different activities in the gantt diagram */ - external_system_queueFontWeight?: string | number; + barGap?: number; /** - * This sets the font size of Boundary shape for the diagram + * Margin between title and gantt diagram and between axis and gantt diagram. + * */ - boundaryFontSize?: string | number; + topPadding: number; /** - * This sets the font family of Boundary shape for the diagram + * The space allocated for the section name to the right of the activities + * */ - boundaryFontFamily?: string; + rightPadding: number; /** - * This sets the font weight of Boundary shape for the diagram + * The space allocated for the section name to the left of the activities + * */ - boundaryFontWeight?: string | number; + leftPadding: number; /** - * This sets the font size of Message shape for the diagram + * Vertical starting position of the grid lines */ - messageFontSize?: string | number; + gridLineStartPadding: number; /** - * This sets the font family of Message shape for the diagram + * Font size */ - messageFontFamily?: string; + fontSize: number; /** - * This sets the font weight of Message shape for the diagram + * Font size for sections */ - messageFontWeight?: string | number; + sectionFontSize: string | number; /** - * This sets the font size of Container shape for the diagram + * The number of alternating section styles */ - containerFontSize?: string | number; + numberSectionStyles: number; /** - * This sets the font family of Container shape for the diagram + * Date/time format of the axis + * + * This might need adjustment to match your locale and preferences. + * */ - containerFontFamily?: string; + axisFormat: string; /** - * This sets the font weight of Container shape for the diagram + * axis ticks + * + * Pattern is: + * + * ```javascript + * /^([1-9][0-9]*)(millisecond|second|minute|hour|day|week|month)$/ + * ``` + * */ - containerFontWeight?: string | number; + tickInterval?: string; /** - * This sets the font size of External Container shape for the diagram + * When this flag is set, date labels will be added to the top of the chart + * */ - external_containerFontSize?: string | number; + topAxis: boolean; /** - * This sets the font family of External Container shape for the diagram + * Controls the display mode. + * */ - external_containerFontFamily?: string; + displayMode?: '' | 'compact'; /** - * This sets the font weight of External Container shape for the diagram + * On which day a week-based interval should start + * */ - external_containerFontWeight?: string | number; + weekday: 'monday' | 'tuesday' | 'wednesday' | 'thursday' | 'friday' | 'saturday' | 'sunday'; +} +/** + * The object containing configurations specific for journey diagrams + * + * + * This interface was referenced by `MermaidConfig`'s JSON-Schema + * via the `definition` "JourneyDiagramConfig". + */ +export interface JourneyDiagramConfig extends BaseDiagramConfig { /** - * This sets the font size of Container DB shape for the diagram + * Margin to the right and left of the c4 diagram, must be a positive value. + * */ - container_dbFontSize?: string | number; + diagramMarginX: number; /** - * This sets the font family of Container DB shape for the diagram + * Margin to the over and under the c4 diagram, must be a positive value. + * */ - container_dbFontFamily?: string; + diagramMarginY: number; /** - * This sets the font weight of Container DB shape for the diagram + * Margin between actors */ - container_dbFontWeight?: string | number; + leftMargin: number; /** - * This sets the font size of External Container DB shape for the diagram + * Width of actor boxes */ - external_container_dbFontSize?: string | number; + width: number; /** - * This sets the font family of External Container DB shape for the diagram + * Height of actor boxes */ - external_container_dbFontFamily?: string; + height: number; /** - * This sets the font weight of External Container DB shape for the diagram + * Margin around loop boxes */ - external_container_dbFontWeight?: string | number; + boxMargin: number; /** - * This sets the font size of Container Queue shape for the diagram + * Margin around the text in loop/alt/opt boxes */ - container_queueFontSize?: string | number; + boxTextMargin: number; /** - * This sets the font family of Container Queue shape for the diagram + * Margin around notes */ - container_queueFontFamily?: string; + noteMargin: number; /** - * This sets the font weight of Container Queue shape for the diagram + * Space between messages. */ - container_queueFontWeight?: string | number; + messageMargin: number; /** - * This sets the font size of External Container Queue shape for the diagram + * Multiline message alignment */ - external_container_queueFontSize?: string | number; + messageAlign: 'left' | 'center' | 'right'; /** - * This sets the font family of External Container Queue shape for the diagram + * Prolongs the edge of the diagram downwards. + * + * Depending on css styling this might need adjustment. + * */ - external_container_queueFontFamily?: string; + bottomMarginAdj: number; /** - * This sets the font weight of External Container Queue shape for the diagram + * Curved Arrows become Right Angles + * + * This will display arrows that start and begin at the same node as + * right angles, rather than as curves. + * */ - external_container_queueFontWeight?: string | number; + rightAngles: boolean; + taskFontSize?: string | number; + taskFontFamily?: string; + taskMargin?: number; /** - * This sets the font size of Component shape for the diagram + * Width of activation box */ - componentFontSize?: string | number; + activationWidth?: number; /** - * This sets the font family of Component shape for the diagram + * text placement as: tspan | fo | old only text as before + * */ - componentFontFamily?: string; + textPlacement?: string; + actorColours?: string[]; + sectionFills?: string[]; + sectionColours?: string[]; +} +/** + * This interface was referenced by `MermaidConfig`'s JSON-Schema + * via the `definition` "TimelineDiagramConfig". + */ +export interface TimelineDiagramConfig extends BaseDiagramConfig { /** - * This sets the font weight of Component shape for the diagram + * Margin to the right and left of the c4 diagram, must be a positive value. + * */ - componentFontWeight?: string | number; + diagramMarginX: number; /** - * This sets the font size of External Component shape for the diagram + * Margin to the over and under the c4 diagram, must be a positive value. + * */ - external_componentFontSize?: string | number; + diagramMarginY: number; /** - * This sets the font family of External Component shape for the diagram + * Margin between actors */ - external_componentFontFamily?: string; + leftMargin: number; /** - * This sets the font weight of External Component shape for the diagram + * Width of actor boxes */ - external_componentFontWeight?: string | number; + width: number; /** - * This sets the font size of Component DB shape for the diagram + * Height of actor boxes */ - component_dbFontSize?: string | number; + height: number; + padding?: number; /** - * This sets the font family of Component DB shape for the diagram + * Margin around loop boxes */ - component_dbFontFamily?: string; + boxMargin: number; /** - * This sets the font weight of Component DB shape for the diagram + * Margin around the text in loop/alt/opt boxes */ - component_dbFontWeight?: string | number; + boxTextMargin: number; /** - * This sets the font size of External Component DB shape for the diagram + * Margin around notes */ - external_component_dbFontSize?: string | number; + noteMargin: number; /** - * This sets the font family of External Component DB shape for the diagram + * Space between messages. */ - external_component_dbFontFamily?: string; + messageMargin: number; /** - * This sets the font weight of External Component DB shape for the diagram + * Multiline message alignment */ - external_component_dbFontWeight?: string | number; + messageAlign: 'left' | 'center' | 'right'; /** - * This sets the font size of Component Queue shape for the diagram + * Prolongs the edge of the diagram downwards. + * + * Depending on css styling this might need adjustment. + * */ - component_queueFontSize?: string | number; + bottomMarginAdj: number; /** - * This sets the font family of Component Queue shape for the diagram + * Curved Arrows become Right Angles + * + * This will display arrows that start and begin at the same node as + * right angles, rather than as curves. + * */ - component_queueFontFamily?: string; + rightAngles?: boolean; + taskFontSize?: string | number; + taskFontFamily?: string; + taskMargin?: number; /** - * This sets the font weight of Component Queue shape for the diagram + * Width of activation box */ - component_queueFontWeight?: string | number; + activationWidth?: number; /** - * This sets the font size of External Component Queue shape for the diagram + * text placement as: tspan | fo | old only text as before + * */ - external_component_queueFontSize?: string | number; + textPlacement?: string; + actorColours?: string[]; + sectionFills?: string[]; + sectionColours?: string[]; + disableMulticolor?: boolean; +} +/** + * This interface was referenced by `MermaidConfig`'s JSON-Schema + * via the `definition` "ClassDiagramConfig". + */ +export interface ClassDiagramConfig extends BaseDiagramConfig { /** - * This sets the font family of External Component Queue shape for the diagram + * Margin top for the text over the diagram */ - external_component_queueFontFamily?: string; + titleTopMargin: number; /** - * This sets the font weight of External Component Queue shape for the diagram + * Controls whether or arrow markers in html code are absolute paths or anchors. + * This matters if you are using base tag settings. + * */ - external_component_queueFontWeight?: string | number; + arrowMarkerAbsolute?: boolean; + dividerMargin?: number; + padding?: number; + textHeight?: number; /** - * This sets the auto-wrap state for the diagram + * Decides which rendering engine that is to be used for the rendering. + * */ - wrap?: boolean; + defaultRenderer: 'dagre-d3' | 'dagre-wrapper' | 'elk'; + nodeSpacing?: number; + rankSpacing?: number; /** - * This sets the auto-wrap padding for the diagram (sides only) + * The amount of padding around the diagram as a whole so that embedded + * diagrams have margins, expressed in pixels. + * */ - wrapPadding?: number; - person_bg_color?: string; - person_border_color?: string; - external_person_bg_color?: string; - external_person_border_color?: string; - system_bg_color?: string; - system_border_color?: string; - system_db_bg_color?: string; - system_db_border_color?: string; - system_queue_bg_color?: string; - system_queue_border_color?: string; - external_system_bg_color?: string; - external_system_border_color?: string; - external_system_db_bg_color?: string; - external_system_db_border_color?: string; - external_system_queue_bg_color?: string; - external_system_queue_border_color?: string; - container_bg_color?: string; - container_border_color?: string; - container_db_bg_color?: string; - container_db_border_color?: string; - container_queue_bg_color?: string; - container_queue_border_color?: string; - external_container_bg_color?: string; - external_container_border_color?: string; - external_container_db_bg_color?: string; - external_container_db_border_color?: string; - external_container_queue_bg_color?: string; - external_container_queue_border_color?: string; - component_bg_color?: string; - component_border_color?: string; - component_db_bg_color?: string; - component_db_border_color?: string; - component_queue_bg_color?: string; - component_queue_border_color?: string; - external_component_bg_color?: string; - external_component_border_color?: string; - external_component_db_bg_color?: string; - external_component_db_border_color?: string; - external_component_queue_bg_color?: string; - external_component_queue_border_color?: string; - personFont?: FontCalculator; - external_personFont?: FontCalculator; - systemFont?: FontCalculator; - external_systemFont?: FontCalculator; - system_dbFont?: FontCalculator; - external_system_dbFont?: FontCalculator; - system_queueFont?: FontCalculator; - external_system_queueFont?: FontCalculator; - containerFont?: FontCalculator; - external_containerFont?: FontCalculator; - container_dbFont?: FontCalculator; - external_container_dbFont?: FontCalculator; - container_queueFont?: FontCalculator; - external_container_queueFont?: FontCalculator; - componentFont?: FontCalculator; - external_componentFont?: FontCalculator; - component_dbFont?: FontCalculator; - external_component_dbFont?: FontCalculator; - component_queueFont?: FontCalculator; - external_component_queueFont?: FontCalculator; - boundaryFont?: FontCalculator; - messageFont?: FontCalculator; + diagramPadding?: number; + htmlLabels?: boolean; } /** + * The object containing configurations specific for entity relationship diagrams + * * This interface was referenced by `MermaidConfig`'s JSON-Schema - * via the `definition` "GitGraphDiagramConfig". + * via the `definition` "StateDiagramConfig". */ -export interface GitGraphDiagramConfig extends BaseDiagramConfig { +export interface StateDiagramConfig extends BaseDiagramConfig { /** * Margin top for the text over the diagram */ titleTopMargin: number; - diagramPadding?: number; - nodeLabel?: NodeLabel; - mainBranchName?: string; - mainBranchOrder?: number; - showCommitLabel?: boolean; - showBranches?: boolean; - rotateCommitLabel?: boolean; - parallelCommits?: boolean; + arrowMarkerAbsolute?: boolean; + dividerMargin?: number; + sizeUnit?: number; + padding?: number; + textHeight?: number; + titleShift?: number; + noteMargin?: number; + forkWidth?: number; + forkHeight?: number; + miniPadding?: number; /** - * Controls whether or arrow markers in html code are absolute paths or anchors. - * This matters if you are using base tag settings. + * Font size factor, this is used to guess the width of the edges labels + * before rendering by dagre layout. + * This might need updating if/when switching font * */ - arrowMarkerAbsolute?: boolean; -} -/** - * This interface was referenced by `MermaidConfig`'s JSON-Schema - * via the `definition` "NodeLabel". - */ -export interface NodeLabel { - width?: number; - height?: number; - x?: number; - y?: number; -} -/** - * The object containing configurations specific for req diagrams - * - * This interface was referenced by `MermaidConfig`'s JSON-Schema - * via the `definition` "RequirementDiagramConfig". - */ -export interface RequirementDiagramConfig extends BaseDiagramConfig { - rect_fill?: string; - text_color?: string; - rect_border_size?: string; - rect_border_color?: string; - rect_min_width?: number; - rect_min_height?: number; + fontSizeFactor?: number; fontSize?: number; - rect_padding?: number; - line_height?: number; + labelHeight?: number; + edgeLengthFactor?: string; + compositTitleSize?: number; + radius?: number; + /** + * Decides which rendering engine that is to be used for the rendering. + * + */ + defaultRenderer: 'dagre-d3' | 'dagre-wrapper' | 'elk'; } /** - * The object containing configurations specific for mindmap diagrams + * The object containing configurations specific for entity relationship diagrams * * This interface was referenced by `MermaidConfig`'s JSON-Schema - * via the `definition` "MindmapDiagramConfig". + * via the `definition` "ErDiagramConfig". */ -export interface MindmapDiagramConfig extends BaseDiagramConfig { - padding: number; - maxNodeWidth: number; +export interface ErDiagramConfig extends BaseDiagramConfig { + /** + * Margin top for the text over the diagram + */ + titleTopMargin: number; + /** + * The amount of padding around the diagram as a whole so that embedded + * diagrams have margins, expressed in pixels. + * + */ + diagramPadding: number; + /** + * Directional bias for layout of entities + */ + layoutDirection: 'TB' | 'BT' | 'LR' | 'RL'; + /** + * The minimum width of an entity box. Expressed in pixels. + */ + minEntityWidth: number; + /** + * The minimum height of an entity box. Expressed in pixels. + */ + minEntityHeight: number; + /** + * The minimum internal padding between text in an entity box and the enclosing box borders. + * Expressed in pixels. + * + */ + entityPadding: number; + /** + * Stroke color of box edges and lines. + */ + stroke: string; + /** + * Fill color of entity boxes + */ + fill: string; + /** + * Font size (expressed as an integer representing a number of pixels) + */ + fontSize?: number; } /** * This interface was referenced by `MermaidConfig`'s JSON-Schema @@ -767,6 +865,44 @@ export interface QuadrantChartConfig extends BaseDiagramConfig { */ quadrantExternalBorderStrokeWidth: number; } +/** + * This object contains configuration specific to XYCharts + * + * This interface was referenced by `MermaidConfig`'s JSON-Schema + * via the `definition` "XYChartConfig". + */ +export interface XYChartConfig extends BaseDiagramConfig { + /** + * width of the chart + */ + width: number; + /** + * height of the chart + */ + height: number; + /** + * Font size of the chart title + */ + titleFontSize: number; + /** + * Top and bottom space from the chart title + */ + titlePadding: number; + /** + * Should show the chart title + */ + showTitle: boolean; + xAxis: XYChartAxisConfig; + yAxis: XYChartAxisConfig; + /** + * How to plot will be drawn horizontal or vertical + */ + chartOrientation: 'vertical' | 'horizontal'; + /** + * Minimum percent of space plots of the chart will take + */ + plotReservedSpacePercent: number; +} /** * This object contains configuration for XYChart axis config * @@ -820,171 +956,73 @@ export interface XYChartAxisConfig { axisLineWidth: number; } /** - * This object contains configuration specific to XYCharts + * The object containing configurations specific for req diagrams * * This interface was referenced by `MermaidConfig`'s JSON-Schema - * via the `definition` "XYChartConfig". + * via the `definition` "RequirementDiagramConfig". */ -export interface XYChartConfig extends BaseDiagramConfig { +export interface RequirementDiagramConfig extends BaseDiagramConfig { + rect_fill?: string; + text_color?: string; + rect_border_size?: string; + rect_border_color?: string; + rect_min_width?: number; + rect_min_height?: number; + fontSize?: number; + rect_padding?: number; + line_height?: number; +} +/** + * The object containing configurations specific for mindmap diagrams + * + * This interface was referenced by `MermaidConfig`'s JSON-Schema + * via the `definition` "MindmapDiagramConfig". + */ +export interface MindmapDiagramConfig extends BaseDiagramConfig { + padding: number; + maxNodeWidth: number; +} +/** + * This interface was referenced by `MermaidConfig`'s JSON-Schema + * via the `definition` "GitGraphDiagramConfig". + */ +export interface GitGraphDiagramConfig extends BaseDiagramConfig { /** - * width of the chart - */ - width: number; - /** - * height of the chart - */ - height: number; - /** - * Font size of the chart title - */ - titleFontSize: number; - /** - * Top and bottom space from the chart title - */ - titlePadding: number; - /** - * Should show the chart title - */ - showTitle: boolean; - xAxis: XYChartAxisConfig; - yAxis: XYChartAxisConfig; - /** - * How to plot will be drawn horizontal or vertical - */ - chartOrientation: 'vertical' | 'horizontal'; - /** - * Minimum percent of space plots of the chart will take - */ - plotReservedSpacePercent: number; -} -/** - * The object containing configurations specific for entity relationship diagrams - * - * This interface was referenced by `MermaidConfig`'s JSON-Schema - * via the `definition` "ErDiagramConfig". - */ -export interface ErDiagramConfig extends BaseDiagramConfig { - /** - * Margin top for the text over the diagram + * Margin top for the text over the diagram */ titleTopMargin: number; + diagramPadding?: number; + nodeLabel?: NodeLabel; + mainBranchName?: string; + mainBranchOrder?: number; + showCommitLabel?: boolean; + showBranches?: boolean; + rotateCommitLabel?: boolean; + parallelCommits?: boolean; /** - * The amount of padding around the diagram as a whole so that embedded - * diagrams have margins, expressed in pixels. - * - */ - diagramPadding: number; - /** - * Directional bias for layout of entities - */ - layoutDirection: 'TB' | 'BT' | 'LR' | 'RL'; - /** - * The minimum width of an entity box. Expressed in pixels. - */ - minEntityWidth: number; - /** - * The minimum height of an entity box. Expressed in pixels. - */ - minEntityHeight: number; - /** - * The minimum internal padding between text in an entity box and the enclosing box borders. - * Expressed in pixels. + * Controls whether or arrow markers in html code are absolute paths or anchors. + * This matters if you are using base tag settings. * */ - entityPadding: number; - /** - * Stroke color of box edges and lines. - */ - stroke: string; - /** - * Fill color of entity boxes - */ - fill: string; - /** - * Font size (expressed as an integer representing a number of pixels) - */ - fontSize?: number; -} -/** - * The object containing configurations specific for entity relationship diagrams - * - * This interface was referenced by `MermaidConfig`'s JSON-Schema - * via the `definition` "StateDiagramConfig". - */ -export interface StateDiagramConfig extends BaseDiagramConfig { - /** - * Margin top for the text over the diagram - */ - titleTopMargin: number; arrowMarkerAbsolute?: boolean; - dividerMargin?: number; - sizeUnit?: number; - padding?: number; - textHeight?: number; - titleShift?: number; - noteMargin?: number; - forkWidth?: number; - forkHeight?: number; - miniPadding?: number; - /** - * Font size factor, this is used to guess the width of the edges labels - * before rendering by dagre layout. - * This might need updating if/when switching font - * - */ - fontSizeFactor?: number; - fontSize?: number; - labelHeight?: number; - edgeLengthFactor?: string; - compositTitleSize?: number; - radius?: number; - /** - * Decides which rendering engine that is to be used for the rendering. - * - */ - defaultRenderer: 'dagre-d3' | 'dagre-wrapper' | 'elk'; } /** * This interface was referenced by `MermaidConfig`'s JSON-Schema - * via the `definition` "ClassDiagramConfig". + * via the `definition` "NodeLabel". */ -export interface ClassDiagramConfig extends BaseDiagramConfig { - /** - * Margin top for the text over the diagram - */ - titleTopMargin: number; - /** - * Controls whether or arrow markers in html code are absolute paths or anchors. - * This matters if you are using base tag settings. - * - */ - arrowMarkerAbsolute?: boolean; - dividerMargin?: number; - padding?: number; - textHeight?: number; - /** - * Decides which rendering engine that is to be used for the rendering. - * - */ - defaultRenderer: 'dagre-d3' | 'dagre-wrapper' | 'elk'; - nodeSpacing?: number; - rankSpacing?: number; - /** - * The amount of padding around the diagram as a whole so that embedded - * diagrams have margins, expressed in pixels. - * - */ - diagramPadding?: number; - htmlLabels?: boolean; +export interface NodeLabel { + width?: number; + height?: number; + x?: number; + y?: number; } /** - * The object containing configurations specific for journey diagrams - * + * The object containing configurations specific for c4 diagrams * * This interface was referenced by `MermaidConfig`'s JSON-Schema - * via the `definition` "JourneyDiagramConfig". + * via the `definition` "C4DiagramConfig". */ -export interface JourneyDiagramConfig extends BaseDiagramConfig { +export interface C4DiagramConfig extends BaseDiagramConfig { /** * Margin to the right and left of the c4 diagram, must be a positive value. * @@ -996,447 +1034,368 @@ export interface JourneyDiagramConfig extends BaseDiagramConfig { */ diagramMarginY: number; /** - * Margin between actors + * Margin between shapes */ - leftMargin: number; + c4ShapeMargin: number; /** - * Width of actor boxes + * Padding between shapes + */ + c4ShapePadding: number; + /** + * Width of person boxes */ width: number; /** - * Height of actor boxes + * Height of person boxes */ height: number; /** - * Margin around loop boxes + * Margin around boxes */ boxMargin: number; /** - * Margin around the text in loop/alt/opt boxes - */ - boxTextMargin: number; - /** - * Margin around notes - */ - noteMargin: number; - /** - * Space between messages. - */ - messageMargin: number; - /** - * Multiline message alignment - */ - messageAlign: 'left' | 'center' | 'right'; - /** - * Prolongs the edge of the diagram downwards. - * - * Depending on css styling this might need adjustment. - * - */ - bottomMarginAdj: number; - /** - * Curved Arrows become Right Angles - * - * This will display arrows that start and begin at the same node as - * right angles, rather than as curves. - * - */ - rightAngles: boolean; - taskFontSize?: string | number; - taskFontFamily?: string; - taskMargin?: number; - /** - * Width of activation box - */ - activationWidth?: number; - /** - * text placement as: tspan | fo | old only text as before - * + * How many shapes to place in each row. */ - textPlacement?: string; - actorColours?: string[]; - sectionFills?: string[]; - sectionColours?: string[]; -} -/** - * This interface was referenced by `MermaidConfig`'s JSON-Schema - * via the `definition` "TimelineDiagramConfig". - */ -export interface TimelineDiagramConfig extends BaseDiagramConfig { + c4ShapeInRow: number; + nextLinePaddingX?: number; /** - * Margin to the right and left of the c4 diagram, must be a positive value. - * + * How many boundaries to place in each row. */ - diagramMarginX: number; + c4BoundaryInRow: number; /** - * Margin to the over and under the c4 diagram, must be a positive value. - * + * This sets the font size of Person shape for the diagram */ - diagramMarginY: number; + personFontSize?: string | number; /** - * Margin between actors + * This sets the font weight of Person shape for the diagram */ - leftMargin: number; + personFontFamily?: string; /** - * Width of actor boxes + * This sets the font weight of Person shape for the diagram */ - width: number; + personFontWeight?: string | number; /** - * Height of actor boxes + * This sets the font size of External Person shape for the diagram */ - height: number; - padding?: number; + external_personFontSize?: string | number; /** - * Margin around loop boxes + * This sets the font family of External Person shape for the diagram */ - boxMargin: number; + external_personFontFamily?: string; /** - * Margin around the text in loop/alt/opt boxes + * This sets the font weight of External Person shape for the diagram */ - boxTextMargin: number; + external_personFontWeight?: string | number; /** - * Margin around notes + * This sets the font size of System shape for the diagram */ - noteMargin: number; + systemFontSize?: string | number; /** - * Space between messages. + * This sets the font family of System shape for the diagram */ - messageMargin: number; + systemFontFamily?: string; /** - * Multiline message alignment + * This sets the font weight of System shape for the diagram */ - messageAlign: 'left' | 'center' | 'right'; + systemFontWeight?: string | number; /** - * Prolongs the edge of the diagram downwards. - * - * Depending on css styling this might need adjustment. - * + * This sets the font size of External System shape for the diagram */ - bottomMarginAdj: number; + external_systemFontSize?: string | number; /** - * Curved Arrows become Right Angles - * - * This will display arrows that start and begin at the same node as - * right angles, rather than as curves. - * + * This sets the font family of External System shape for the diagram */ - rightAngles?: boolean; - taskFontSize?: string | number; - taskFontFamily?: string; - taskMargin?: number; + external_systemFontFamily?: string; /** - * Width of activation box + * This sets the font weight of External System shape for the diagram */ - activationWidth?: number; + external_systemFontWeight?: string | number; /** - * text placement as: tspan | fo | old only text as before - * + * This sets the font size of System DB shape for the diagram */ - textPlacement?: string; - actorColours?: string[]; - sectionFills?: string[]; - sectionColours?: string[]; - disableMulticolor?: boolean; -} -/** - * The object containing configurations specific for gantt diagrams - * - * - * This interface was referenced by `MermaidConfig`'s JSON-Schema - * via the `definition` "GanttDiagramConfig". - */ -export interface GanttDiagramConfig extends BaseDiagramConfig { + system_dbFontSize?: string | number; /** - * Margin top for the text over the diagram + * This sets the font family of System DB shape for the diagram */ - titleTopMargin: number; + system_dbFontFamily?: string; /** - * The height of the bars in the graph + * This sets the font weight of System DB shape for the diagram */ - barHeight: number; + system_dbFontWeight?: string | number; /** - * The margin between the different activities in the gantt diagram + * This sets the font size of External System DB shape for the diagram */ - barGap?: number; + external_system_dbFontSize?: string | number; /** - * Margin between title and gantt diagram and between axis and gantt diagram. - * + * This sets the font family of External System DB shape for the diagram */ - topPadding: number; + external_system_dbFontFamily?: string; /** - * The space allocated for the section name to the right of the activities - * + * This sets the font weight of External System DB shape for the diagram */ - rightPadding: number; + external_system_dbFontWeight?: string | number; /** - * The space allocated for the section name to the left of the activities - * + * This sets the font size of System Queue shape for the diagram */ - leftPadding: number; + system_queueFontSize?: string | number; /** - * Vertical starting position of the grid lines + * This sets the font family of System Queue shape for the diagram */ - gridLineStartPadding: number; + system_queueFontFamily?: string; /** - * Font size + * This sets the font weight of System Queue shape for the diagram */ - fontSize: number; + system_queueFontWeight?: string | number; /** - * Font size for sections + * This sets the font size of External System Queue shape for the diagram */ - sectionFontSize: string | number; + external_system_queueFontSize?: string | number; /** - * The number of alternating section styles + * This sets the font family of External System Queue shape for the diagram */ - numberSectionStyles: number; + external_system_queueFontFamily?: string; /** - * Date/time format of the axis - * - * This might need adjustment to match your locale and preferences. - * + * This sets the font weight of External System Queue shape for the diagram */ - axisFormat: string; + external_system_queueFontWeight?: string | number; /** - * axis ticks - * - * Pattern is: - * - * ```javascript - * /^([1-9][0-9]*)(millisecond|second|minute|hour|day|week|month)$/ - * ``` - * + * This sets the font size of Boundary shape for the diagram */ - tickInterval?: string; + boundaryFontSize?: string | number; /** - * When this flag is set, date labels will be added to the top of the chart - * + * This sets the font family of Boundary shape for the diagram */ - topAxis: boolean; + boundaryFontFamily?: string; /** - * Controls the display mode. - * + * This sets the font weight of Boundary shape for the diagram */ - displayMode?: '' | 'compact'; + boundaryFontWeight?: string | number; /** - * On which day a week-based interval should start - * + * This sets the font size of Message shape for the diagram */ - weekday: 'monday' | 'tuesday' | 'wednesday' | 'thursday' | 'friday' | 'saturday' | 'sunday'; -} -/** - * The object containing configurations specific for sequence diagrams - * - * This interface was referenced by `MermaidConfig`'s JSON-Schema - * via the `definition` "SequenceDiagramConfig". - */ -export interface SequenceDiagramConfig extends BaseDiagramConfig { - arrowMarkerAbsolute?: boolean; - hideUnusedParticipants?: boolean; + messageFontSize?: string | number; /** - * Width of the activation rect + * This sets the font family of Message shape for the diagram */ - activationWidth: number; + messageFontFamily?: string; /** - * Margin to the right and left of the sequence diagram + * This sets the font weight of Message shape for the diagram */ - diagramMarginX: number; + messageFontWeight?: string | number; /** - * Margin to the over and under the sequence diagram + * This sets the font size of Container shape for the diagram */ - diagramMarginY: number; + containerFontSize?: string | number; /** - * Margin between actors + * This sets the font family of Container shape for the diagram */ - actorMargin: number; + containerFontFamily?: string; /** - * Width of actor boxes + * This sets the font weight of Container shape for the diagram */ - width: number; + containerFontWeight?: string | number; /** - * Height of actor boxes + * This sets the font size of External Container shape for the diagram */ - height: number; + external_containerFontSize?: string | number; /** - * Margin around loop boxes + * This sets the font family of External Container shape for the diagram */ - boxMargin: number; + external_containerFontFamily?: string; /** - * Margin around the text in loop/alt/opt boxes + * This sets the font weight of External Container shape for the diagram */ - boxTextMargin: number; + external_containerFontWeight?: string | number; /** - * Margin around notes + * This sets the font size of Container DB shape for the diagram */ - noteMargin: number; + container_dbFontSize?: string | number; /** - * Space between messages. + * This sets the font family of Container DB shape for the diagram */ - messageMargin: number; + container_dbFontFamily?: string; /** - * Multiline message alignment + * This sets the font weight of Container DB shape for the diagram */ - messageAlign: 'left' | 'center' | 'right'; + container_dbFontWeight?: string | number; /** - * Mirror actors under diagram - * + * This sets the font size of External Container DB shape for the diagram */ - mirrorActors: boolean; + external_container_dbFontSize?: string | number; /** - * forces actor popup menus to always be visible (to support E2E testing). - * + * This sets the font family of External Container DB shape for the diagram */ - forceMenus: boolean; + external_container_dbFontFamily?: string; /** - * Prolongs the edge of the diagram downwards. - * - * Depending on css styling this might need adjustment. - * + * This sets the font weight of External Container DB shape for the diagram */ - bottomMarginAdj: number; + external_container_dbFontWeight?: string | number; /** - * Curved Arrows become Right Angles - * - * This will display arrows that start and begin at the same node as - * right angles, rather than as curves. - * + * This sets the font size of Container Queue shape for the diagram */ - rightAngles: boolean; + container_queueFontSize?: string | number; /** - * This will show the node numbers + * This sets the font family of Container Queue shape for the diagram */ - showSequenceNumbers: boolean; + container_queueFontFamily?: string; /** - * This sets the font size of the actor's description + * This sets the font weight of Container Queue shape for the diagram */ - actorFontSize: string | number; + container_queueFontWeight?: string | number; /** - * This sets the font family of the actor's description + * This sets the font size of External Container Queue shape for the diagram */ - actorFontFamily: string; + external_container_queueFontSize?: string | number; /** - * This sets the font weight of the actor's description + * This sets the font family of External Container Queue shape for the diagram */ - actorFontWeight: string | number; + external_container_queueFontFamily?: string; /** - * This sets the font size of actor-attached notes + * This sets the font weight of External Container Queue shape for the diagram */ - noteFontSize: string | number; + external_container_queueFontWeight?: string | number; /** - * This sets the font family of actor-attached notes + * This sets the font size of Component shape for the diagram */ - noteFontFamily: string; + componentFontSize?: string | number; /** - * This sets the font weight of actor-attached notes + * This sets the font family of Component shape for the diagram */ - noteFontWeight: string | number; + componentFontFamily?: string; /** - * This sets the text alignment of actor-attached notes + * This sets the font weight of Component shape for the diagram */ - noteAlign: 'left' | 'center' | 'right'; + componentFontWeight?: string | number; /** - * This sets the font size of actor messages + * This sets the font size of External Component shape for the diagram */ - messageFontSize: string | number; + external_componentFontSize?: string | number; /** - * This sets the font family of actor messages + * This sets the font family of External Component shape for the diagram */ - messageFontFamily: string; + external_componentFontFamily?: string; /** - * This sets the font weight of actor messages + * This sets the font weight of External Component shape for the diagram */ - messageFontWeight: string | number; + external_componentFontWeight?: string | number; /** - * This sets the auto-wrap state for the diagram + * This sets the font size of Component DB shape for the diagram */ - wrap?: boolean; + component_dbFontSize?: string | number; /** - * This sets the auto-wrap padding for the diagram (sides only) + * This sets the font family of Component DB shape for the diagram */ - wrapPadding?: number; + component_dbFontFamily?: string; /** - * This sets the width of the loop-box (loop, alt, opt, par) + * This sets the font weight of Component DB shape for the diagram */ - labelBoxWidth?: number; + component_dbFontWeight?: string | number; /** - * This sets the height of the loop-box (loop, alt, opt, par) + * This sets the font size of External Component DB shape for the diagram */ - labelBoxHeight?: number; - messageFont?: FontCalculator; - noteFont?: FontCalculator; - actorFont?: FontCalculator; -} -/** - * The object containing configurations specific for flowcharts - * - * This interface was referenced by `MermaidConfig`'s JSON-Schema - * via the `definition` "FlowchartDiagramConfig". - */ -export interface FlowchartDiagramConfig extends BaseDiagramConfig { + external_component_dbFontSize?: string | number; /** - * Margin top for the text over the diagram + * This sets the font family of External Component DB shape for the diagram */ - titleTopMargin: number; + external_component_dbFontFamily?: string; /** - * Defines a top/bottom margin for subgraph titles - * + * This sets the font weight of External Component DB shape for the diagram */ - subGraphTitleMargin: { - top?: number; - bottom?: number; - }; - arrowMarkerAbsolute?: boolean; + external_component_dbFontWeight?: string | number; /** - * The amount of padding around the diagram as a whole so that embedded - * diagrams have margins, expressed in pixels. - * + * This sets the font size of Component Queue shape for the diagram */ - diagramPadding: number; + component_queueFontSize?: string | number; /** - * Flag for setting whether or not a html tag should be used for rendering labels on the edges. - * + * This sets the font family of Component Queue shape for the diagram */ - htmlLabels: boolean; + component_queueFontFamily?: string; /** - * Defines the spacing between nodes on the same level - * - * Pertains to horizontal spacing for TB (top to bottom) or BT (bottom to top) graphs, - * and the vertical spacing for LR as well as RL graphs. - * + * This sets the font weight of Component Queue shape for the diagram */ - nodeSpacing: number; + component_queueFontWeight?: string | number; /** - * Defines the spacing between nodes on different levels - * - * Pertains to horizontal spacing for TB (top to bottom) or BT (bottom to top) graphs, - * and the vertical spacing for LR as well as RL graphs. - * + * This sets the font size of External Component Queue shape for the diagram */ - rankSpacing: number; + external_component_queueFontSize?: string | number; /** - * Defines how mermaid renders curves for flowcharts. - * + * This sets the font family of External Component Queue shape for the diagram */ - curve: 'basis' | 'linear' | 'cardinal'; + external_component_queueFontFamily?: string; /** - * Represents the padding between the labels and the shape - * - * **Only used in new experimental rendering.** - * + * This sets the font weight of External Component Queue shape for the diagram */ - padding?: number; + external_component_queueFontWeight?: string | number; /** - * Decides which rendering engine that is to be used for the rendering. - * + * This sets the auto-wrap state for the diagram */ - defaultRenderer: 'dagre-d3' | 'dagre-wrapper' | 'elk'; + wrap?: boolean; /** - * Width of nodes where text is wrapped. - * - * When using markdown strings the text ius wrapped automatically, this - * value sets the max width of a text before it continues on a new line. - * + * This sets the auto-wrap padding for the diagram (sides only) */ - wrappingWidth: number; + wrapPadding?: number; + person_bg_color?: string; + person_border_color?: string; + external_person_bg_color?: string; + external_person_border_color?: string; + system_bg_color?: string; + system_border_color?: string; + system_db_bg_color?: string; + system_db_border_color?: string; + system_queue_bg_color?: string; + system_queue_border_color?: string; + external_system_bg_color?: string; + external_system_border_color?: string; + external_system_db_bg_color?: string; + external_system_db_border_color?: string; + external_system_queue_bg_color?: string; + external_system_queue_border_color?: string; + container_bg_color?: string; + container_border_color?: string; + container_db_bg_color?: string; + container_db_border_color?: string; + container_queue_bg_color?: string; + container_queue_border_color?: string; + external_container_bg_color?: string; + external_container_border_color?: string; + external_container_db_bg_color?: string; + external_container_db_border_color?: string; + external_container_queue_bg_color?: string; + external_container_queue_border_color?: string; + component_bg_color?: string; + component_border_color?: string; + component_db_bg_color?: string; + component_db_border_color?: string; + component_queue_bg_color?: string; + component_queue_border_color?: string; + external_component_bg_color?: string; + external_component_border_color?: string; + external_component_db_bg_color?: string; + external_component_db_border_color?: string; + external_component_queue_bg_color?: string; + external_component_queue_border_color?: string; + personFont?: FontCalculator; + external_personFont?: FontCalculator; + systemFont?: FontCalculator; + external_systemFont?: FontCalculator; + system_dbFont?: FontCalculator; + external_system_dbFont?: FontCalculator; + system_queueFont?: FontCalculator; + external_system_queueFont?: FontCalculator; + containerFont?: FontCalculator; + external_containerFont?: FontCalculator; + container_dbFont?: FontCalculator; + external_container_dbFont?: FontCalculator; + container_queueFont?: FontCalculator; + external_container_queueFont?: FontCalculator; + componentFont?: FontCalculator; + external_componentFont?: FontCalculator; + component_dbFont?: FontCalculator; + external_component_dbFont?: FontCalculator; + component_queueFont?: FontCalculator; + external_component_queueFont?: FontCalculator; + boundaryFont?: FontCalculator; + messageFont?: FontCalculator; } /** * The object containing configurations specific for sankey diagrams. @@ -1470,6 +1429,47 @@ export interface SankeyDiagramConfig extends BaseDiagramConfig { */ suffix?: string; } +/** + * The object containing configurations specific for packet diagrams. + * + * This interface was referenced by `MermaidConfig`'s JSON-Schema + * via the `definition` "PacketDiagramConfig". + */ +export interface PacketDiagramConfig extends BaseDiagramConfig { + /** + * The height of each row in the packet diagram. + */ + rowHeight?: number; + /** + * The width of each bit in the packet diagram. + */ + bitWidth?: number; + /** + * The number of bits to display per row. + */ + bitsPerRow?: number; + /** + * Toggle to display or hide bit numbers. + */ + showBits?: boolean; + /** + * The horizontal padding between the blocks in a row. + */ + paddingX?: number; + /** + * The vertical padding between the rows. + */ + paddingY?: number; +} +/** + * The object containing configurations specific for block diagrams. + * + * This interface was referenced by `MermaidConfig`'s JSON-Schema + * via the `definition` "BlockDiagramConfig". + */ +export interface BlockDiagramConfig extends BaseDiagramConfig { + padding?: number; +} /** * This interface was referenced by `MermaidConfig`'s JSON-Schema * via the `definition` "FontConfig".