diff --git a/.eslintrc.cjs b/.eslintrc.cjs index 342d15d9f..cae97e586 100644 --- a/.eslintrc.cjs +++ b/.eslintrc.cjs @@ -38,6 +38,10 @@ module.exports = { 'lodash', 'unicorn', ], + ignorePatterns: [ + // this file is automatically generated by `pnpm run --filter mermaid types:build-config` + 'packages/mermaid/src/config.type.ts', + ], rules: { curly: 'error', 'no-console': 'error', diff --git a/.github/codecov.yaml b/.github/codecov.yaml index 3db0811ad..950edb6a9 100644 --- a/.github/codecov.yaml +++ b/.github/codecov.yaml @@ -11,5 +11,7 @@ comment: coverage: status: project: - default: - threshold: 2% + off + # Turing off for now as code coverage isn't stable and causes unnecessary build failures. + # default: + # threshold: 2% diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index 63e20e575..6777a1e4f 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -47,7 +47,8 @@ jobs: VITEST_COVERAGE: true - name: Upload Coverage to Codecov uses: codecov/codecov-action@v3 - if: steps.cypress.conclusion == 'success' + # Run step only pushes to develop and pull_requests + if: ${{ steps.cypress.conclusion == 'success' && (github.event_name == 'pull_request' || github.ref == 'refs/heads/develop')}} with: files: coverage/cypress/lcov.info flags: e2e diff --git a/.github/workflows/lint.yml b/.github/workflows/lint.yml index 53b7f484d..493bacaf7 100644 --- a/.github/workflows/lint.yml +++ b/.github/workflows/lint.yml @@ -53,6 +53,19 @@ jobs: exit 1 fi + - name: Verify `./src/config.type.ts` is in sync with `./src/schemas/config.schema.yaml` + shell: bash + run: | + if ! pnpm run --filter mermaid types:verify-config; then + ERROR_MESSAGE='Running `pnpm run --filter mermaid types:verify-config` failed.' + ERROR_MESSAGE+=' This should be fixed by running' + ERROR_MESSAGE+=' `pnpm run --filter mermaid types:build-config`' + ERROR_MESSAGE+=' on your local machine.' + echo "::error title=Lint failure::${ERROR_MESSAGE}" + # make sure to return an error exitcode so that GitHub actions shows a red-cross + exit 1 + fi + - name: Verify Docs id: verifyDocs working-directory: ./packages/mermaid diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml index ba77d83bc..7c32795e8 100644 --- a/.github/workflows/test.yml +++ b/.github/workflows/test.yml @@ -43,6 +43,8 @@ jobs: - name: Upload Coverage to Codecov uses: codecov/codecov-action@v3 + # Run step only pushes to develop and pull_requests + if: ${{ github.event_name == 'pull_request' || github.ref == 'refs/heads/develop' }} with: files: ./coverage/vitest/lcov.info flags: unit diff --git a/.prettierignore b/.prettierignore index b50a94e84..8a9086315 100644 --- a/.prettierignore +++ b/.prettierignore @@ -5,5 +5,8 @@ coverage # Autogenerated by PNPM pnpm-lock.yaml stats -packages/mermaid/src/docs/.vitepress/components.d.ts +**/.vitepress/components.d.ts +**/.vitepress/cache .nyc_output +# Autogenerated by `pnpm run --filter mermaid types:build-config` +packages/mermaid/src/config.type.ts diff --git a/.vite/build.ts b/.vite/build.ts index 85c9b7fa0..b89df9e31 100644 --- a/.vite/build.ts +++ b/.vite/build.ts @@ -2,6 +2,7 @@ import { build, InlineConfig, type PluginOption } from 'vite'; import { resolve } from 'path'; import { fileURLToPath } from 'url'; import jisonPlugin from './jisonPlugin.js'; +import jsonSchemaPlugin from './jsonSchemaPlugin.js'; import { readFileSync } from 'fs'; import typescript from '@rollup/plugin-typescript'; import { visualizer } from 'rollup-plugin-visualizer'; @@ -121,6 +122,7 @@ export const getBuildConfig = ({ minify, core, watch, entryName }: BuildOptions) }, plugins: [ jisonPlugin(), + jsonSchemaPlugin(), // handles `.schema.yaml` files // @ts-expect-error According to the type definitions, rollup plugins are incompatible with vite typescript({ compilerOptions: { declaration: false } }), istanbul({ diff --git a/.vite/jsonSchemaPlugin.ts b/.vite/jsonSchemaPlugin.ts new file mode 100644 index 000000000..671a9612e --- /dev/null +++ b/.vite/jsonSchemaPlugin.ts @@ -0,0 +1,150 @@ +import { load, JSON_SCHEMA } from 'js-yaml'; +import assert from 'node:assert'; +import Ajv2019, { type JSONSchemaType } from 'ajv/dist/2019.js'; +import { PluginOption } from 'vite'; + +import type { MermaidConfig, BaseDiagramConfig } from '../packages/mermaid/src/config.type.js'; + +/** + * 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', + 'requirement', + 'mindmap', + 'timeline', + 'gitGraph', + 'c4', + 'sankey', +] as const; + +/** + * Generate default values from the JSON Schema. + * + * AJV does not support nested default values yet (or default values with $ref), + * so we need to manually find them (this may be fixed in ajv v9). + * + * @param mermaidConfigSchema - The Mermaid JSON Schema to use. + * @returns The default mermaid config object. + */ +function generateDefaults(mermaidConfigSchema: JSONSchemaType) { + const ajv = new Ajv2019({ + useDefaults: true, + allowUnionTypes: true, + strict: true, + }); + + ajv.addKeyword({ + keyword: 'meta:enum', // used by jsonschema2md + errors: false, + }); + ajv.addKeyword({ + keyword: 'tsType', // used by json-schema-to-typescript + errors: false, + }); + + // ajv currently doesn't support nested default values, see https://github.com/ajv-validator/ajv/issues/1718 + // (may be fixed in v9) so we need to manually use sub-schemas + const mermaidDefaultConfig = {}; + + assert.ok(mermaidConfigSchema.$defs); + const baseDiagramConfig = mermaidConfigSchema.$defs.BaseDiagramConfig; + + for (const key of MERMAID_CONFIG_DIAGRAM_KEYS) { + const subSchemaRef = mermaidConfigSchema.properties[key].$ref; + const [root, defs, defName] = subSchemaRef.split('/'); + assert.strictEqual(root, '#'); + assert.strictEqual(defs, '$defs'); + const subSchema = { + $schema: mermaidConfigSchema.$schema, + $defs: mermaidConfigSchema.$defs, + ...mermaidConfigSchema.$defs[defName], + } as JSONSchemaType; + + const validate = ajv.compile(subSchema); + + mermaidDefaultConfig[key] = {}; + + for (const required of subSchema.required ?? []) { + if (subSchema.properties[required] === undefined && baseDiagramConfig.properties[required]) { + mermaidDefaultConfig[key][required] = baseDiagramConfig.properties[required].default; + } + } + if (!validate(mermaidDefaultConfig[key])) { + throw new Error( + `schema for subconfig ${key} does not have valid defaults! Errors were ${JSON.stringify( + validate.errors, + undefined, + 2 + )}` + ); + } + } + + const validate = ajv.compile(mermaidConfigSchema); + + if (!validate(mermaidDefaultConfig)) { + throw new Error( + `Mermaid config JSON Schema does not have valid defaults! Errors were ${JSON.stringify( + validate.errors, + undefined, + 2 + )}` + ); + } + + return mermaidDefaultConfig; +} + +/** + * Vite plugin that handles JSON Schemas saved as a `.schema.yaml` file. + * + * Use `my-example.schema.yaml?only-defaults=true` to only load the default values. + */ +export default function jsonSchemaPlugin(): PluginOption { + return { + name: 'json-schema-plugin', + transform(src: string, id: string) { + const idAsUrl = new URL(id, 'file:///'); + + if (!idAsUrl.pathname.endsWith('schema.yaml')) { + return; + } + + if (idAsUrl.searchParams.get('only-defaults')) { + const jsonSchema = load(src, { + filename: idAsUrl.pathname, + // only allow JSON types in our YAML doc (will probably be default in YAML 1.3) + // e.g. `true` will be parsed a boolean `true`, `True` will be parsed as string `"True"`. + schema: JSON_SCHEMA, + }) as JSONSchemaType; + return { + code: `export default ${JSON.stringify(generateDefaults(jsonSchema), undefined, 2)};`, + map: null, // no source map + }; + } else { + return { + code: `export default ${JSON.stringify( + load(src, { + filename: idAsUrl.pathname, + // only allow JSON types in our YAML doc (will probably be default in YAML 1.3) + // e.g. `true` will be parsed a boolean `true`, `True` will be parsed as string `"True"`. + schema: JSON_SCHEMA, + }), + undefined, + 2 + )};`, + map: null, // provide source map if available + }; + } + }, + }; +} diff --git a/cSpell.json b/cSpell.json index 690c2bd33..abcfa0383 100644 --- a/cSpell.json +++ b/cSpell.json @@ -89,6 +89,8 @@ "mult", "neurodiverse", "nextra", + "nikolay", + "nirname", "orlandoni", "pathe", "pbrolin", @@ -102,9 +104,11 @@ "ranksep", "rect", "rects", + "reda", "redmine", "rehype", "roledescription", + "rozhkov", "sandboxed", "sankey", "setupgraphviewbox", @@ -121,6 +125,7 @@ "stylis", "subhash-halder", "substate", + "sulais", "sveidqvist", "swimm", "techn", @@ -144,6 +149,7 @@ "vueuse", "xlink", "yash", + "yokozuna", "zenuml" ], "patterns": [ diff --git a/docs/config/setup/modules/defaultConfig.md b/docs/config/setup/modules/defaultConfig.md index 793dfffae..a55ec1808 100644 --- a/docs/config/setup/modules/defaultConfig.md +++ b/docs/config/setup/modules/defaultConfig.md @@ -14,7 +14,7 @@ #### Defined in -[defaultConfig.ts:2300](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/defaultConfig.ts#L2300) +[defaultConfig.ts:266](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/defaultConfig.ts#L266) --- @@ -22,35 +22,12 @@ • `Const` **default**: `Partial`<`MermaidConfig`> -**Configuration methods in Mermaid version 8.6.0 have been updated, to learn more\[[click -here](8.6.0_docs.md)].** +Default mermaid configuration options. -## **What follows are config instructions for older versions** - -These are the default options which can be overridden with the initialization call like so: - -**Example 1:** - -```js -mermaid.initialize({ flowchart: { htmlLabels: false } }); -``` - -**Example 2:** - -```html - -``` - -A summary of all options and their defaults is found [here](#mermaidapi-configuration-defaults). -A description of each option follows below. +Please see the Mermaid config JSON Schema for the default JSON values. +Non-JSON JS default values are listed in this file, e.g. functions, or +`undefined` (explicitly set so that `configKeys` finds them). #### Defined in -[defaultConfig.ts:33](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/defaultConfig.ts#L33) +[defaultConfig.ts:16](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/defaultConfig.ts#L16) diff --git a/docs/news/announcements.md b/docs/news/announcements.md index 1837b33db..ff67c57d0 100644 --- a/docs/news/announcements.md +++ b/docs/news/announcements.md @@ -6,8 +6,8 @@ # Announcements -## [Sequence diagrams, the only good thing UML brought to software development](https://www.mermaidchart.com/blog/posts/sequence-diagrams-the-good-thing-uml-brought-to-software-development/) +## [Mermaid Chart’s ChatGPT Plugin Combines Generative AI and Smart Diagramming For Users](https://www.mermaidchart.com/blog/posts/mermaid-chart-chatgpt-plugin-combines-generative-ai-and-smart-diagramming) -15 June 2023 · 12 mins +29 June 2023 · 4 mins -Sequence diagrams really shine when you’re documenting different parts of a system and the various ways these parts interact with each other. +Mermaid Chart’s new ChatGPT plugin integrates AI-powered text prompts with Mermaid’s intuitive diagramming editor, enabling users to generate, edit, and share complex diagrams with ease and efficiency. diff --git a/docs/news/blog.md b/docs/news/blog.md index eb9ec6c47..6b187d406 100644 --- a/docs/news/blog.md +++ b/docs/news/blog.md @@ -6,6 +6,12 @@ # Blog +## [Mermaid Chart’s ChatGPT Plugin Combines Generative AI and Smart Diagramming For Users](https://www.mermaidchart.com/blog/posts/mermaid-chart-chatgpt-plugin-combines-generative-ai-and-smart-diagramming) + +29 June 2023 · 4 mins + +Mermaid Chart’s new ChatGPT plugin integrates AI-powered text prompts with Mermaid’s intuitive diagramming editor, enabling users to generate, edit, and share complex diagrams with ease and efficiency. + ## [Sequence diagrams, the only good thing UML brought to software development](https://www.mermaidchart.com/blog/posts/sequence-diagrams-the-good-thing-uml-brought-to-software-development/) 15 June 2023 · 12 mins diff --git a/docs/syntax/flowchart.md b/docs/syntax/flowchart.md index a47061025..92678fb6e 100644 --- a/docs/syntax/flowchart.md +++ b/docs/syntax/flowchart.md @@ -991,6 +991,24 @@ flowchart LR classDef someclass fill:#f96 ``` +This form can be used when declaring multiple links between nodes: + +```mermaid-example +flowchart LR + A:::foo & B:::bar --> C:::foobar + classDef foo stroke:#f00 + classDef bar stroke:#0f0 + classDef foobar stroke:#00f +``` + +```mermaid +flowchart LR + A:::foo & B:::bar --> C:::foobar + classDef foo stroke:#f00 + classDef bar stroke:#0f0 + classDef foobar stroke:#00f +``` + ### Css classes It is also possible to predefine classes in css styles that can be applied from the graph definition as in the example diff --git a/package.json b/package.json index 738d1796a..e21e02d14 100644 --- a/package.json +++ b/package.json @@ -81,6 +81,7 @@ "@vitest/coverage-v8": "^0.32.2", "@vitest/spy": "^0.32.2", "@vitest/ui": "^0.32.2", + "ajv": "^8.12.0", "concurrently": "^8.0.1", "cors": "^2.8.5", "coveralls": "^3.1.1", diff --git a/packages/mermaid-example-diagram/src/exampleDiagramDb.js b/packages/mermaid-example-diagram/src/exampleDiagramDb.js index a5fa88e6d..21ba9e248 100644 --- a/packages/mermaid-example-diagram/src/exampleDiagramDb.js +++ b/packages/mermaid-example-diagram/src/exampleDiagramDb.js @@ -22,7 +22,6 @@ export const setInfo = (inf) => { info = inf; }; -/** @returns Returns the info flag */ export const getInfo = () => { return info; }; diff --git a/packages/mermaid-example-diagram/src/exampleDiagramRenderer.js b/packages/mermaid-example-diagram/src/exampleDiagramRenderer.js index 2c6839203..9b3854aaf 100644 --- a/packages/mermaid-example-diagram/src/exampleDiagramRenderer.js +++ b/packages/mermaid-example-diagram/src/exampleDiagramRenderer.js @@ -8,7 +8,6 @@ import { log, getConfig, setupGraphViewbox } from './mermaidUtils.js'; * @param {any} text * @param {any} id * @param {any} version - * @param diagObj */ export const draw = (text, id, version) => { try { diff --git a/packages/mermaid-example-diagram/src/mermaidUtils.ts b/packages/mermaid-example-diagram/src/mermaidUtils.ts index 44cc85f73..eeeca05c5 100644 --- a/packages/mermaid-example-diagram/src/mermaidUtils.ts +++ b/packages/mermaid-example-diagram/src/mermaidUtils.ts @@ -1,3 +1,4 @@ +/* eslint-disable @typescript-eslint/no-explicit-any */ const warning = (s: string) => { // Todo remove debug code // eslint-disable-next-line no-console @@ -28,7 +29,6 @@ export let setLogLevel: (level: keyof typeof LEVELS | number | string) => void; export let getConfig: () => object; export let sanitizeText: (str: string) => string; export let commonDb: () => object; -// eslint-disable @typescript-eslint/no-explicit-any export let setupGraphViewbox: ( graph: any, svgElem: any, diff --git a/packages/mermaid/.lintstagedrc.mjs b/packages/mermaid/.lintstagedrc.mjs index fe79ad254..955000e20 100644 --- a/packages/mermaid/.lintstagedrc.mjs +++ b/packages/mermaid/.lintstagedrc.mjs @@ -4,4 +4,5 @@ export default { 'src/docs/**': ['pnpm --filter mermaid run docs:build --git'], 'src/docs.mts': ['pnpm --filter mermaid run docs:build --git'], 'src/(defaultConfig|config|mermaidAPI).ts': ['pnpm --filter mermaid run docs:build --git'], + 'src/schemas/config.schema.yaml': ['pnpm --filter mermaid run types:build-config --git'], }; diff --git a/packages/mermaid/package.json b/packages/mermaid/package.json index c73275a6f..afbbed2e6 100644 --- a/packages/mermaid/package.json +++ b/packages/mermaid/package.json @@ -27,11 +27,14 @@ "docs:code": "typedoc src/defaultConfig.ts src/config.ts src/mermaidAPI.ts && prettier --write ./src/docs/config/setup", "docs:build": "rimraf ../../docs && pnpm docs:spellcheck && pnpm docs:code && ts-node-esm src/docs.mts", "docs:verify": "pnpm docs:spellcheck && pnpm docs:code && ts-node-esm src/docs.mts --verify", - "docs:pre:vitepress": "rimraf src/vitepress && pnpm docs:code && ts-node-esm src/docs.mts --vitepress && pnpm --filter ./src/vitepress install --no-frozen-lockfile --ignore-scripts ", + "docs:pre:vitepress": "pnpm --filter ./src/docs prefetch && rimraf src/vitepress && pnpm docs:code && ts-node-esm src/docs.mts --vitepress && pnpm --filter ./src/vitepress install --no-frozen-lockfile --ignore-scripts", "docs:build:vitepress": "pnpm docs:pre:vitepress && (cd src/vitepress && pnpm run build) && cpy --flat src/docs/landing/ ./src/vitepress/.vitepress/dist/landing", "docs:dev": "pnpm docs:pre:vitepress && concurrently \"pnpm --filter ./src/vitepress dev\" \"ts-node-esm src/docs.mts --watch --vitepress\"", + "docs:dev:docker": "pnpm docs:pre:vitepress && concurrently \"pnpm --filter ./src/vitepress dev:docker\" \"ts-node-esm src/docs.mts --watch --vitepress\"", "docs:serve": "pnpm docs:build:vitepress && vitepress serve src/vitepress", "docs:spellcheck": "cspell --config ../../cSpell.json \"src/docs/**/*.md\"", + "types:build-config": "ts-node-esm --transpileOnly scripts/create-types-from-json-schema.mts", + "types:verify-config": "ts-node-esm scripts/create-types-from-json-schema.mts --verify", "release": "pnpm build", "prepublishOnly": "cpy '../../README.*' ./ --cwd=. && pnpm -w run build" }, @@ -74,6 +77,7 @@ "web-worker": "^1.2.0" }, "devDependencies": { + "@adobe/jsonschema2md": "^7.1.4", "@types/cytoscape": "^3.19.9", "@types/d3": "^7.4.0", "@types/d3-sankey": "^0.12.1", @@ -87,6 +91,7 @@ "@types/uuid": "^9.0.1", "@typescript-eslint/eslint-plugin": "^5.59.0", "@typescript-eslint/parser": "^5.59.0", + "ajv": "^8.11.2", "chokidar": "^3.5.3", "concurrently": "^8.0.1", "coveralls": "^3.1.1", @@ -97,6 +102,7 @@ "jison": "^0.4.18", "js-base64": "^3.7.5", "jsdom": "^22.0.0", + "json-schema-to-typescript": "^11.0.3", "micromatch": "^4.0.5", "path-browserify": "^1.0.1", "prettier": "^2.8.8", @@ -109,6 +115,7 @@ "typedoc-plugin-markdown": "^3.15.2", "typescript": "^5.0.4", "unist-util-flatmap": "^1.0.0", + "unist-util-visit": "^4.1.2", "vitepress": "^1.0.0-alpha.72", "vitepress-plugin-search": "^1.0.4-alpha.20" }, diff --git a/packages/mermaid/scripts/create-types-from-json-schema.mts b/packages/mermaid/scripts/create-types-from-json-schema.mts new file mode 100644 index 000000000..e81ea70ff --- /dev/null +++ b/packages/mermaid/scripts/create-types-from-json-schema.mts @@ -0,0 +1,252 @@ +/** + * Script to load Mermaid Config JSON Schema from YAML and to: + * + * - Validate JSON Schema + * + * Then to generate: + * + * - config.types.ts TypeScript file + */ + +/* eslint-disable no-console */ + +import { readFile, writeFile } from 'node:fs/promises'; +import { join } from 'node:path'; +import assert from 'node:assert'; +import { execFile } from 'node:child_process'; +import { promisify } from 'node:util'; + +import { load, JSON_SCHEMA } from 'js-yaml'; +import { compile, type JSONSchema } from 'json-schema-to-typescript'; + +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; + +// !!! -- The config.type.js file is created by this script -- !!! +import type { MermaidConfig } from '../src/config.type.js'; + +// options for running the main command +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', + 'requirement', + 'mindmap', + 'timeline', + 'gitGraph', + 'c4', + 'sankey', +]; + +/** + * Loads the MermaidConfig JSON schema YAML file. + * + * @returns The loaded JSON Schema, use {@link validateSchema} to confirm it is a valid JSON Schema. + */ +async function loadJsonSchemaFromYaml() { + const configSchemaFile = join('src', 'schemas', 'config.schema.yaml'); + const contentsYaml = await readFile(configSchemaFile, { encoding: 'utf8' }); + const jsonSchema = load(contentsYaml, { + filename: configSchemaFile, + // only allow JSON types in our YAML doc (will probably be default in YAML 1.3) + // e.g. `true` will be parsed a boolean `true`, `True` will be parsed as string `"True"`. + schema: JSON_SCHEMA, + }); + return jsonSchema; +} + +/** + * Asserts that the given value is a valid JSON Schema object. + * + * @param jsonSchema - The value to validate as JSON Schema 2019-09 + * @throws {Error} if the given object is invalid. + */ +function validateSchema(jsonSchema: unknown): asserts jsonSchema is JSONSchemaType { + if (typeof jsonSchema !== 'object') { + throw new Error(`jsonSchema param is not an object: actual type is ${typeof jsonSchema}`); + } + if (jsonSchema === null) { + throw new Error('jsonSchema param must not be null'); + } + const ajv = new Ajv2019({ + allErrors: true, + allowUnionTypes: true, + strict: true, + }); + + ajv.addKeyword({ + keyword: 'meta:enum', // used by jsonschema2md (in docs.mts script) + errors: false, + }); + ajv.addKeyword({ + keyword: 'tsType', // used by json-schema-to-typescript + errors: false, + }); + + ajv.compile(jsonSchema); +} + +/** + * Generate a typescript definition from a JSON Schema using json-schema-to-typescript. + * + * @param mermaidConfigSchema - The input JSON Schema. + */ +async function generateTypescript(mermaidConfigSchema: JSONSchemaType) { + /** + * Replace all usages of `allOf` with `extends`. + * + * `extends` is only valid JSON Schema in very old versions of JSON Schema. + * However, json-schema-to-typescript creates much nicer types when using + * `extends`, so we should use them instead when possible. + * + * @param schema - The input schema. + * @returns The schema with `allOf` replaced with `extends`. + */ + function replaceAllOfWithExtends(schema: JSONSchemaType>) { + if (schema['allOf']) { + const { allOf, ...schemaWithoutAllOf } = schema; + return { + ...schemaWithoutAllOf, + extends: allOf, + }; + } + return schema; + } + + /** + * For backwards compatibility with older Mermaid Typescript defs, + * we need to make all value optional instead of required. + * + * This is because the `MermaidConfig` type is used as an input, and everything is optional, + * since all the required values have default values.s + * + * In the future, we should make make the input to Mermaid `Partial`. + * + * @todo TODO: Remove this function when Mermaid releases a new breaking change. + * @param schema - The input schema. + * @returns The schema with all required values removed. + */ + function removeRequired(schema: JSONSchemaType>) { + return { ...schema, required: [] }; + } + + /** + * This is a temporary hack to control the order the types are generated in. + * + * By default, json-schema-to-typescript outputs the $defs in the order they + * are used, then any unused schemas at the end. + * + * **The only purpose of this function is to make the `git diff` simpler** + * **We should remove this later to simplify the code** + * + * @todo TODO: Remove this function in a future PR. + * @param schema - The input schema. + * @returns The schema with all `$ref`s removed. + */ + function unrefSubschemas(schema: 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(removeRequired(mermaidConfigSchema)), + + $defs: Object.fromEntries( + Object.entries(mermaidConfigSchema.$defs).map(([key, subSchema]) => { + return [key, removeRequired(replaceAllOfWithExtends(subSchema))]; + }) + ), + }; + + const typescriptFile = await compile( + modifiedSchema as JSONSchema, // json-schema-to-typescript only allows JSON Schema 4 as input type + 'MermaidConfig', + { + additionalProperties: false, // in JSON Schema 2019-09, these are called `unevaluatedProperties` + unreachableDefinitions: true, // definition for FontConfig is unreachable + } + ); + + // TODO, should we somehow use the functions from `docs.mts` instead? + if (verifyOnly) { + const originalFile = await readFile('./src/config.type.ts', { encoding: 'utf-8' }); + if (typescriptFile !== originalFile) { + console.error('❌ Error: ./src/config.type.ts will be changed.'); + console.error("Please run 'pnpm run --filter mermaid types:build-config' to update this"); + process.exitCode = 1; + } else { + console.log('✅ ./src/config.type.ts will be unchanged'); + } + } else { + console.log('Writing typescript file to ./src/config.type.ts'); + await writeFile('./src/config.type.ts', typescriptFile, { encoding: 'utf8' }); + if (git) { + console.log('📧 Git: Adding ./src/config.type.ts changed'); + await promisify(execFile)('git', ['add', './src/config.type.ts']); + } + } +} + +/** Main function */ +async function main() { + if (verifyOnly) { + console.log( + 'Verifying that ./src/config.type.ts is in sync with src/schemas/config.schema.yaml' + ); + } + + const configJsonSchema = await loadJsonSchemaFromYaml(); + + validateSchema(configJsonSchema); + + // Generate types from JSON Schema + await generateTypescript(configJsonSchema); +} + +main().catch((error) => { + console.error(error); + process.exitCode = 1; +}); diff --git a/packages/mermaid/src/config.spec.js b/packages/mermaid/src/config.spec.js deleted file mode 100644 index 1f7fd976b..000000000 --- a/packages/mermaid/src/config.spec.js +++ /dev/null @@ -1,56 +0,0 @@ -import * as configApi from './config.js'; - -describe('when working with site config', function () { - beforeEach(() => { - // Resets the site config to default config - configApi.setSiteConfig({}); - }); - it('should set site config and config properly', function () { - let config_0 = { foo: 'bar', bar: 0 }; - configApi.setSiteConfig(config_0); - let config_1 = configApi.getSiteConfig(); - let config_2 = configApi.getConfig(); - expect(config_1.foo).toEqual(config_0.foo); - expect(config_1.bar).toEqual(config_0.bar); - expect(config_1).toEqual(config_2); - }); - it('should respect secure keys when applying directives', function () { - let config_0 = { - foo: 'bar', - bar: 'cant-be-changed', - secure: [...configApi.defaultConfig.secure, 'bar'], - }; - configApi.setSiteConfig(config_0); - const directive = { foo: 'baf', bar: 'should-not-be-allowed' }; - const cfg = configApi.updateCurrentConfig(config_0, [directive]); - expect(cfg.foo).toEqual(directive.foo); - expect(cfg.bar).toBe(config_0.bar); - }); - it('should set reset config properly', function () { - let config_0 = { foo: 'bar', bar: 0 }; - configApi.setSiteConfig(config_0); - let config_1 = { foo: 'baf' }; - configApi.setConfig(config_1); - let config_2 = configApi.getConfig(); - expect(config_2.foo).toEqual(config_1.foo); - configApi.reset(); - let config_3 = configApi.getConfig(); - expect(config_3.foo).toEqual(config_0.foo); - let config_4 = configApi.getSiteConfig(); - expect(config_4.foo).toEqual(config_0.foo); - }); - it('should set global reset config properly', function () { - let config_0 = { foo: 'bar', bar: 0 }; - configApi.setSiteConfig(config_0); - let config_1 = configApi.getSiteConfig(); - expect(config_1.foo).toEqual(config_0.foo); - let config_2 = configApi.getConfig(); - expect(config_2.foo).toEqual(config_0.foo); - configApi.setConfig({ foobar: 'bar0' }); - let config_3 = configApi.getConfig(); - expect(config_3.foobar).toEqual('bar0'); - configApi.reset(); - let config_4 = configApi.getConfig(); - expect(config_4.foobar).toBeUndefined(); - }); -}); diff --git a/packages/mermaid/src/config.spec.ts b/packages/mermaid/src/config.spec.ts new file mode 100644 index 000000000..457cb8244 --- /dev/null +++ b/packages/mermaid/src/config.spec.ts @@ -0,0 +1,72 @@ +import * as configApi from './config.js'; + +describe('when working with site config', function () { + beforeEach(() => { + // Resets the site config to default config + configApi.setSiteConfig({}); + }); + it('should set site config and config properly', function () { + const config_0 = { fontFamily: 'foo-font', fontSize: 150 }; + configApi.setSiteConfig(config_0); + const config_1 = configApi.getSiteConfig(); + const config_2 = configApi.getConfig(); + expect(config_1.fontFamily).toEqual(config_0.fontFamily); + expect(config_1.fontSize).toEqual(config_0.fontSize); + expect(config_1).toEqual(config_2); + }); + it('should respect secure keys when applying directives', function () { + const config_0 = { + fontFamily: 'foo-font', + fontSize: 12345, // can't be changed + secure: [...configApi.defaultConfig.secure!, 'fontSize'], + }; + configApi.setSiteConfig(config_0); + const directive = { fontFamily: 'baf', fontSize: 54321 /* fontSize shouldn't be changed */ }; + const cfg = configApi.updateCurrentConfig(config_0, [directive]); + expect(cfg.fontFamily).toEqual(directive.fontFamily); + expect(cfg.fontSize).toBe(config_0.fontSize); + }); + it('should allow setting partial options', function () { + const defaultConfig = configApi.getConfig(); + + configApi.setConfig({ + quadrantChart: { + chartHeight: 600, + }, + }); + + const updatedConfig = configApi.getConfig(); + + // deep options we didn't update should remain the same + expect(defaultConfig.quadrantChart!.chartWidth).toEqual( + updatedConfig.quadrantChart!.chartWidth + ); + }); + it('should set reset config properly', function () { + const config_0 = { fontFamily: 'foo-font', fontSize: 150 }; + configApi.setSiteConfig(config_0); + const config_1 = { fontFamily: 'baf' }; + configApi.setConfig(config_1); + const config_2 = configApi.getConfig(); + expect(config_2.fontFamily).toEqual(config_1.fontFamily); + configApi.reset(); + const config_3 = configApi.getConfig(); + expect(config_3.fontFamily).toEqual(config_0.fontFamily); + const config_4 = configApi.getSiteConfig(); + expect(config_4.fontFamily).toEqual(config_0.fontFamily); + }); + it('should set global reset config properly', function () { + const config_0 = { fontFamily: 'foo-font', fontSize: 150 }; + configApi.setSiteConfig(config_0); + const config_1 = configApi.getSiteConfig(); + expect(config_1.fontFamily).toEqual(config_0.fontFamily); + const config_2 = configApi.getConfig(); + expect(config_2.fontFamily).toEqual(config_0.fontFamily); + configApi.setConfig({ altFontFamily: 'bar-font' }); + const config_3 = configApi.getConfig(); + expect(config_3.altFontFamily).toEqual('bar-font'); + configApi.reset(); + const config_4 = configApi.getConfig(); + expect(config_4.altFontFamily).toBeUndefined(); + }); +}); diff --git a/packages/mermaid/src/config.type.ts b/packages/mermaid/src/config.type.ts index 138eee44f..352181c86 100644 --- a/packages/mermaid/src/config.type.ts +++ b/packages/mermaid/src/config.type.ts @@ -1,22 +1,144 @@ -// TODO: This was auto generated from defaultConfig. Needs to be verified. +/* eslint-disable */ +/** + * This file was automatically generated by json-schema-to-typescript. + * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file, + * and run json-schema-to-typescript to regenerate this file. + */ -import DOMPurify from 'dompurify'; +/** + * Configuration options to pass to the `dompurify` library. + */ +export type DOMPurifyConfiguration = import("dompurify").Config; +/** + * JavaScript function that returns a `FontConfig`. + * + * By default, these return the appropriate `*FontSize`, `*FontFamily`, `*FontWeight` + * values. + * + * For example, the font calculator called `boundaryFont` might be defined as: + * + * ```javascript + * boundaryFont: function () { + * return { + * fontFamily: this.boundaryFontFamily, + * fontSize: this.boundaryFontSize, + * fontWeight: this.boundaryFontWeight, + * }; + * } + * ``` + * + * + * This interface was referenced by `MermaidConfig`'s JSON-Schema + * via the `definition` "FontCalculator". + */ +export type FontCalculator = () => Partial; +/** + * Picks the color of the sankey diagram links, using the colors of the source and/or target of the links. + * + * + * This interface was referenced by `MermaidConfig`'s JSON-Schema + * via the `definition` "SankeyLinkColor". + */ +export type SankeyLinkColor = "source" | "target" | "gradient"; +/** + * Controls the alignment of the Sankey diagrams. + * + * See . + * + * + * This interface was referenced by `MermaidConfig`'s JSON-Schema + * via the `definition` "SankeyNodeAlignment". + */ +export type SankeyNodeAlignment = "left" | "right" | "center" | "justify"; +/** + * The font size to use + */ +export type CSSFontSize = string | number; export interface MermaidConfig { - theme?: string; + /** + * Theme, the CSS style sheet. + * You may also use `themeCSS` to override this value. + * + */ + theme?: string | "default" | "forest" | "dark" | "neutral" | "null"; themeVariables?: any; themeCSS?: string; + /** + * The maximum allowed size of the users text diagram + */ maxTextSize?: number; darkMode?: boolean; htmlLabels?: boolean; + /** + * Specifies the font to be used in the rendered diagrams. + * Can be any possible CSS `font-family`. + * See https://developer.mozilla.org/en-US/docs/Web/CSS/font-family + * + */ fontFamily?: string; altFontFamily?: string; - logLevel?: number; - securityLevel?: string; + /** + * This option decides the amount of logging to be used by mermaid. + * + */ + logLevel?: + | number + | string + | 0 + | 2 + | 1 + | "trace" + | "debug" + | "info" + | "warn" + | "error" + | "fatal" + | 3 + | 4 + | 5 + | undefined; + /** + * Level of trust for parsed diagram + */ + securityLevel?: string | "strict" | "loose" | "antiscript" | "sandbox" | undefined; + /** + * Dictates whether mermaid starts on Page load + */ startOnLoad?: boolean; + /** + * Controls whether or arrow markers in html code are absolute paths or anchors. + * This matters if you are using base tag settings. + * + */ arrowMarkerAbsolute?: boolean; + /** + * This option controls which `currentConfig` keys are considered secure and + * can only be changed via call to `mermaidAPI.initialize`. + * Calls to `mermaidAPI.reinitialize` cannot make changes to the secure keys + * in the current `currentConfig`. + * + * This prevents malicious graph directives from overriding a site's default security. + * + */ secure?: string[]; + /** + * This option controls if the generated ids of nodes in the SVG are + * generated randomly or based on a seed. + * If set to `false`, the IDs are generated based on the current date and + * thus are not deterministic. This is the default behavior. + * + * This matters if your files are checked into source control e.g. git and + * should not change unless content is changed. + * + */ deterministicIds?: boolean; + /** + * This option is the optional seed for deterministic ids. + * If set to `undefined` but deterministicIds is `true`, a simple number iterator is used. + * You can set this attribute to base the seed on a static string. + * + */ deterministicIDSeed?: string; flowchart?: FlowchartDiagramConfig; sequence?: SequenceDiagramConfig; @@ -33,95 +155,341 @@ export interface MermaidConfig { gitGraph?: GitGraphDiagramConfig; c4?: C4DiagramConfig; sankey?: SankeyDiagramConfig; - dompurifyConfig?: DOMPurify.Config; + dompurifyConfig?: DOMPurifyConfiguration; wrap?: boolean; fontSize?: number; } - -// TODO: More configs needs to be moved in here +/** + * This interface was referenced by `MermaidConfig`'s JSON-Schema + * via the `definition` "BaseDiagramConfig". + */ export interface BaseDiagramConfig { useWidth?: number; + /** + * When this flag is set to `true`, the height and width is set to 100% + * and is then scaled with the available space. + * If set to `false`, the absolute space required is used. + * + */ useMaxWidth?: boolean; } - +/** + * The object containing configurations specific for c4 diagrams + * + * This interface was referenced by `MermaidConfig`'s JSON-Schema + * via the `definition` "C4DiagramConfig". + */ export interface C4DiagramConfig extends BaseDiagramConfig { + /** + * Margin to the right and left of the c4 diagram, must be a positive value. + * + */ diagramMarginX?: number; + /** + * Margin to the over and under the c4 diagram, must be a positive value. + * + */ diagramMarginY?: number; + /** + * Margin between shapes + */ c4ShapeMargin?: number; + /** + * Padding between shapes + */ c4ShapePadding?: number; + /** + * Width of person boxes + */ width?: number; + /** + * Height of person boxes + */ height?: number; + /** + * Margin around boxes + */ boxMargin?: number; + /** + * How many shapes to place in each row. + */ c4ShapeInRow?: number; nextLinePaddingX?: number; + /** + * How many boundaries to place in each row. + */ c4BoundaryInRow?: number; + /** + * This sets the font size of Person shape for the diagram + */ personFontSize?: string | number; + /** + * This sets the font weight of Person shape for the diagram + */ personFontFamily?: string; + /** + * This sets the font weight of Person shape for the diagram + */ personFontWeight?: string | number; + /** + * This sets the font size of External Person shape for the diagram + */ external_personFontSize?: string | number; + /** + * This sets the font family of External Person shape for the diagram + */ external_personFontFamily?: string; + /** + * This sets the font weight of External Person shape for the diagram + */ external_personFontWeight?: string | number; + /** + * This sets the font size of System shape for the diagram + */ systemFontSize?: string | number; + /** + * This sets the font family of System shape for the diagram + */ systemFontFamily?: string; + /** + * This sets the font weight of System shape for the diagram + */ systemFontWeight?: string | number; + /** + * This sets the font size of External System shape for the diagram + */ external_systemFontSize?: string | number; + /** + * This sets the font family of External System shape for the diagram + */ external_systemFontFamily?: string; + /** + * This sets the font weight of External System shape for the diagram + */ external_systemFontWeight?: string | number; + /** + * This sets the font size of System DB shape for the diagram + */ system_dbFontSize?: string | number; + /** + * This sets the font family of System DB shape for the diagram + */ system_dbFontFamily?: string; + /** + * This sets the font weight of System DB shape for the diagram + */ system_dbFontWeight?: string | number; + /** + * This sets the font size of External System DB shape for the diagram + */ external_system_dbFontSize?: string | number; + /** + * This sets the font family of External System DB shape for the diagram + */ external_system_dbFontFamily?: string; + /** + * This sets the font weight of External System DB shape for the diagram + */ external_system_dbFontWeight?: string | number; + /** + * This sets the font size of System Queue shape for the diagram + */ system_queueFontSize?: string | number; + /** + * This sets the font family of System Queue shape for the diagram + */ system_queueFontFamily?: string; + /** + * This sets the font weight of System Queue shape for the diagram + */ system_queueFontWeight?: string | number; + /** + * This sets the font size of External System Queue shape for the diagram + */ external_system_queueFontSize?: string | number; + /** + * This sets the font family of External System Queue shape for the diagram + */ external_system_queueFontFamily?: string; + /** + * This sets the font weight of External System Queue shape for the diagram + */ external_system_queueFontWeight?: string | number; + /** + * This sets the font size of Boundary shape for the diagram + */ boundaryFontSize?: string | number; + /** + * This sets the font family of Boundary shape for the diagram + */ boundaryFontFamily?: string; + /** + * This sets the font weight of Boundary shape for the diagram + */ boundaryFontWeight?: string | number; + /** + * This sets the font size of Message shape for the diagram + */ messageFontSize?: string | number; + /** + * This sets the font family of Message shape for the diagram + */ messageFontFamily?: string; + /** + * This sets the font weight of Message shape for the diagram + */ messageFontWeight?: string | number; + /** + * This sets the font size of Container shape for the diagram + */ containerFontSize?: string | number; + /** + * This sets the font family of Container shape for the diagram + */ containerFontFamily?: string; + /** + * This sets the font weight of Container shape for the diagram + */ containerFontWeight?: string | number; + /** + * This sets the font size of External Container shape for the diagram + */ external_containerFontSize?: string | number; + /** + * This sets the font family of External Container shape for the diagram + */ external_containerFontFamily?: string; + /** + * This sets the font weight of External Container shape for the diagram + */ external_containerFontWeight?: string | number; + /** + * This sets the font size of Container DB shape for the diagram + */ container_dbFontSize?: string | number; + /** + * This sets the font family of Container DB shape for the diagram + */ container_dbFontFamily?: string; + /** + * This sets the font weight of Container DB shape for the diagram + */ container_dbFontWeight?: string | number; + /** + * This sets the font size of External Container DB shape for the diagram + */ external_container_dbFontSize?: string | number; + /** + * This sets the font family of External Container DB shape for the diagram + */ external_container_dbFontFamily?: string; + /** + * This sets the font weight of External Container DB shape for the diagram + */ external_container_dbFontWeight?: string | number; + /** + * This sets the font size of Container Queue shape for the diagram + */ container_queueFontSize?: string | number; + /** + * This sets the font family of Container Queue shape for the diagram + */ container_queueFontFamily?: string; + /** + * This sets the font weight of Container Queue shape for the diagram + */ container_queueFontWeight?: string | number; + /** + * This sets the font size of External Container Queue shape for the diagram + */ external_container_queueFontSize?: string | number; + /** + * This sets the font family of External Container Queue shape for the diagram + */ external_container_queueFontFamily?: string; + /** + * This sets the font weight of External Container Queue shape for the diagram + */ external_container_queueFontWeight?: string | number; + /** + * This sets the font size of Component shape for the diagram + */ componentFontSize?: string | number; + /** + * This sets the font family of Component shape for the diagram + */ componentFontFamily?: string; + /** + * This sets the font weight of Component shape for the diagram + */ componentFontWeight?: string | number; + /** + * This sets the font size of External Component shape for the diagram + */ external_componentFontSize?: string | number; + /** + * This sets the font family of External Component shape for the diagram + */ external_componentFontFamily?: string; + /** + * This sets the font weight of External Component shape for the diagram + */ external_componentFontWeight?: string | number; + /** + * This sets the font size of Component DB shape for the diagram + */ component_dbFontSize?: string | number; + /** + * This sets the font family of Component DB shape for the diagram + */ component_dbFontFamily?: string; + /** + * This sets the font weight of Component DB shape for the diagram + */ component_dbFontWeight?: string | number; + /** + * This sets the font size of External Component DB shape for the diagram + */ external_component_dbFontSize?: string | number; + /** + * This sets the font family of External Component DB shape for the diagram + */ external_component_dbFontFamily?: string; + /** + * This sets the font weight of External Component DB shape for the diagram + */ external_component_dbFontWeight?: string | number; + /** + * This sets the font size of Component Queue shape for the diagram + */ component_queueFontSize?: string | number; + /** + * This sets the font family of Component Queue shape for the diagram + */ component_queueFontFamily?: string; + /** + * This sets the font weight of Component Queue shape for the diagram + */ component_queueFontWeight?: string | number; + /** + * This sets the font size of External Component Queue shape for the diagram + */ external_component_queueFontSize?: string | number; + /** + * This sets the font family of External Component Queue shape for the diagram + */ external_component_queueFontFamily?: string; + /** + * This sets the font weight of External Component Queue shape for the diagram + */ external_component_queueFontWeight?: string | number; + /** + * This sets the auto-wrap state for the diagram + */ wrap?: boolean; + /** + * This sets the auto-wrap padding for the diagram (sides only) + */ wrapPadding?: number; person_bg_color?: string; person_border_color?: string; @@ -186,8 +554,14 @@ export interface C4DiagramConfig extends BaseDiagramConfig { boundaryFont?: FontCalculator; messageFont?: FontCalculator; } - +/** + * This interface was referenced by `MermaidConfig`'s JSON-Schema + * via the `definition` "GitGraphDiagramConfig". + */ export interface GitGraphDiagramConfig extends BaseDiagramConfig { + /** + * Margin top for the text over the diagram + */ titleTopMargin?: number; diagramPadding?: number; nodeLabel?: NodeLabel; @@ -196,16 +570,29 @@ export interface GitGraphDiagramConfig extends BaseDiagramConfig { showCommitLabel?: boolean; showBranches?: boolean; rotateCommitLabel?: boolean; + /** + * Controls whether or arrow markers in html code are absolute paths or anchors. + * This matters if you are using base tag settings. + * + */ 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; @@ -217,51 +604,163 @@ export interface RequirementDiagramConfig extends BaseDiagramConfig { 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 { - useMaxWidth: boolean; - padding: number; - maxNodeWidth: number; + padding?: number; + maxNodeWidth?: number; } - +/** + * This interface was referenced by `MermaidConfig`'s JSON-Schema + * via the `definition` "PieDiagramConfig". + */ export interface PieDiagramConfig extends BaseDiagramConfig { + /** + * Axial position of slice's label from zero at the center to 1 at the outside edges. + * + */ textPosition?: number; } - +/** + * This interface was referenced by `MermaidConfig`'s JSON-Schema + * via the `definition` "QuadrantChartConfig". + */ export interface QuadrantChartConfig extends BaseDiagramConfig { - chartWidth: number; - chartHeight: number; - titleFontSize: number; - titlePadding: number; - quadrantPadding: number; - xAxisLabelPadding: number; - yAxisLabelPadding: number; - xAxisLabelFontSize: number; - yAxisLabelFontSize: number; - quadrantLabelFontSize: number; - quadrantTextTopPadding: number; - pointTextPadding: number; - pointLabelFontSize: number; - pointRadius: number; - xAxisPosition: 'top' | 'bottom'; - yAxisPosition: 'left' | 'right'; - quadrantInternalBorderStrokeWidth: number; - quadrantExternalBorderStrokeWidth: number; + /** + * Width of the chart + */ + chartWidth?: number; + /** + * Height of the chart + */ + chartHeight?: number; + /** + * Chart title top and bottom padding + */ + titleFontSize?: number; + /** + * Padding around the quadrant square + */ + titlePadding?: number; + /** + * quadrant title padding from top if the quadrant is rendered on top + */ + quadrantPadding?: number; + /** + * Padding around x-axis labels + */ + xAxisLabelPadding?: number; + /** + * Padding around y-axis labels + */ + yAxisLabelPadding?: number; + /** + * x-axis label font size + */ + xAxisLabelFontSize?: number; + /** + * y-axis label font size + */ + yAxisLabelFontSize?: number; + /** + * quadrant title font size + */ + quadrantLabelFontSize?: number; + /** + * quadrant title padding from top if the quadrant is rendered on top + */ + quadrantTextTopPadding?: number; + /** + * padding between point and point label + */ + pointTextPadding?: number; + /** + * point title font size + */ + pointLabelFontSize?: number; + /** + * radius of the point to be drawn + */ + pointRadius?: number; + /** + * position of x-axis labels + */ + xAxisPosition?: "top" | "bottom"; + /** + * position of y-axis labels + */ + yAxisPosition?: "left" | "right"; + /** + * stroke width of edges of the box that are inside the quadrant + */ + quadrantInternalBorderStrokeWidth?: number; + /** + * stroke width of edges of the box that are outside the quadrant + */ + quadrantExternalBorderStrokeWidth?: 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 + */ titleTopMargin?: number; + /** + * The amount of padding around the diagram as a whole so that embedded + * diagrams have margins, expressed in pixels. + * + */ diagramPadding?: number; - layoutDirection?: string; + /** + * Directional bias for layout of entities + */ + layoutDirection?: string | "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; } - +/** + * 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; @@ -273,161 +772,540 @@ export interface StateDiagramConfig extends BaseDiagramConfig { 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; - defaultRenderer?: string; + /** + * Decides which rendering engine that is to be used for the rendering. + * + */ + defaultRenderer?: string | "dagre-d3" | "dagre-wrapper" | "elk"; } - +/** + * This interface was referenced by `MermaidConfig`'s JSON-Schema + * via the `definition` "ClassDiagramConfig". + */ 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; - defaultRenderer?: string; + /** + * Decides which rendering engine that is to be used for the rendering. + * + */ + defaultRenderer?: string | "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; } - +/** + * 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 { + /** + * Margin to the right and left of the c4 diagram, must be a positive value. + * + */ diagramMarginX?: number; + /** + * Margin to the over and under the c4 diagram, must be a positive value. + * + */ diagramMarginY?: number; + /** + * Margin between actors + */ leftMargin?: number; + /** + * Width of actor boxes + */ width?: number; + /** + * Height of actor boxes + */ height?: number; + /** + * Margin around loop boxes + */ boxMargin?: number; + /** + * Margin around the text in loop/alt/opt boxes + */ boxTextMargin?: number; + /** + * Margin around notes + */ noteMargin?: number; + /** + * Space between messages. + */ messageMargin?: number; - messageAlign?: string; + /** + * Multiline message alignment + */ + messageAlign?: string | "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 + * + */ 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 { + /** + * Margin to the right and left of the c4 diagram, must be a positive value. + * + */ diagramMarginX?: number; + /** + * Margin to the over and under the c4 diagram, must be a positive value. + * + */ diagramMarginY?: number; + /** + * Margin between actors + */ leftMargin?: number; + /** + * Width of actor boxes + */ width?: number; + /** + * Height of actor boxes + */ height?: number; padding?: number; + /** + * Margin around loop boxes + */ boxMargin?: number; + /** + * Margin around the text in loop/alt/opt boxes + */ boxTextMargin?: number; + /** + * Margin around notes + */ noteMargin?: number; + /** + * Space between messages. + */ messageMargin?: number; - messageAlign?: string; + /** + * Multiline message alignment + */ + messageAlign?: string | "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 + * + */ textPlacement?: string; actorColours?: string[]; sectionFills?: string[]; sectionColours?: string[]; disableMulticolor?: boolean; - useMaxWidth?: 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 { + /** + * Margin top for the text over the diagram + */ titleTopMargin?: number; + /** + * The height of the bars in the graph + */ barHeight?: number; + /** + * The margin between the different activities in the gantt diagram + */ barGap?: number; + /** + * Margin between title and gantt diagram and between axis and gantt diagram. + * + */ topPadding?: number; + /** + * The space allocated for the section name to the right of the activities + * + */ rightPadding?: number; + /** + * The space allocated for the section name to the left of the activities + * + */ leftPadding?: number; + /** + * Vertical starting position of the grid lines + */ gridLineStartPadding?: number; + /** + * Font size + */ fontSize?: number; + /** + * Font size for sections + */ sectionFontSize?: string | number; + /** + * The number of alternating section styles + */ numberSectionStyles?: number; + /** + * Date/time format of the axis + * + * This might need adjustment to match your locale and preferences. + * + */ axisFormat?: string; + /** + * axis ticks + * + * Pattern is: + * + * ```javascript + * /^([1-9][0-9]*)(minute|hour|day|week|month)$/ + * ``` + * + */ tickInterval?: string; + /** + * When this flag is set, date labels will be added to the top of the chart + * + */ topAxis?: boolean; - displayMode?: string; + /** + * Controls the display mode. + * + */ + displayMode?: string | "compact"; } - +/** + * 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; + /** + * Width of the activation rect + */ activationWidth?: number; + /** + * Margin to the right and left of the sequence diagram + */ diagramMarginX?: number; + /** + * Margin to the over and under the sequence diagram + */ diagramMarginY?: number; + /** + * Margin between actors + */ actorMargin?: number; + /** + * Width of actor boxes + */ width?: number; + /** + * Height of actor boxes + */ height?: number; + /** + * Margin around loop boxes + */ boxMargin?: number; + /** + * Margin around the text in loop/alt/opt boxes + */ boxTextMargin?: number; + /** + * Margin around notes + */ noteMargin?: number; + /** + * Space between messages. + */ messageMargin?: number; - messageAlign?: string; + /** + * Multiline message alignment + */ + messageAlign?: string | "left" | "center" | "right"; + /** + * Mirror actors under diagram + * + */ mirrorActors?: boolean; + /** + * forces actor popup menus to always be visible (to support E2E testing). + * + */ forceMenus?: boolean; + /** + * 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; + /** + * This will show the node numbers + */ showSequenceNumbers?: boolean; + /** + * This sets the font size of the actor's description + */ actorFontSize?: string | number; + /** + * This sets the font family of the actor's description + */ actorFontFamily?: string; + /** + * This sets the font weight of the actor's description + */ actorFontWeight?: string | number; + /** + * This sets the font size of actor-attached notes + */ noteFontSize?: string | number; + /** + * This sets the font family of actor-attached notes + */ noteFontFamily?: string; + /** + * This sets the font weight of actor-attached notes + */ noteFontWeight?: string | number; - noteAlign?: string; + /** + * This sets the text alignment of actor-attached notes + */ + noteAlign?: string | "left" | "center" | "right"; + /** + * This sets the font size of actor messages + */ messageFontSize?: string | number; + /** + * This sets the font family of actor messages + */ messageFontFamily?: string; + /** + * This sets the font weight of actor messages + */ messageFontWeight?: string | number; + /** + * This sets the auto-wrap state for the diagram + */ wrap?: boolean; + /** + * This sets the auto-wrap padding for the diagram (sides only) + */ wrapPadding?: number; + /** + * This sets the width of the loop-box (loop, alt, opt, par) + */ labelBoxWidth?: number; + /** + * This sets the height of the loop-box (loop, alt, opt, par) + */ 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 { + /** + * Margin top for the text over the diagram + */ titleTopMargin?: number; arrowMarkerAbsolute?: boolean; + /** + * The amount of padding around the diagram as a whole so that embedded + * diagrams have margins, expressed in pixels. + * + */ diagramPadding?: number; + /** + * Flag for setting whether or not a html tag should be used for rendering labels on the edges. + * + */ htmlLabels?: boolean; + /** + * 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. + * + */ nodeSpacing?: 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. + * + */ rankSpacing?: number; - curve?: string; + /** + * Defines how mermaid renders curves for flowcharts. + * + */ + curve?: string | "basis" | "linear" | "cardinal"; + /** + * Represents the padding between the labels and the shape + * + * **Only used in new experimental rendering.** + * + */ padding?: number; - defaultRenderer?: string; + /** + * Decides which rendering engine that is to be used for the rendering. + * + */ + defaultRenderer?: string | "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; } - -export type SankeyLinkColor = 'source' | 'target' | 'gradient'; -export type SankeyNodeAlignment = 'left' | 'right' | 'center' | 'justify'; - +/** + * The object containing configurations specific for sankey diagrams. + * + * This interface was referenced by `MermaidConfig`'s JSON-Schema + * via the `definition` "SankeyDiagramConfig". + */ export interface SankeyDiagramConfig extends BaseDiagramConfig { width?: number; height?: number; + /** + * The color of the links in the sankey diagram. + * + */ linkColor?: SankeyLinkColor | string; - nodeAlignment?: SankeyNodeAlignment; + /** + * Controls the alignment of the Sankey diagrams. + * + * See . + * + */ + nodeAlignment?: "left" | "right" | "center" | "justify"; + useMaxWidth?: boolean; } - +/** + * This interface was referenced by `MermaidConfig`'s JSON-Schema + * via the `definition` "FontConfig". + */ export interface FontConfig { - fontSize?: string | number; + fontSize?: CSSFontSize; + /** + * The CSS [`font-family`](https://developer.mozilla.org/en-US/docs/Web/CSS/font-family) to use. + */ fontFamily?: string; + /** + * The font weight to use. + */ fontWeight?: string | number; } - -export type FontCalculator = () => Partial; - -export {}; diff --git a/packages/mermaid/src/defaultConfig.ts b/packages/mermaid/src/defaultConfig.ts index cc2b79a80..62b361cff 100644 --- a/packages/mermaid/src/defaultConfig.ts +++ b/packages/mermaid/src/defaultConfig.ts @@ -1,559 +1,29 @@ import theme from './themes/index.js'; import { type MermaidConfig } from './config.type.js'; + +// Uses our custom Vite jsonSchemaPlugin to load only the default values from +// our JSON Schema +// @ts-expect-error This file is automatically generated via a custom Vite plugin +import defaultConfigJson from './schemas/config.schema.yaml?only-defaults=true'; + /** - * **Configuration methods in Mermaid version 8.6.0 have been updated, to learn more[[click - * here](8.6.0_docs.md)].** + * Default mermaid configuration options. * - * ## **What follows are config instructions for older versions** - * - * These are the default options which can be overridden with the initialization call like so: - * - * **Example 1:** - * - * ```js - * mermaid.initialize({ flowchart:{ htmlLabels: false } }); - * ``` - * - * **Example 2:** - * - * ```html - * - * ``` - * - * A summary of all options and their defaults is found [here](#mermaidapi-configuration-defaults). - * A description of each option follows below. + * Please see the Mermaid config JSON Schema for the default JSON values. + * Non-JSON JS default values are listed in this file, e.g. functions, or + * `undefined` (explicitly set so that `configKeys` finds them). */ const config: Partial = { - /** - * Theme , the CSS style sheet - * - * | Parameter | Description | Type | Required | Values | - * | --------- | --------------- | ------ | -------- | ---------------------------------------------- | - * | theme | Built in Themes | string | Optional | 'default', 'forest', 'dark', 'neutral', 'null' | - * - * **Notes:** To disable any pre-defined mermaid theme, use "null". - * - * @example - * - * ```js - * { - * "theme": "forest", - * "themeCSS": ".node rect { fill: red; }" - * } - * ``` - */ - theme: 'default', - themeVariables: theme['default'].getThemeVariables(), - themeCSS: undefined, - /* **maxTextSize** - The maximum allowed size of the users text diagram */ - maxTextSize: 50000, - darkMode: false, - - /** - * | Parameter | Description | Type | Required | Values | - * | ---------- | ------------------------------------------------------ | ------ | -------- | --------------------------- | - * | fontFamily | specifies the font to be used in the rendered diagrams | string | Required | Any Possible CSS FontFamily | - * - * **Notes:** Default value: '"trebuchet ms", verdana, arial, sans-serif;'. - */ - fontFamily: '"trebuchet ms", verdana, arial, sans-serif;', - - /** - * | Parameter | Description | Type | Required | Values | - * | --------- | ----------------------------------------------------- | ---------------- | -------- | --------------------------------------------- | - * | logLevel | This option decides the amount of logging to be used. | string \| number | Required | 'trace','debug','info','warn','error','fatal' | - * - * **Notes:** - * - * - Trace: 0 - * - Debug: 1 - * - Info: 2 - * - Warn: 3 - * - Error: 4 - * - Fatal: 5 (default) - */ - logLevel: 5, - - /** - * | Parameter | Description | Type | Required | Values | - * | ------------- | --------------------------------- | ------ | -------- | ------------------------------------------ | - * | securityLevel | Level of trust for parsed diagram | string | Required | 'sandbox', 'strict', 'loose', 'antiscript' | - * - * **Notes**: - * - * - **strict**: (**default**) HTML tags in the text are encoded and click functionality is disabled. - * - **antiscript**: HTML tags in text are allowed (only script elements are removed), and click - * functionality is enabled. - * - **loose**: HTML tags in text are allowed and click functionality is enabled. - * - **sandbox**: With this security level, all rendering takes place in a sandboxed iframe. This - * prevent any JavaScript from running in the context. This may hinder interactive functionality - * of the diagram, like scripts, popups in the sequence diagram, links to other tabs or targets, etc. - */ - securityLevel: 'strict', - - /** - * | Parameter | Description | Type | Required | Values | - * | ----------- | -------------------------------------------- | ------- | -------- | ----------- | - * | startOnLoad | Dictates whether mermaid starts on Page load | boolean | Required | true, false | - * - * **Notes:** Default value: true - */ - startOnLoad: true, - - /** - * | Parameter | Description | Type | Required | Values | - * | ------------------- | ---------------------------------------------------------------------------- | ------- | -------- | ----------- | - * | arrowMarkerAbsolute | Controls whether or arrow markers in html code are absolute paths or anchors | boolean | Required | true, false | - * - * **Notes**: - * - * This matters if you are using base tag settings. - * - * Default value: false - */ - arrowMarkerAbsolute: false, - - /** - * This option controls which currentConfig keys are considered _secure_ and can only be changed - * via call to mermaidAPI.initialize. Calls to mermaidAPI.reinitialize cannot make changes to the - * `secure` keys in the current currentConfig. This prevents malicious graph directives from - * overriding a site's default security. - * - * **Notes**: - * - * Default value: ['secure', 'securityLevel', 'startOnLoad', 'maxTextSize'] - */ - secure: ['secure', 'securityLevel', 'startOnLoad', 'maxTextSize'], - /** - * This option controls if the generated ids of nodes in the SVG are generated randomly or based - * on a seed. If set to false, the IDs are generated based on the current date and thus are not - * deterministic. This is the default behavior. - * - * **Notes**: - * - * This matters if your files are checked into source control e.g. git and should not change unless - * content is changed. - * - * Default value: false - */ - deterministicIds: false, - - /** - * This option is the optional seed for deterministic ids. if set to undefined but - * deterministicIds is true, a simple number iterator is used. You can set this attribute to base - * the seed on a static string. - */ + ...defaultConfigJson, + // Set, even though they're `undefined` so that `configKeys` finds these keys + // TODO: Should we replace these with `null` so that they can go in the JSON Schema? deterministicIDSeed: undefined, + themeCSS: undefined, - /** The object containing configurations specific for flowcharts */ - flowchart: { - /** - * ### titleTopMargin - * - * | Parameter | Description | Type | Required | Values | - * | -------------- | ---------------------------------------------- | ------- | -------- | ------------------ | - * | titleTopMargin | Margin top for the text over the flowchart | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 25 - */ - titleTopMargin: 25, - - /** - * | Parameter | Description | Type | Required | Values | - * | -------------- | ----------------------------------------------- | ------- | -------- | ------------------ | - * | diagramPadding | Amount of padding around the diagram as a whole | Integer | Required | Any Positive Value | - * - * **Notes:** - * - * The amount of padding around the diagram as a whole so that embedded diagrams have margins, - * expressed in pixels - * - * Default value: 8 - */ - diagramPadding: 8, - - /** - * | Parameter | Description | Type | Required | Values | - * | ---------- | -------------------------------------------------------------------------------------------- | ------- | -------- | ----------- | - * | htmlLabels | Flag for setting whether or not a html tag should be used for rendering labels on the edges. | boolean | Required | true, false | - * - * **Notes:** Default value: true. - */ - htmlLabels: true, - - /** - * | Parameter | Description | Type | Required | Values | - * | ----------- | --------------------------------------------------- | ------- | -------- | ------------------- | - * | nodeSpacing | Defines the spacing between nodes on the same level | Integer | Required | Any positive Number | - * - * **Notes:** - * - * 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.** - * - * Default value: 50 - */ - nodeSpacing: 50, - - /** - * | Parameter | Description | Type | Required | Values | - * | ----------- | ----------------------------------------------------- | ------- | -------- | ------------------- | - * | rankSpacing | Defines the spacing between nodes on different levels | Integer | Required | Any Positive Number | - * - * **Notes**: - * - * Pertains to vertical spacing for TB (top to bottom) or BT (bottom to top), and the horizontal - * spacing for LR as well as RL graphs. - * - * Default value 50 - */ - rankSpacing: 50, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------- | -------------------------------------------------- | ------ | -------- | ----------------------------- | - * | curve | Defines how mermaid renders curves for flowcharts. | string | Required | 'basis', 'linear', 'cardinal' | - * - * **Notes:** - * - * Default Value: 'basis' - */ - curve: 'basis', - // Only used in new experimental rendering - // represents the padding between the labels and the shape - padding: 15, - - /** - * | Parameter | Description | Type | Required | Values | - * | ----------- | ----------- | ------- | -------- | ----------- | - * | useMaxWidth | See notes | boolean | 4 | true, false | - * - * **Notes:** - * - * When this flag is set the height and width is set to 100% and is then scaling with the - * available space if not the absolute space required is used. - * - * Default value: true - */ - useMaxWidth: true, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------------- | ----------- | ------- | -------- | ----------------------- | - * | defaultRenderer | See notes | boolean | 4 | dagre-d3, dagre-wrapper, elk | - * - * **Notes:** - * - * Decides which rendering engine that is to be used for the rendering. Legal values are: - * dagre-d3 dagre-wrapper - wrapper for dagre implemented in mermaid, elk for layout using - * elkjs - * - * Default value: 'dagre-wrapper' - */ - defaultRenderer: 'dagre-wrapper', - /** - * | Parameter | Description | Type | Required | Values | - * | --------------- | ----------- | ------- | -------- | ----------------------- | - * | wrappingWidth | See notes | number | 4 | width of nodes where text is wrapped | - * - * **Notes:** - * - * 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. - * Default value: 'dagre-wrapper' - */ - wrappingWidth: 200, - }, - - /** The object containing configurations specific for sequence diagrams */ + // add non-JSON default config values + themeVariables: theme['default'].getThemeVariables(), sequence: { - hideUnusedParticipants: false, - /** - * | Parameter | Description | Type | Required | Values | - * | --------------- | ---------------------------- | ------- | -------- | ------------------ | - * | activationWidth | Width of the activation rect | Integer | Required | Any Positive Value | - * - * **Notes:** Default value :10 - */ - activationWidth: 10, - - /** - * | Parameter | Description | Type | Required | Values | - * | -------------- | ---------------------------------------------------- | ------- | -------- | ------------------ | - * | diagramMarginX | Margin to the right and left of the sequence diagram | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 50 - */ - diagramMarginX: 50, - - /** - * | Parameter | Description | Type | Required | Values | - * | -------------- | ------------------------------------------------- | ------- | -------- | ------------------ | - * | diagramMarginY | Margin to the over and under the sequence diagram | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 10 - */ - diagramMarginY: 10, - - /** - * | Parameter | Description | Type | Required | Values | - * | ----------- | --------------------- | ------- | -------- | ------------------ | - * | actorMargin | Margin between actors | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 50 - */ - actorMargin: 50, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------- | -------------------- | ------- | -------- | ------------------ | - * | width | Width of actor boxes | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 150 - */ - width: 150, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------- | --------------------- | ------- | -------- | ------------------ | - * | height | Height of actor boxes | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 65 - */ - height: 65, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------- | ------------------------ | ------- | -------- | ------------------ | - * | boxMargin | Margin around loop boxes | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 10 - */ - boxMargin: 10, - - /** - * | Parameter | Description | Type | Required | Values | - * | ------------- | -------------------------------------------- | ------- | -------- | ------------------ | - * | boxTextMargin | Margin around the text in loop/alt/opt boxes | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 5 - */ - boxTextMargin: 5, - - /** - * | Parameter | Description | Type | Required | Values | - * | ---------- | ------------------- | ------- | -------- | ------------------ | - * | noteMargin | margin around notes | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 10 - */ - noteMargin: 10, - - /** - * | Parameter | Description | Type | Required | Values | - * | ------------- | ---------------------- | ------- | -------- | ------------------ | - * | messageMargin | Space between messages | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 35 - */ - messageMargin: 35, - - /** - * | Parameter | Description | Type | Required | Values | - * | ------------ | --------------------------- | ------ | -------- | ------------------------- | - * | messageAlign | Multiline message alignment | string | Required | 'left', 'center', 'right' | - * - * **Notes:** Default value: 'center' - */ - messageAlign: 'center', - - /** - * | Parameter | Description | Type | Required | Values | - * | ------------ | --------------------------- | ------- | -------- | ----------- | - * | mirrorActors | Mirror actors under diagram | boolean | Required | true, false | - * - * **Notes:** Default value: true - */ - mirrorActors: true, - - /** - * | Parameter | Description | Type | Required | Values | - * | ---------- | ----------------------------------------------------------------------- | ------- | -------- | ----------- | - * | forceMenus | forces actor popup menus to always be visible (to support E2E testing). | Boolean | Required | True, False | - * - * **Notes:** - * - * Default value: false. - */ - forceMenus: false, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------------- | ------------------------------------------ | ------- | -------- | ------------------ | - * | bottomMarginAdj | Prolongs the edge of the diagram downwards | Integer | Required | Any Positive Value | - * - * **Notes:** - * - * Depending on css styling this might need adjustment. - * - * Default value: 1 - */ - bottomMarginAdj: 1, - - /** - * | Parameter | Description | Type | Required | Values | - * | ----------- | ----------- | ------- | -------- | ----------- | - * | useMaxWidth | See Notes | boolean | Required | true, false | - * - * **Notes:** When this flag is set to true, the height and width is set to 100% and is then - * scaling with the available space. If set to false, the absolute space required is used. - * - * Default value: true - */ - useMaxWidth: true, - - /** - * | Parameter | Description | Type | Required | Values | - * | ----------- | ------------------------------------ | ------- | -------- | ----------- | - * | rightAngles | display curve arrows as right angles | boolean | Required | true, false | - * - * **Notes:** - * - * This will display arrows that start and begin at the same node as right angles, rather than a - * curve - * - * Default value: false - */ - rightAngles: false, - - /** - * | Parameter | Description | Type | Required | Values | - * | ------------------- | ------------------------------- | ------- | -------- | ----------- | - * | showSequenceNumbers | This will show the node numbers | boolean | Required | true, false | - * - * **Notes:** Default value: false - */ - showSequenceNumbers: false, - - /** - * | Parameter | Description | Type | Required | Values | - * | ------------- | -------------------------------------------------- | ------- | -------- | ------------------ | - * | actorFontSize | This sets the font size of the actor's description | Integer | Require | Any Positive Value | - * - * **Notes:** **Default value 14**.. - */ - actorFontSize: 14, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------------- | ---------------------------------------------------- | ------ | -------- | --------------------------- | - * | actorFontFamily | This sets the font family of the actor's description | string | Required | Any Possible CSS FontFamily | - * - * **Notes:** Default value: "'Open Sans", sans-serif' - */ - actorFontFamily: '"Open Sans", sans-serif', - - /** - * This sets the font weight of the actor's description - * - * **Notes:** Default value: 400. - */ - actorFontWeight: 400, - - /** - * | Parameter | Description | Type | Required | Values | - * | ------------ | ----------------------------------------------- | ------- | -------- | ------------------ | - * | noteFontSize | This sets the font size of actor-attached notes | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 14 - */ - noteFontSize: 14, - - /** - * | Parameter | Description | Type | Required | Values | - * | -------------- | -------------------------------------------------- | ------ | -------- | --------------------------- | - * | noteFontFamily | This sets the font family of actor-attached notes. | string | Required | Any Possible CSS FontFamily | - * - * **Notes:** Default value: ''"trebuchet ms", verdana, arial, sans-serif' - */ - noteFontFamily: '"trebuchet ms", verdana, arial, sans-serif', - - /** - * This sets the font weight of the note's description - * - * **Notes:** Default value: 400 - */ - noteFontWeight: 400, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------- | ---------------------------------------------------- | ------ | -------- | ------------------------- | - * | noteAlign | This sets the text alignment of actor-attached notes | string | required | 'left', 'center', 'right' | - * - * **Notes:** Default value: 'center' - */ - noteAlign: 'center', - - /** - * | Parameter | Description | Type | Required | Values | - * | --------------- | ----------------------------------------- | ------- | -------- | ------------------- | - * | messageFontSize | This sets the font size of actor messages | Integer | Required | Any Positive Number | - * - * **Notes:** Default value: 16 - */ - messageFontSize: 16, - - /** - * | Parameter | Description | Type | Required | Values | - * | ----------------- | ------------------------------------------- | ------ | -------- | --------------------------- | - * | messageFontFamily | This sets the font family of actor messages | string | Required | Any Possible CSS FontFamily | - * - * **Notes:** Default value: '"trebuchet ms", verdana, arial, sans-serif' - */ - messageFontFamily: '"trebuchet ms", verdana, arial, sans-serif', - - /** - * This sets the font weight of the message's description - * - * **Notes:** Default value: 400. - */ - messageFontWeight: 400, - - /** - * This sets the auto-wrap state for the diagram - * - * **Notes:** Default value: false. - */ - wrap: false, - - /** - * This sets the auto-wrap padding for the diagram (sides only) - * - * **Notes:** Default value: 0. - */ - wrapPadding: 10, - - /** - * This sets the width of the loop-box (loop, alt, opt, par) - * - * **Notes:** Default value: 50. - */ - labelBoxWidth: 50, - - /** - * This sets the height of the loop-box (loop, alt, opt, par) - * - * **Notes:** Default value: 20. - */ - labelBoxHeight: 20, - + ...defaultConfigJson.sequence, messageFont: function () { return { fontFamily: this.messageFontFamily, @@ -576,1476 +46,14 @@ const config: Partial = { }; }, }, - - /** The object containing configurations specific for gantt diagrams */ gantt: { - /** - * ### titleTopMargin - * - * | Parameter | Description | Type | Required | Values | - * | -------------- | ---------------------------------------------- | ------- | -------- | ------------------ | - * | titleTopMargin | Margin top for the text over the gantt diagram | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 25 - */ - titleTopMargin: 25, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------- | ----------------------------------- | ------- | -------- | ------------------ | - * | barHeight | The height of the bars in the graph | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 20 - */ - barHeight: 20, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------- | ---------------------------------------------------------------- | ------- | -------- | ------------------ | - * | barGap | The margin between the different activities in the gantt diagram | Integer | Optional | Any Positive Value | - * - * **Notes:** Default value: 4 - */ - barGap: 4, - - /** - * | Parameter | Description | Type | Required | Values | - * | ---------- | -------------------------------------------------------------------------- | ------- | -------- | ------------------ | - * | topPadding | Margin between title and gantt diagram and between axis and gantt diagram. | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 50 - */ - topPadding: 50, - - /** - * | Parameter | Description | Type | Required | Values | - * | ------------ | ----------------------------------------------------------------------- | ------- | -------- | ------------------ | - * | rightPadding | The space allocated for the section name to the right of the activities | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 75 - */ - rightPadding: 75, - - /** - * | Parameter | Description | Type | Required | Values | - * | ----------- | ---------------------------------------------------------------------- | ------- | -------- | ------------------ | - * | leftPadding | The space allocated for the section name to the left of the activities | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 75 - */ - leftPadding: 75, - - /** - * | Parameter | Description | Type | Required | Values | - * | -------------------- | -------------------------------------------- | ------- | -------- | ------------------ | - * | gridLineStartPadding | Vertical starting position of the grid lines | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 35 - */ - gridLineStartPadding: 35, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------- | ----------- | ------- | -------- | ------------------ | - * | fontSize | Font size | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 11 - */ - fontSize: 11, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------------- | ---------------------- | ------- | -------- | ------------------ | - * | sectionFontSize | Font size for sections | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 11 - */ - sectionFontSize: 11, - - /** - * | Parameter | Description | Type | Required | Values | - * | ------------------- | ---------------------------------------- | ------- | -------- | ------------------ | - * | numberSectionStyles | The number of alternating section styles | Integer | 4 | Any Positive Value | - * - * **Notes:** Default value: 4 - */ - numberSectionStyles: 4, - - /** - * | Parameter | Description | Type | Required | Values | - * | ----------- | ------------------------- | ------ | -------- | --------- | - * | displayMode | Controls the display mode | string | 4 | 'compact' | - * - * **Notes**: - * - * - **compact**: Enables displaying multiple tasks on the same row. - */ - displayMode: '', - - /** - * | Parameter | Description | Type | Required | Values | - * | ---------- | ---------------------------- | ---- | -------- | ---------------- | - * | axisFormat | Date/time format of the axis | 3 | Required | Date in yy-mm-dd | - * - * **Notes:** - * - * This might need adjustment to match your locale and preferences - * - * Default value: '%Y-%m-%d'. - */ - axisFormat: '%Y-%m-%d', - - /** - * | Parameter | Description | Type | Required | Values | - * | ------------ | ------------| ------ | -------- | ------- | - * | tickInterval | axis ticks | string | Optional | string | - * - * **Notes:** - * - * Pattern is /^([1-9][0-9]*)(minute|hour|day|week|month)$/ - * - * Default value: undefined - */ + ...defaultConfigJson.gantt, tickInterval: undefined, - /** - * | Parameter | Description | Type | Required | Values | - * | ----------- | ----------- | ------- | -------- | ----------- | - * | useMaxWidth | See notes | boolean | 4 | true, false | - * - * **Notes:** - * - * When this flag is set the height and width is set to 100% and is then scaling with the - * available space if not the absolute space required is used. - * - * Default value: true - */ - useMaxWidth: true, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------- | ----------- | ------- | -------- | ----------- | - * | topAxis | See notes | Boolean | 4 | True, False | - * - * **Notes:** when this flag is set date labels will be added to the top of the chart - * - * **Default value false**. - */ - topAxis: false, - - useWidth: undefined, + useWidth: undefined, // can probably be removed since `configKeys` already includes this }, - - /** The object containing configurations specific for journey diagrams */ - journey: { - /** - * | Parameter | Description | Type | Required | Values | - * | -------------- | ---------------------------------------------------- | ------- | -------- | ------------------ | - * | diagramMarginX | Margin to the right and left of the sequence diagram | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 50 - */ - diagramMarginX: 50, - - /** - * | Parameter | Description | Type | Required | Values | - * | -------------- | -------------------------------------------------- | ------- | -------- | ------------------ | - * | diagramMarginY | Margin to the over and under the sequence diagram. | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 10 - */ - diagramMarginY: 10, - - /** - * | Parameter | Description | Type | Required | Values | - * | ----------- | --------------------- | ------- | -------- | ------------------ | - * | actorMargin | Margin between actors | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 50 - */ - leftMargin: 150, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------- | -------------------- | ------- | -------- | ------------------ | - * | width | Width of actor boxes | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 150 - */ - width: 150, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------- | --------------------- | ------- | -------- | ------------------ | - * | height | Height of actor boxes | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 65 - */ - height: 50, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------- | ------------------------ | ------- | -------- | ------------------ | - * | boxMargin | Margin around loop boxes | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 10 - */ - boxMargin: 10, - - /** - * | Parameter | Description | Type | Required | Values | - * | ------------- | -------------------------------------------- | ------- | -------- | ------------------ | - * | boxTextMargin | Margin around the text in loop/alt/opt boxes | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 5 - */ - boxTextMargin: 5, - - /** - * | Parameter | Description | Type | Required | Values | - * | ---------- | ------------------- | ------- | -------- | ------------------ | - * | noteMargin | Margin around notes | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 10 - */ - noteMargin: 10, - - /** - * | Parameter | Description | Type | Required | Values | - * | ------------- | ----------------------- | ------- | -------- | ------------------ | - * | messageMargin | Space between messages. | Integer | Required | Any Positive Value | - * - * **Notes:** - * - * Space between messages. - * - * Default value: 35 - */ - messageMargin: 35, - - /** - * | Parameter | Description | Type | Required | Values | - * | ------------ | --------------------------- | ---- | -------- | ------------------------- | - * | messageAlign | Multiline message alignment | 3 | 4 | 'left', 'center', 'right' | - * - * **Notes:** Default value: 'center' - */ - messageAlign: 'center', - - /** - * | Parameter | Description | Type | Required | Values | - * | --------------- | ------------------------------------------ | ------- | -------- | ------------------ | - * | bottomMarginAdj | Prolongs the edge of the diagram downwards | Integer | 4 | Any Positive Value | - * - * **Notes:** - * - * Depending on css styling this might need adjustment. - * - * Default value: 1 - */ - bottomMarginAdj: 1, - - /** - * | Parameter | Description | Type | Required | Values | - * | ----------- | ----------- | ------- | -------- | ----------- | - * | useMaxWidth | See notes | boolean | 4 | true, false | - * - * **Notes:** - * - * When this flag is set the height and width is set to 100% and is then scaling with the - * available space if not the absolute space required is used. - * - * Default value: true - */ - useMaxWidth: true, - - /** - * | Parameter | Description | Type | Required | Values | - * | ----------- | --------------------------------- | ---- | -------- | ----------- | - * | rightAngles | Curved Arrows become Right Angles | 3 | 4 | true, false | - * - * **Notes:** - * - * This will display arrows that start and begin at the same node as right angles, rather than a - * curves - * - * Default value: false - */ - rightAngles: false, - taskFontSize: 14, - taskFontFamily: '"Open Sans", sans-serif', - taskMargin: 50, - // width of activation box - activationWidth: 10, - - // text placement as: tspan | fo | old only text as before - textPlacement: 'fo', - actorColours: ['#8FBC8F', '#7CFC00', '#00FFFF', '#20B2AA', '#B0E0E6', '#FFFFE0'], - - sectionFills: ['#191970', '#8B008B', '#4B0082', '#2F4F4F', '#800000', '#8B4513', '#00008B'], - sectionColours: ['#fff'], - }, - /** The object containing configurations specific for timeline diagrams */ - timeline: { - /** - * | Parameter | Description | Type | Required | Values | - * | -------------- | ---------------------------------------------------- | ------- | -------- | ------------------ | - * | diagramMarginX | Margin to the right and left of the sequence diagram | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 50 - */ - diagramMarginX: 50, - - /** - * | Parameter | Description | Type | Required | Values | - * | -------------- | -------------------------------------------------- | ------- | -------- | ------------------ | - * | diagramMarginY | Margin to the over and under the sequence diagram. | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 10 - */ - diagramMarginY: 10, - - /** - * | Parameter | Description | Type | Required | Values | - * | ----------- | --------------------- | ------- | -------- | ------------------ | - * | actorMargin | Margin between actors | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 50 - */ - leftMargin: 150, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------- | -------------------- | ------- | -------- | ------------------ | - * | width | Width of actor boxes | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 150 - */ - width: 150, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------- | --------------------- | ------- | -------- | ------------------ | - * | height | Height of actor boxes | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 65 - */ - height: 50, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------- | ------------------------ | ------- | -------- | ------------------ | - * | boxMargin | Margin around loop boxes | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 10 - */ - boxMargin: 10, - - /** - * | Parameter | Description | Type | Required | Values | - * | ------------- | -------------------------------------------- | ------- | -------- | ------------------ | - * | boxTextMargin | Margin around the text in loop/alt/opt boxes | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 5 - */ - boxTextMargin: 5, - - /** - * | Parameter | Description | Type | Required | Values | - * | ---------- | ------------------- | ------- | -------- | ------------------ | - * | noteMargin | Margin around notes | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 10 - */ - noteMargin: 10, - - /** - * | Parameter | Description | Type | Required | Values | - * | ------------- | ----------------------- | ------- | -------- | ------------------ | - * | messageMargin | Space between messages. | Integer | Required | Any Positive Value | - * - * **Notes:** - * - * Space between messages. - * - * Default value: 35 - */ - messageMargin: 35, - - /** - * | Parameter | Description | Type | Required | Values | - * | ------------ | --------------------------- | ---- | -------- | ------------------------- | - * | messageAlign | Multiline message alignment | 3 | 4 | 'left', 'center', 'right' | - * - * **Notes:** Default value: 'center' - */ - messageAlign: 'center', - - /** - * | Parameter | Description | Type | Required | Values | - * | --------------- | ------------------------------------------ | ------- | -------- | ------------------ | - * | bottomMarginAdj | Prolongs the edge of the diagram downwards | Integer | 4 | Any Positive Value | - * - * **Notes:** - * - * Depending on css styling this might need adjustment. - * - * Default value: 1 - */ - bottomMarginAdj: 1, - - /** - * | Parameter | Description | Type | Required | Values | - * | ----------- | ----------- | ------- | -------- | ----------- | - * | useMaxWidth | See notes | boolean | 4 | true, false | - * - * **Notes:** - * - * When this flag is set the height and width is set to 100% and is then scaling with the - * available space if not the absolute space required is used. - * - * Default value: true - */ - useMaxWidth: true, - - /** - * | Parameter | Description | Type | Required | Values | - * | ----------- | --------------------------------- | ---- | -------- | ----------- | - * | rightAngles | Curved Arrows become Right Angles | 3 | 4 | true, false | - * - * **Notes:** - * - * This will display arrows that start and begin at the same node as right angles, rather than a - * curves - * - * Default value: false - */ - rightAngles: false, - taskFontSize: 14, - taskFontFamily: '"Open Sans", sans-serif', - taskMargin: 50, - // width of activation box - activationWidth: 10, - - // text placement as: tspan | fo | old only text as before - textPlacement: 'fo', - actorColours: ['#8FBC8F', '#7CFC00', '#00FFFF', '#20B2AA', '#B0E0E6', '#FFFFE0'], - - sectionFills: ['#191970', '#8B008B', '#4B0082', '#2F4F4F', '#800000', '#8B4513', '#00008B'], - sectionColours: ['#fff'], - disableMulticolor: false, - }, - class: { - /** - * ### titleTopMargin - * - * | Parameter | Description | Type | Required | Values | - * | -------------- | ---------------------------------------------- | ------- | -------- | ------------------ | - * | titleTopMargin | Margin top for the text over the class diagram | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 25 - */ - titleTopMargin: 25, - arrowMarkerAbsolute: false, - dividerMargin: 10, - padding: 5, - textHeight: 10, - - /** - * | Parameter | Description | Type | Required | Values | - * | ----------- | ----------- | ------- | -------- | ----------- | - * | useMaxWidth | See notes | boolean | 4 | true, false | - * - * **Notes:** - * - * When this flag is set the height and width is set to 100% and is then scaling with the - * available space if not the absolute space required is used. - * - * Default value: true - */ - useMaxWidth: true, - /** - * | Parameter | Description | Type | Required | Values | - * | --------------- | ----------- | ------- | -------- | ----------------------- | - * | defaultRenderer | See notes | boolean | 4 | dagre-d3, dagre-wrapper | - * - * **Notes**: - * - * Decides which rendering engine that is to be used for the rendering. Legal values are: - * dagre-d3 dagre-wrapper - wrapper for dagre implemented in mermaid - * - * Default value: 'dagre-d3' - */ - defaultRenderer: 'dagre-wrapper', - }, - state: { - /** - * ### titleTopMargin - * - * | Parameter | Description | Type | Required | Values | - * | -------------- | ---------------------------------------------- | ------- | -------- | ------------------ | - * | titleTopMargin | Margin top for the text over the state diagram | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 25 - */ - titleTopMargin: 25, - dividerMargin: 10, - sizeUnit: 5, - padding: 8, - textHeight: 10, - titleShift: -15, - noteMargin: 10, - forkWidth: 70, - forkHeight: 7, - // Used - miniPadding: 2, - // 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: 5.02, - fontSize: 24, - labelHeight: 16, - edgeLengthFactor: '20', - compositTitleSize: 35, - radius: 5, - /** - * | Parameter | Description | Type | Required | Values | - * | ----------- | ----------- | ------- | -------- | ----------- | - * | useMaxWidth | See notes | boolean | 4 | true, false | - * - * **Notes:** - * - * When this flag is set the height and width is set to 100% and is then scaling with the - * available space if not the absolute space required is used. - * - * Default value: true - */ - useMaxWidth: true, - /** - * | Parameter | Description | Type | Required | Values | - * | --------------- | ----------- | ------- | -------- | ----------------------- | - * | defaultRenderer | See notes | boolean | 4 | dagre-d3, dagre-wrapper | - * - * **Notes:** - * - * Decides which rendering engine that is to be used for the rendering. Legal values are: - * dagre-d3 dagre-wrapper - wrapper for dagre implemented in mermaid - * - * Default value: 'dagre-d3' - */ - defaultRenderer: 'dagre-wrapper', - }, - - /** The object containing configurations specific for entity relationship diagrams */ - er: { - /** - * ### titleTopMargin - * - * | Parameter | Description | Type | Required | Values | - * | -------------- | ---------------------------------------------- | ------- | -------- | ------------------ | - * | titleTopMargin | Margin top for the text over the diagram | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 25 - */ - titleTopMargin: 25, - - /** - * | Parameter | Description | Type | Required | Values | - * | -------------- | ----------------------------------------------- | ------- | -------- | ------------------ | - * | diagramPadding | Amount of padding around the diagram as a whole | Integer | Required | Any Positive Value | - * - * **Notes:** - * - * The amount of padding around the diagram as a whole so that embedded diagrams have margins, - * expressed in pixels - * - * Default value: 20 - */ - diagramPadding: 20, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------------- | ---------------------------------------- | ------ | -------- | ---------------------- | - * | layoutDirection | Directional bias for layout of entities. | string | Required | "TB", "BT", "LR", "RL" | - * - * **Notes:** - * - * 'TB' for Top-Bottom, 'BT'for Bottom-Top, 'LR' for Left-Right, or 'RL' for Right to Left. - * - * T = top, B = bottom, L = left, and R = right. - * - * Default value: 'TB' - */ - layoutDirection: 'TB', - - /** - * | Parameter | Description | Type | Required | Values | - * | -------------- | ---------------------------------- | ------- | -------- | ------------------ | - * | minEntityWidth | The minimum width of an entity box | Integer | Required | Any Positive Value | - * - * **Notes:** Expressed in pixels. Default value: 100 - */ - minEntityWidth: 100, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------------- | ----------------------------------- | ------- | -------- | ------------------ | - * | minEntityHeight | The minimum height of an entity box | Integer | 4 | Any Positive Value | - * - * **Notes:** Expressed in pixels Default value: 75 - */ - minEntityHeight: 75, - - /** - * | Parameter | Description | Type | Required | Values | - * | ------------- | ------------------------------------------------------------ | ------- | -------- | ------------------ | - * | entityPadding | Minimum internal padding between text in box and box borders | Integer | 4 | Any Positive Value | - * - * **Notes:** - * - * The minimum internal padding between text in an entity box and the enclosing box borders, - * expressed in pixels. - * - * Default value: 15 - */ - entityPadding: 15, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------- | ----------------------------------- | ------ | -------- | -------------------- | - * | stroke | Stroke color of box edges and lines | string | 4 | Any recognized color | - * - * **Notes:** Default value: 'gray' - */ - stroke: 'gray', - - /** - * | Parameter | Description | Type | Required | Values | - * | --------- | -------------------------- | ------ | -------- | -------------------- | - * | fill | Fill color of entity boxes | string | 4 | Any recognized color | - * - * **Notes:** Default value: 'honeydew' - */ - fill: 'honeydew', - - /** - * | Parameter | Description | Type | Required | Values | - * | --------- | ------------------- | ------- | -------- | ------------------ | - * | fontSize | Font Size in pixels | Integer | | Any Positive Value | - * - * **Notes:** - * - * Font size (expressed as an integer representing a number of pixels) Default value: 12 - */ - fontSize: 12, - - /** - * | Parameter | Description | Type | Required | Values | - * | ----------- | ----------- | ------- | -------- | ----------- | - * | useMaxWidth | See Notes | boolean | Required | true, false | - * - * **Notes:** - * - * When this flag is set to true, the diagram width is locked to 100% and scaled based on - * available space. If set to false, the diagram reserves its absolute width. - * - * Default value: true - */ - useMaxWidth: true, - }, - - /** The object containing configurations specific for pie diagrams */ - pie: { - useWidth: undefined, - - /** - * | Parameter | Description | Type | Required | Values | - * | ----------- | ----------- | ------- | -------- | ----------- | - * | useMaxWidth | See Notes | boolean | Required | true, false | - * - * **Notes:** - * - * When this flag is set to true, the diagram width is locked to 100% and scaled based on - * available space. If set to false, the diagram reserves its absolute width. - * - * Default value: true - */ - useMaxWidth: true, - - /** - * | Parameter | Description | Type | Required | Values | - * | ------------ | -------------------------------------------------------------------------------- | ------- | -------- | ------------------- | - * | textPosition | Axial position of slice's label from zero at the center to 1 at the outside edge | Number | Optional | Decimal from 0 to 1 | - * - * **Notes:** Default value: 0.75 - */ - textPosition: 0.75, - }, - - quadrantChart: { - /** - * | Parameter | Description | Type | Required | Values | - * | --------------- | ---------------------------------- | ------- | -------- | ------------------- | - * | chartWidth | Width of the chart | number | Optional | Any positive number | - * - * **Notes:** - * Default value: 500 - */ - chartWidth: 500, - /** - * | Parameter | Description | Type | Required | Values | - * | --------------- | ---------------------------------- | ------- | -------- | ------------------- | - * | chartHeight | Height of the chart | number | Optional | Any positive number | - * - * **Notes:** - * Default value: 500 - */ - chartHeight: 500, - /** - * | Parameter | Description | Type | Required | Values | - * | ------------------ | ---------------------------------- | ------- | -------- | ------------------- | - * | titlePadding | Chart title top and bottom padding | number | Optional | Any positive number | - * - * **Notes:** - * Default value: 10 - */ - titlePadding: 10, - /** - * | Parameter | Description | Type | Required | Values | - * | ------------------ | ---------------------------------- | ------- | -------- | ------------------- | - * | titleFontSize | Chart title font size | number | Optional | Any positive number | - * - * **Notes:** - * Default value: 20 - */ - titleFontSize: 20, - /** - * | Parameter | Description | Type | Required | Values | - * | --------------- | ---------------------------------- | ------- | -------- | ------------------- | - * | quadrantPadding | Padding around the quadrant square | number | Optional | Any positive number | - * - * **Notes:** - * Default value: 5 - */ - quadrantPadding: 5, - /** - * | Parameter | Description | Type | Required | Values | - * | ---------------------- | -------------------------------------------------------------------------- | ------- | -------- | ------------------- | - * | quadrantTextTopPadding | quadrant title padding from top if the quadrant is rendered on top | number | Optional | Any positive number | - * - * **Notes:** - * Default value: 5 - */ - quadrantTextTopPadding: 5, - /** - * | Parameter | Description | Type | Required | Values | - * | ------------------ | ---------------------------------- | ------- | -------- | ------------------- | - * | quadrantLabelFontSize | quadrant title font size | number | Optional | Any positive number | - * - * **Notes:** - * Default value: 16 - */ - quadrantLabelFontSize: 16, - /** - * | Parameter | Description | Type | Required | Values | - * | --------------------------------- | ------------------------------------------------------------- | ------- | -------- | ------------------- | - * | quadrantInternalBorderStrokeWidth | stroke width of edges of the box that are inside the quadrant | number | Optional | Any positive number | - * - * **Notes:** - * Default value: 1 - */ - quadrantInternalBorderStrokeWidth: 1, - /** - * | Parameter | Description | Type | Required | Values | - * | --------------------------------- | -------------------------------------------------------------- | ------- | -------- | ------------------- | - * | quadrantExternalBorderStrokeWidth | stroke width of edges of the box that are outside the quadrant | number | Optional | Any positive number | - * - * **Notes:** - * Default value: 2 - */ - quadrantExternalBorderStrokeWidth: 2, - /** - * | Parameter | Description | Type | Required | Values | - * | --------------- | ---------------------------------- | ------- | -------- | ------------------- | - * | xAxisLabelPadding | Padding around x-axis labels | number | Optional | Any positive number | - * - * **Notes:** - * Default value: 5 - */ - xAxisLabelPadding: 5, - /** - * | Parameter | Description | Type | Required | Values | - * | ------------------ | ---------------------------------- | ------- | -------- | ------------------- | - * | xAxisLabelFontSize | x-axis label font size | number | Optional | Any positive number | - * - * **Notes:** - * Default value: 16 - */ - xAxisLabelFontSize: 16, - /** - * | Parameter | Description | Type | Required | Values | - * | ------------- | ------------------------------- | ------- | -------- | ------------------- | - * | xAxisPosition | position of x-axis labels | string | Optional | 'top' or 'bottom' | - * - * **Notes:** - * Default value: top - */ - xAxisPosition: 'top', - /** - * | Parameter | Description | Type | Required | Values | - * | --------------- | ---------------------------------- | ------- | -------- | ------------------- | - * | yAxisLabelPadding | Padding around y-axis labels | number | Optional | Any positive number | - * - * **Notes:** - * Default value: 5 - */ - yAxisLabelPadding: 5, - /** - * | Parameter | Description | Type | Required | Values | - * | ------------------ | ---------------------------------- | ------- | -------- | ------------------- | - * | yAxisLabelFontSize | y-axis label font size | number | Optional | Any positive number | - * - * **Notes:** - * Default value: 16 - */ - yAxisLabelFontSize: 16, - /** - * | Parameter | Description | Type | Required | Values | - * | ------------- | ------------------------------- | ------- | -------- | ------------------- | - * | yAxisPosition | position of y-axis labels | string | Optional | 'left' or 'right' | - * - * **Notes:** - * Default value: left - */ - yAxisPosition: 'left', - /** - * | Parameter | Description | Type | Required | Values | - * | ---------------------- | -------------------------------------- | ------- | -------- | ------------------- | - * | pointTextPadding | padding between point and point label | number | Optional | Any positive number | - * - * **Notes:** - * Default value: 5 - */ - pointTextPadding: 5, - /** - * | Parameter | Description | Type | Required | Values | - * | ---------------------- | ---------------------- | ------- | -------- | ------------------- | - * | pointTextPadding | point title font size | number | Optional | Any positive number | - * - * **Notes:** - * Default value: 12 - */ - pointLabelFontSize: 12, - /** - * | Parameter | Description | Type | Required | Values | - * | ------------- | ------------------------------- | ------- | -------- | ------------------- | - * | pointRadius | radius of the point to be drawn | number | Optional | Any positive number | - * - * **Notes:** - * Default value: 5 - */ - pointRadius: 5, - /** - * | Parameter | Description | Type | Required | Values | - * | ----------- | ----------- | ------- | -------- | ----------- | - * | useMaxWidth | See Notes | boolean | Required | true, false | - * - * **Notes:** - * - * When this flag is set to true, the diagram width is locked to 100% and scaled based on - * available space. If set to false, the diagram reserves its absolute width. - * - * Default value: true - */ - useMaxWidth: true, - }, - - /** The object containing configurations specific for req diagrams */ - requirement: { - useWidth: undefined, - - /** - * | Parameter | Description | Type | Required | Values | - * | ----------- | ----------- | ------- | -------- | ----------- | - * | useMaxWidth | See Notes | boolean | Required | true, false | - * - * **Notes:** - * - * When this flag is set to true, the diagram width is locked to 100% and scaled based on - * available space. If set to false, the diagram reserves its absolute width. - * - * Default value: true - */ - useMaxWidth: true, - - rect_fill: '#f9f9f9', - text_color: '#333', - rect_border_size: '0.5px', - rect_border_color: '#bbb', - rect_min_width: 200, - rect_min_height: 200, - fontSize: 14, - rect_padding: 10, - line_height: 20, - }, - gitGraph: { - /** - * ### titleTopMargin - * - * | Parameter | Description | Type | Required | Values | - * | -------------- | ---------------------------------------------- | ------- | -------- | ------------------ | - * | titleTopMargin | Margin top for the text over the Git diagram | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 25 - */ - titleTopMargin: 25, - diagramPadding: 8, - nodeLabel: { - width: 75, - height: 100, - x: -25, - y: 0, - }, - mainBranchName: 'main', - mainBranchOrder: 0, - showCommitLabel: true, - showBranches: true, - rotateCommitLabel: true, - }, - - /** The object containing configurations specific for c4 diagrams */ c4: { + ...defaultConfigJson.c4, useWidth: undefined, - - /** - * | Parameter | Description | Type | Required | Values | - * | -------------- | ---------------------------------------------- | ------- | -------- | ------------------ | - * | diagramMarginX | Margin to the right and left of the c4 diagram | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 50 - */ - diagramMarginX: 50, - - /** - * | Parameter | Description | Type | Required | Values | - * | -------------- | ------------------------------------------- | ------- | -------- | ------------------ | - * | diagramMarginY | Margin to the over and under the c4 diagram | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 10 - */ - diagramMarginY: 10, - - /** - * | Parameter | Description | Type | Required | Values | - * | ------------- | --------------------- | ------- | -------- | ------------------ | - * | c4ShapeMargin | Margin between shapes | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 50 - */ - c4ShapeMargin: 50, - - /** - * | Parameter | Description | Type | Required | Values | - * | -------------- | ---------------------- | ------- | -------- | ------------------ | - * | c4ShapePadding | Padding between shapes | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 20 - */ - c4ShapePadding: 20, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------- | --------------------- | ------- | -------- | ------------------ | - * | width | Width of person boxes | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 216 - */ - width: 216, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------- | ---------------------- | ------- | -------- | ------------------ | - * | height | Height of person boxes | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 60 - */ - height: 60, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------- | ------------------- | ------- | -------- | ------------------ | - * | boxMargin | Margin around boxes | Integer | Required | Any Positive Value | - * - * **Notes:** Default value: 10 - */ - boxMargin: 10, - - /** - * | Parameter | Description | Type | Required | Values | - * | ----------- | ----------- | ------- | -------- | ----------- | - * | useMaxWidth | See Notes | boolean | Required | true, false | - * - * **Notes:** When this flag is set to true, the height and width is set to 100% and is then - * scaling with the available space. If set to false, the absolute space required is used. - * - * Default value: true - */ - useMaxWidth: true, - - /** - * | Parameter | Description | Type | Required | Values | - * | ------------ | ----------- | ------- | -------- | ------------------ | - * | c4ShapeInRow | See Notes | Integer | Required | Any Positive Value | - * - * **Notes:** How many shapes to place in each row. - * - * Default value: 4 - */ - c4ShapeInRow: 4, - - nextLinePaddingX: 0, - - /** - * | Parameter | Description | Type | Required | Values | - * | --------------- | ----------- | ------- | -------- | ------------------ | - * | c4BoundaryInRow | See Notes | Integer | Required | Any Positive Value | - * - * **Notes:** How many boundaries to place in each row. - * - * Default value: 2 - */ - c4BoundaryInRow: 2, - - /** - * This sets the font size of Person shape for the diagram - * - * **Notes:** Default value: 14. - */ - personFontSize: 14, - /** - * This sets the font family of Person shape for the diagram - * - * **Notes:** Default value: "Open Sans", sans-serif. - */ - personFontFamily: '"Open Sans", sans-serif', - /** - * This sets the font weight of Person shape for the diagram - * - * **Notes:** Default value: normal. - */ - personFontWeight: 'normal', - - /** - * This sets the font size of External Person shape for the diagram - * - * **Notes:** Default value: 14. - */ - external_personFontSize: 14, - /** - * This sets the font family of External Person shape for the diagram - * - * **Notes:** Default value: "Open Sans", sans-serif. - */ - external_personFontFamily: '"Open Sans", sans-serif', - /** - * This sets the font weight of External Person shape for the diagram - * - * **Notes:** Default value: normal. - */ - external_personFontWeight: 'normal', - - /** - * This sets the font size of System shape for the diagram - * - * **Notes:** Default value: 14. - */ - systemFontSize: 14, - /** - * This sets the font family of System shape for the diagram - * - * **Notes:** Default value: "Open Sans", sans-serif. - */ - systemFontFamily: '"Open Sans", sans-serif', - /** - * This sets the font weight of System shape for the diagram - * - * **Notes:** Default value: normal. - */ - systemFontWeight: 'normal', - - /** - * This sets the font size of External System shape for the diagram - * - * **Notes:** Default value: 14. - */ - external_systemFontSize: 14, - /** - * This sets the font family of External System shape for the diagram - * - * **Notes:** Default value: "Open Sans", sans-serif. - */ - external_systemFontFamily: '"Open Sans", sans-serif', - /** - * This sets the font weight of External System shape for the diagram - * - * **Notes:** Default value: normal. - */ - external_systemFontWeight: 'normal', - - /** - * This sets the font size of System DB shape for the diagram - * - * **Notes:** Default value: 14. - */ - system_dbFontSize: 14, - /** - * This sets the font family of System DB shape for the diagram - * - * **Notes:** Default value: "Open Sans", sans-serif. - */ - system_dbFontFamily: '"Open Sans", sans-serif', - /** - * This sets the font weight of System DB shape for the diagram - * - * **Notes:** Default value: normal. - */ - system_dbFontWeight: 'normal', - - /** - * This sets the font size of External System DB shape for the diagram - * - * **Notes:** Default value: 14. - */ - external_system_dbFontSize: 14, - /** - * This sets the font family of External System DB shape for the diagram - * - * **Notes:** Default value: "Open Sans", sans-serif. - */ - external_system_dbFontFamily: '"Open Sans", sans-serif', - /** - * This sets the font weight of External System DB shape for the diagram - * - * **Notes:** Default value: normal. - */ - external_system_dbFontWeight: 'normal', - - /** - * This sets the font size of System Queue shape for the diagram - * - * **Notes:** Default value: 14. - */ - system_queueFontSize: 14, - /** - * This sets the font family of System Queue shape for the diagram - * - * **Notes:** Default value: "Open Sans", sans-serif. - */ - system_queueFontFamily: '"Open Sans", sans-serif', - /** - * This sets the font weight of System Queue shape for the diagram - * - * **Notes:** Default value: normal. - */ - system_queueFontWeight: 'normal', - - /** - * This sets the font size of External System Queue shape for the diagram - * - * **Notes:** Default value: 14. - */ - external_system_queueFontSize: 14, - /** - * This sets the font family of External System Queue shape for the diagram - * - * **Notes:** Default value: "Open Sans", sans-serif. - */ - external_system_queueFontFamily: '"Open Sans", sans-serif', - /** - * This sets the font weight of External System Queue shape for the diagram - * - * **Notes:** Default value: normal. - */ - external_system_queueFontWeight: 'normal', - - /** - * This sets the font size of Boundary shape for the diagram - * - * **Notes:** Default value: 14. - */ - boundaryFontSize: 14, - /** - * This sets the font family of Boundary shape for the diagram - * - * **Notes:** Default value: "Open Sans", sans-serif. - */ - boundaryFontFamily: '"Open Sans", sans-serif', - /** - * This sets the font weight of Boundary shape for the diagram - * - * **Notes:** Default value: normal. - */ - boundaryFontWeight: 'normal', - - /** - * This sets the font size of Message shape for the diagram - * - * **Notes:** Default value: 12. - */ - messageFontSize: 12, - /** - * This sets the font family of Message shape for the diagram - * - * **Notes:** Default value: "Open Sans", sans-serif. - */ - messageFontFamily: '"Open Sans", sans-serif', - /** - * This sets the font weight of Message shape for the diagram - * - * **Notes:** Default value: normal. - */ - messageFontWeight: 'normal', - - /** - * This sets the font size of Container shape for the diagram - * - * **Notes:** Default value: 14. - */ - containerFontSize: 14, - /** - * This sets the font family of Container shape for the diagram - * - * **Notes:** Default value: "Open Sans", sans-serif. - */ - containerFontFamily: '"Open Sans", sans-serif', - /** - * This sets the font weight of Container shape for the diagram - * - * **Notes:** Default value: normal. - */ - containerFontWeight: 'normal', - - /** - * This sets the font size of External Container shape for the diagram - * - * **Notes:** Default value: 14. - */ - external_containerFontSize: 14, - /** - * This sets the font family of External Container shape for the diagram - * - * **Notes:** Default value: "Open Sans", sans-serif. - */ - external_containerFontFamily: '"Open Sans", sans-serif', - /** - * This sets the font weight of External Container shape for the diagram - * - * **Notes:** Default value: normal. - */ - external_containerFontWeight: 'normal', - - /** - * This sets the font size of Container DB shape for the diagram - * - * **Notes:** Default value: 14. - */ - container_dbFontSize: 14, - /** - * This sets the font family of Container DB shape for the diagram - * - * **Notes:** Default value: "Open Sans", sans-serif. - */ - container_dbFontFamily: '"Open Sans", sans-serif', - /** - * This sets the font weight of Container DB shape for the diagram - * - * **Notes:** Default value: normal. - */ - container_dbFontWeight: 'normal', - - /** - * This sets the font size of External Container DB shape for the diagram - * - * **Notes:** Default value: 14. - */ - external_container_dbFontSize: 14, - /** - * This sets the font family of External Container DB shape for the diagram - * - * **Notes:** Default value: "Open Sans", sans-serif. - */ - external_container_dbFontFamily: '"Open Sans", sans-serif', - /** - * This sets the font weight of External Container DB shape for the diagram - * - * **Notes:** Default value: normal. - */ - external_container_dbFontWeight: 'normal', - - /** - * This sets the font size of Container Queue shape for the diagram - * - * **Notes:** Default value: 14. - */ - container_queueFontSize: 14, - /** - * This sets the font family of Container Queue shape for the diagram - * - * **Notes:** Default value: "Open Sans", sans-serif. - */ - container_queueFontFamily: '"Open Sans", sans-serif', - /** - * This sets the font weight of Container Queue shape for the diagram - * - * **Notes:** Default value: normal. - */ - container_queueFontWeight: 'normal', - - /** - * This sets the font size of External Container Queue shape for the diagram - * - * **Notes:** Default value: 14. - */ - external_container_queueFontSize: 14, - /** - * This sets the font family of External Container Queue shape for the diagram - * - * **Notes:** Default value: "Open Sans", sans-serif. - */ - external_container_queueFontFamily: '"Open Sans", sans-serif', - /** - * This sets the font weight of External Container Queue shape for the diagram - * - * **Notes:** Default value: normal. - */ - external_container_queueFontWeight: 'normal', - - /** - * This sets the font size of Component shape for the diagram - * - * **Notes:** Default value: 14. - */ - componentFontSize: 14, - /** - * This sets the font family of Component shape for the diagram - * - * **Notes:** Default value: "Open Sans", sans-serif. - */ - componentFontFamily: '"Open Sans", sans-serif', - /** - * This sets the font weight of Component shape for the diagram - * - * **Notes:** Default value: normal. - */ - componentFontWeight: 'normal', - - /** - * This sets the font size of External Component shape for the diagram - * - * **Notes:** Default value: 14. - */ - external_componentFontSize: 14, - /** - * This sets the font family of External Component shape for the diagram - * - * **Notes:** Default value: "Open Sans", sans-serif. - */ - external_componentFontFamily: '"Open Sans", sans-serif', - /** - * This sets the font weight of External Component shape for the diagram - * - * **Notes:** Default value: normal. - */ - external_componentFontWeight: 'normal', - - /** - * This sets the font size of Component DB shape for the diagram - * - * **Notes:** Default value: 14. - */ - component_dbFontSize: 14, - /** - * This sets the font family of Component DB shape for the diagram - * - * **Notes:** Default value: "Open Sans", sans-serif. - */ - component_dbFontFamily: '"Open Sans", sans-serif', - /** - * This sets the font weight of Component DB shape for the diagram - * - * **Notes:** Default value: normal. - */ - component_dbFontWeight: 'normal', - - /** - * This sets the font size of External Component DB shape for the diagram - * - * **Notes:** Default value: 14. - */ - external_component_dbFontSize: 14, - /** - * This sets the font family of External Component DB shape for the diagram - * - * **Notes:** Default value: "Open Sans", sans-serif. - */ - external_component_dbFontFamily: '"Open Sans", sans-serif', - /** - * This sets the font weight of External Component DB shape for the diagram - * - * **Notes:** Default value: normal. - */ - external_component_dbFontWeight: 'normal', - - /** - * This sets the font size of Component Queue shape for the diagram - * - * **Notes:** Default value: 14. - */ - component_queueFontSize: 14, - /** - * This sets the font family of Component Queue shape for the diagram - * - * **Notes:** Default value: "Open Sans", sans-serif. - */ - component_queueFontFamily: '"Open Sans", sans-serif', - /** - * This sets the font weight of Component Queue shape for the diagram - * - * **Notes:** Default value: normal. - */ - component_queueFontWeight: 'normal', - - /** - * This sets the font size of External Component Queue shape for the diagram - * - * **Notes:** Default value: 14. - */ - external_component_queueFontSize: 14, - /** - * This sets the font family of External Component Queue shape for the diagram - * - * **Notes:** Default value: "Open Sans", sans-serif. - */ - external_component_queueFontFamily: '"Open Sans", sans-serif', - /** - * This sets the font weight of External Component Queue shape for the diagram - * - * **Notes:** Default value: normal. - */ - external_component_queueFontWeight: 'normal', - - /** - * This sets the auto-wrap state for the diagram - * - * **Notes:** Default value: true. - */ - wrap: true, - - /** - * This sets the auto-wrap padding for the diagram (sides only) - * - * **Notes:** Default value: 0. - */ - wrapPadding: 10, - personFont: function () { return { fontFamily: this.personFontFamily, @@ -2221,72 +229,30 @@ const config: Partial = { fontWeight: this.messageFontWeight, }; }, - - // ' Colors - // ' ################################## - person_bg_color: '#08427B', - person_border_color: '#073B6F', - external_person_bg_color: '#686868', - external_person_border_color: '#8A8A8A', - system_bg_color: '#1168BD', - system_border_color: '#3C7FC0', - system_db_bg_color: '#1168BD', - system_db_border_color: '#3C7FC0', - system_queue_bg_color: '#1168BD', - system_queue_border_color: '#3C7FC0', - external_system_bg_color: '#999999', - external_system_border_color: '#8A8A8A', - external_system_db_bg_color: '#999999', - external_system_db_border_color: '#8A8A8A', - external_system_queue_bg_color: '#999999', - external_system_queue_border_color: '#8A8A8A', - container_bg_color: '#438DD5', - container_border_color: '#3C7FC0', - container_db_bg_color: '#438DD5', - container_db_border_color: '#3C7FC0', - container_queue_bg_color: '#438DD5', - container_queue_border_color: '#3C7FC0', - external_container_bg_color: '#B3B3B3', - external_container_border_color: '#A6A6A6', - external_container_db_bg_color: '#B3B3B3', - external_container_db_border_color: '#A6A6A6', - external_container_queue_bg_color: '#B3B3B3', - external_container_queue_border_color: '#A6A6A6', - component_bg_color: '#85BBF0', - component_border_color: '#78A8D8', - component_db_bg_color: '#85BBF0', - component_db_border_color: '#78A8D8', - component_queue_bg_color: '#85BBF0', - component_queue_border_color: '#78A8D8', - external_component_bg_color: '#CCCCCC', - external_component_border_color: '#BFBFBF', - external_component_db_bg_color: '#CCCCCC', - external_component_db_border_color: '#BFBFBF', - external_component_queue_bg_color: '#CCCCCC', - external_component_queue_border_color: '#BFBFBF', }, - mindmap: { - useMaxWidth: true, - padding: 10, - maxNodeWidth: 200, + pie: { + ...defaultConfigJson.pie, + useWidth: undefined, }, - sankey: { - width: 600, - height: 400, - linkColor: 'gradient', - nodeAlignment: 'justify', + requirement: { + ...defaultConfigJson.requirement, + useWidth: undefined, + }, + gitGraph: { + ...defaultConfigJson.gitGraph, + // TODO: This is a temporary override for `gitGraph`, since every other + // diagram does have `useMaxWidth`, but instead sets it to `true`. + // Should we set this to `true` instead? + useMaxWidth: false, + }, + sankey: { + ...defaultConfigJson.sankey, + // this is false, unlike every other diagram (other than gitGraph) + // TODO: can we make this default to `true` instead? useMaxWidth: false, }, - fontSize: 16, }; -if (config.class) { - config.class.arrowMarkerAbsolute = config.arrowMarkerAbsolute; -} -if (config.gitGraph) { - config.gitGraph.arrowMarkerAbsolute = config.arrowMarkerAbsolute; -} - const keyify = (obj: any, prefix = ''): string[] => Object.keys(obj).reduce((res: string[], el): string[] => { if (Array.isArray(obj[el])) { diff --git a/packages/mermaid/src/diagrams/flowchart/flowDb.js b/packages/mermaid/src/diagrams/flowchart/flowDb.js index ceb933e85..ea8fa71d2 100644 --- a/packages/mermaid/src/diagrams/flowchart/flowDb.js +++ b/packages/mermaid/src/diagrams/flowchart/flowDb.js @@ -342,7 +342,10 @@ export const setLink = function (ids, linkStr, target) { setClass(ids, 'clickable'); }; export const getTooltip = function (id) { - return tooltips[id]; + if (tooltips.hasOwnProperty(id)) { + return tooltips[id]; + } + return undefined; }; /** @@ -443,7 +446,7 @@ export const clear = function (ver = 'gen-1') { subGraphs = []; subGraphLookup = {}; subCount = 0; - tooltips = []; + tooltips = {}; firstGraphFlag = true; version = ver; commonClear(); diff --git a/packages/mermaid/src/diagrams/quadrant-chart/quadrantBuilder.ts b/packages/mermaid/src/diagrams/quadrant-chart/quadrantBuilder.ts index 8168551ad..9c1162762 100644 --- a/packages/mermaid/src/diagrams/quadrant-chart/quadrantBuilder.ts +++ b/packages/mermaid/src/diagrams/quadrant-chart/quadrantBuilder.ts @@ -1,7 +1,7 @@ // @ts-ignore: TODO Fix ts errors import { scaleLinear } from 'd3'; import { log } from '../../logger.js'; -import { QuadrantChartConfig } from '../../config.type.js'; +import type { BaseDiagramConfig, QuadrantChartConfig } from '../../config.type.js'; import defaultConfig from '../../defaultConfig.js'; import { getThemeVariables } from '../../themes/theme-default.js'; @@ -71,7 +71,8 @@ export interface quadrantBuilderData { points: QuadrantPointInputType[]; } -export interface QuadrantBuilderConfig extends QuadrantChartConfig { +export interface QuadrantBuilderConfig + extends Required> { showXAxis: boolean; showYAxis: boolean; showTitle: boolean; diff --git a/packages/mermaid/src/docs.mts b/packages/mermaid/src/docs.mts index f6efc1169..356cd3cd1 100644 --- a/packages/mermaid/src/docs.mts +++ b/packages/mermaid/src/docs.mts @@ -34,7 +34,7 @@ import { readFileSync, writeFileSync, mkdirSync, existsSync, rmSync, rmdirSync } import { exec } from 'child_process'; import { globby } from 'globby'; import { JSDOM } from 'jsdom'; -import type { Code, Root } from 'mdast'; +import type { Code, ListItem, Root, Text } from 'mdast'; import { posix, dirname, relative, join } from 'path'; import prettier from 'prettier'; import { remark } from 'remark'; @@ -44,6 +44,7 @@ import chokidar from 'chokidar'; import mm from 'micromatch'; // @ts-ignore No typescript declaration file import flatmap from 'unist-util-flatmap'; +import { visit } from 'unist-util-visit'; const MERMAID_MAJOR_VERSION = ( JSON.parse(readFileSync('../mermaid/package.json', 'utf8')).version as string @@ -150,6 +151,7 @@ const copyTransformedContents = (filename: string, doCopy = false, transformedCo } filesTransformed.add(fileInFinalDocDir); + if (doCopy) { writeFileSync(fileInFinalDocDir, newBuffer); } @@ -321,6 +323,123 @@ const transformMarkdown = (file: string) => { copyTransformedContents(file, !verifyOnly, formatted); }; +import { load, JSON_SCHEMA } from 'js-yaml'; +// @ts-ignore: we're importing internal jsonschema2md functions +import { default as schemaLoader } from '@adobe/jsonschema2md/lib/schemaProxy.js'; +// @ts-ignore: we're importing internal jsonschema2md functions +import { default as traverseSchemas } from '@adobe/jsonschema2md/lib/traverseSchema.js'; +// @ts-ignore: we're importing internal jsonschema2md functions +import { default as buildMarkdownFromSchema } from '@adobe/jsonschema2md/lib/markdownBuilder.js'; +// @ts-ignore: we're importing internal jsonschema2md functions +import { default as jsonSchemaReadmeBuilder } from '@adobe/jsonschema2md/lib/readmeBuilder.js'; + +/** + * Transforms the given JSON Schema into Markdown documentation + */ +async function transormJsonSchema(file: string) { + const yamlContents = readSyncedUTF8file(file); + const jsonSchema = load(yamlContents, { + filename: file, + // only allow JSON types in our YAML doc (will probably be default in YAML 1.3) + // e.g. `true` will be parsed a boolean `true`, `True` will be parsed as string `"True"`. + schema: JSON_SCHEMA, + }); + + /** Location of the `schema.yaml` files */ + const SCHEMA_INPUT_DIR = 'src/schemas/'; + /** + * Location to store the generated `schema.json` file for the website + * + * Because Vitepress doesn't handle bundling `.json` files properly, we need + * to instead place it into a `public/` subdirectory. + */ + const SCHEMA_OUTPUT_DIR = 'src/docs/public/schemas/'; + const VITEPRESS_PUBLIC_DIR = 'src/docs/public'; + /** + * Location to store the generated Schema Markdown docs. + * Links to JSON Schemas should automatically be rewritten to point to + * `SCHEMA_OUTPUT_DIR`. + */ + const SCHEMA_MARKDOWN_OUTPUT_DIR = join('src', 'docs', 'config', 'schema-docs'); + + // write .schema.json files + const jsonFileName = file + .replace('.schema.yaml', '.schema.json') + .replace(SCHEMA_INPUT_DIR, SCHEMA_OUTPUT_DIR); + copyTransformedContents(jsonFileName, !verifyOnly, JSON.stringify(jsonSchema, undefined, 2)); + + const schemas = traverseSchemas([schemaLoader()(jsonFileName, jsonSchema)]); + + // ignore output of this function + // for some reason, without calling this function, we get some broken links + // this is probably a bug in @adobe/jsonschema2md + jsonSchemaReadmeBuilder({ readme: true })(schemas); + + // write Markdown files + const markdownFiles = buildMarkdownFromSchema({ + header: true, + // links, + includeProperties: ['tsType'], // Custom TypeScript type + exampleFormat: 'json', + // skipProperties, + /** + * Automatically rewrite schema paths passed to `schemaLoader` + * (e.g. src/docs/schemas/config.schema.json) + * to relative links (e.g. /schemas/config.schema.json) + * + * See https://vitepress.vuejs.org/guide/asset-handling + * + * @param origin - Original schema path (relative to this script). + * @returns New absolute Vitepress path to schema + */ + rewritelinks: (origin: string) => { + return `/${relative(VITEPRESS_PUBLIC_DIR, origin)}`; + }, + })(schemas); + + for (const [name, markdownAst] of Object.entries(markdownFiles)) { + /* + * Converts list entries of shape '- tsType: () => Partial' + * into '- tsType: `() => Partial`' (e.g. escaping with back-ticks), + * as otherwise VitePress doesn't like the bit. + */ + visit(markdownAst as Root, 'listItem', (listEntry: ListItem) => { + let listText: Text; + const blockItem = listEntry.children[0]; + if (blockItem.type === 'paragraph' && blockItem.children[0].type === 'text') { + listText = blockItem.children[0]; + } // @ts-expect-error: MD AST output from @adobe/jsonschema2md is technically wrong + else if (blockItem.type === 'text') { + listText = blockItem; + } else { + return; // skip + } + + if (listText.value.startsWith('tsType: ')) { + listText.value = listText.value.replace(/tsType: (.*)/g, 'tsType: `$1`'); + } + }); + + const transformed = remark() + .use(remarkGfm) + .use(remarkFrontmatter, ['yaml']) // support YAML front-matter in Markdown + .use(transformMarkdownAst, { + // mermaid project specific plugin + originalFilename: file, + addAutogeneratedWarning: !noHeader, + removeYAML: !noHeader, + }) + .stringify(markdownAst as Root); + + const formatted = prettier.format(transformed, { + parser: 'markdown', + ...prettierConfig, + }); + const newFileName = join(SCHEMA_MARKDOWN_OUTPUT_DIR, `${name}.md`); + copyTransformedContents(newFileName, !verifyOnly, formatted); + } +} + /** * Transform an HTML file and write the transformed file to the directory for published * documentation @@ -362,15 +481,15 @@ const transformHtml = (filename: string) => { }; const getGlobs = (globs: string[]): string[] => { - globs.push( - '!**/dist/**', - '!**/redirect.spec.ts', - '!**/landing/**', - '!**/node_modules/**', - '!**/user-avatars/**' - ); + globs.push('!**/dist/**', '!**/redirect.spec.ts', '!**/landing/**', '!**/node_modules/**'); if (!vitepress) { - globs.push('!**/.vitepress/**', '!**/vite.config.ts', '!src/docs/index.md', '!**/package.json'); + globs.push( + '!**/.vitepress/**', + '!**/vite.config.ts', + '!src/docs/index.md', + '!**/package.json', + '!**/user-avatars/**' + ); } return globs; }; @@ -388,6 +507,14 @@ const main = async () => { const sourceDirGlob = posix.join('.', SOURCE_DOCS_DIR, '**'); const action = verifyOnly ? 'Verifying' : 'Transforming'; + if (vitepress) { + console.log(`${action} 1 .schema.yaml file`); + await transormJsonSchema('src/schemas/config.schema.yaml'); + } else { + // skip because this creates so many Markdown files that it lags git + console.log('Skipping 1 .schema.yaml file'); + } + const mdFileGlobs = getGlobs([posix.join(sourceDirGlob, '*.md')]); const mdFiles = await getFilesFromGlobs(mdFileGlobs); console.log(`${action} ${mdFiles.length} markdown files...`); diff --git a/packages/mermaid/src/docs/.vitepress/components/HomePage.vue b/packages/mermaid/src/docs/.vitepress/components/HomePage.vue index 19f3912a7..b6998f249 100644 --- a/packages/mermaid/src/docs/.vitepress/components/HomePage.vue +++ b/packages/mermaid/src/docs/.vitepress/components/HomePage.vue @@ -16,8 +16,12 @@ import { teamMembers } from '../contributors';


- Join the community and - get involved! + Join the community + and get involved!

diff --git a/packages/mermaid/src/docs/.vitepress/config.ts b/packages/mermaid/src/docs/.vitepress/config.ts index 2b2914ca3..330b088d9 100644 --- a/packages/mermaid/src/docs/.vitepress/config.ts +++ b/packages/mermaid/src/docs/.vitepress/config.ts @@ -155,6 +155,7 @@ function sidebarConfig() { { text: 'Tutorials', link: '/config/Tutorials' }, { text: 'API-Usage', link: '/config/usage' }, { text: 'Mermaid API Configuration', link: '/config/setup/README' }, + { text: 'Mermaid Configuration Options', link: '/config/schema-docs/config' }, { text: 'Directives', link: '/config/directives' }, { text: 'Theming', link: '/config/theming' }, { text: 'Accessibility', link: '/config/accessibility' }, diff --git a/packages/mermaid/src/docs/.vitepress/contributors.ts b/packages/mermaid/src/docs/.vitepress/contributors.ts index bef2c1311..93eeee2e2 100644 --- a/packages/mermaid/src/docs/.vitepress/contributors.ts +++ b/packages/mermaid/src/docs/.vitepress/contributors.ts @@ -1,30 +1,5 @@ import contributorUsernamesJson from './contributor-names.json'; - -export interface Contributor { - name: string; - avatar: string; -} - -export interface SocialEntry { - icon: string | { svg: string }; - link: string; -} - -export interface CoreTeam { - name: string; - // required to download avatars from GitHub - github: string; - avatar?: string; - twitter?: string; - mastodon?: string; - sponsor?: string; - website?: string; - linkedIn?: string; - title?: string; - org?: string; - desc?: string; - links?: SocialEntry[]; -} +import { CoreTeam, knut, plainTeamMembers } from './teamMembers.js'; const contributorUsernames: string[] = contributorUsernamesJson; @@ -38,6 +13,7 @@ const websiteSVG = { const createLinks = (tm: CoreTeam): CoreTeam => { tm.avatar = `/user-avatars/${tm.github}.png`; + tm.title = tm.title ?? 'Developer'; tm.links = [{ icon: 'github', link: `https://github.com/${tm.github}` }]; if (tm.mastodon) { tm.links.push({ icon: 'mastodon', link: tm.mastodon }); @@ -54,91 +30,6 @@ const createLinks = (tm: CoreTeam): CoreTeam => { return tm; }; -const knut: CoreTeam = { - github: 'knsv', - name: 'Knut Sveidqvist', - title: 'Creator', - twitter: 'knutsveidqvist', - sponsor: 'https://github.com/sponsors/knsv', -}; - -const plainTeamMembers: CoreTeam[] = [ - { - github: 'NeilCuzon', - name: 'Neil Cuzon', - title: 'Developer', - }, - { - github: 'tylerlong', - name: 'Tyler Liu', - title: 'Developer', - }, - { - github: 'sidharthv96', - name: 'Sidharth Vinod', - title: 'Developer', - twitter: 'sidv42', - mastodon: 'https://techhub.social/@sidv', - sponsor: 'https://github.com/sponsors/sidharthv96', - linkedIn: 'sidharth-vinod', - website: 'https://sidharth.dev', - }, - { - github: 'ashishjain0512', - name: 'Ashish Jain', - title: 'Developer', - }, - { - github: 'mmorel-35', - name: 'Matthieu Morel', - title: 'Developer', - linkedIn: 'matthieumorel35', - }, - { - github: 'aloisklink', - name: 'Alois Klink', - title: 'Developer', - linkedIn: 'aloisklink', - website: 'https://aloisklink.com', - }, - { - github: 'pbrolin47', - name: 'Per Brolin', - title: 'Developer', - }, - { - github: 'Yash-Singh1', - name: 'Yash Singh', - title: 'Developer', - }, - { - github: 'GDFaber', - name: 'Marc Faber', - title: 'Developer', - linkedIn: 'marc-faber', - }, - { - github: 'MindaugasLaganeckas', - name: 'Mindaugas Laganeckas', - title: 'Developer', - }, - { - github: 'jgreywolf', - name: 'Justin Greywolf', - title: 'Developer', - }, - { - github: 'IOrlandoni', - name: 'Nacho Orlandoni', - title: 'Developer', - }, - { - github: 'huynhicode', - name: 'Steph Huynh', - title: 'Developer', - }, -]; - const teamMembers = plainTeamMembers.map((tm) => createLinks(tm)); teamMembers.sort( (a, b) => contributorUsernames.indexOf(a.github) - contributorUsernames.indexOf(b.github) diff --git a/packages/mermaid/src/docs/.vitepress/mermaid-markdown-all.ts b/packages/mermaid/src/docs/.vitepress/mermaid-markdown-all.ts index 14340462c..30f044d98 100644 --- a/packages/mermaid/src/docs/.vitepress/mermaid-markdown-all.ts +++ b/packages/mermaid/src/docs/.vitepress/mermaid-markdown-all.ts @@ -54,6 +54,15 @@ const MermaidExample = async (md: MarkdownRenderer) => { return `

NOTE

${token.content}}

`; } + if (token.info.trim() === 'regexp') { + // shiki doesn't yet support regexp code blocks, but the javascript + // one still makes RegExes look good + token.info = 'javascript'; + // use trimEnd to move trailing `\n` outside if the JavaScript regex `/` block + token.content = `/${token.content.trimEnd()}/\n`; + return defaultRenderer(tokens, index, options, env, slf); + } + if (token.info.trim() === 'jison') { return `
diff --git a/packages/mermaid/src/docs/.vitepress/scripts/fetch-avatars.ts b/packages/mermaid/src/docs/.vitepress/scripts/fetch-avatars.ts index 47f371fee..cd78be782 100644 --- a/packages/mermaid/src/docs/.vitepress/scripts/fetch-avatars.ts +++ b/packages/mermaid/src/docs/.vitepress/scripts/fetch-avatars.ts @@ -19,6 +19,10 @@ async function download(url: string, fileName: URL) { await writeFile(fileName, Buffer.from(await image.arrayBuffer())); } catch (error) { console.error('failed to load', url, error); + // Exit the build process if we are in CI + if (process.env.CI) { + throw error; + } } } @@ -32,7 +36,7 @@ async function fetchAvatars() { download(`https://github.com/${name}.png?size=100`, getAvatarPath(name)); }); - await Promise.all(avatars); + await Promise.allSettled(avatars); } fetchAvatars(); diff --git a/packages/mermaid/src/docs/.vitepress/scripts/fetch-contributors.ts b/packages/mermaid/src/docs/.vitepress/scripts/fetch-contributors.ts index a810fc30f..da7621b29 100644 --- a/packages/mermaid/src/docs/.vitepress/scripts/fetch-contributors.ts +++ b/packages/mermaid/src/docs/.vitepress/scripts/fetch-contributors.ts @@ -1,6 +1,8 @@ // Adapted from https://github.dev/vitest-dev/vitest/blob/991ff33ab717caee85ef6cbe1c16dc514186b4cc/scripts/update-contributors.ts#L6 import { writeFile } from 'node:fs/promises'; +import { knut, plainTeamMembers } from '../teamMembers.js'; +import { existsSync } from 'node:fs'; const pathContributors = new URL('../contributor-names.json', import.meta.url); @@ -35,7 +37,15 @@ async function fetchContributors() { } async function generate() { - const collaborators = await fetchContributors(); + if (existsSync(pathContributors)) { + // Only fetch contributors once, when running locally. + // In CI, the file won't exist, so it'll fetch every time as expected. + return; + } + // Will fetch all contributors only in CI to speed up local development. + const collaborators = process.env.CI + ? await fetchContributors() + : [knut, ...plainTeamMembers].map((m) => m.github); await writeFile(pathContributors, JSON.stringify(collaborators, null, 2) + '\n', 'utf8'); } diff --git a/packages/mermaid/src/docs/.vitepress/teamMembers.ts b/packages/mermaid/src/docs/.vitepress/teamMembers.ts new file mode 100644 index 000000000..d95f49ed8 --- /dev/null +++ b/packages/mermaid/src/docs/.vitepress/teamMembers.ts @@ -0,0 +1,105 @@ +export interface Contributor { + name: string; + avatar: string; +} + +export interface SocialEntry { + icon: string | { svg: string }; + link: string; +} + +export interface CoreTeam { + name: string; + // required to download avatars from GitHub + github: string; + avatar?: string; + twitter?: string; + mastodon?: string; + sponsor?: string; + website?: string; + linkedIn?: string; + title?: string; + org?: string; + desc?: string; + links?: SocialEntry[]; +} + +export const knut: CoreTeam = { + github: 'knsv', + name: 'Knut Sveidqvist', + title: 'Creator', + twitter: 'knutsveidqvist', + sponsor: 'https://github.com/sponsors/knsv', +}; + +export const plainTeamMembers: CoreTeam[] = [ + { + github: 'NeilCuzon', + name: 'Neil Cuzon', + }, + { + github: 'tylerlong', + name: 'Tyler Liu', + }, + { + github: 'sidharthv96', + name: 'Sidharth Vinod', + twitter: 'sidv42', + mastodon: 'https://techhub.social/@sidv', + sponsor: 'https://github.com/sponsors/sidharthv96', + linkedIn: 'sidharth-vinod', + website: 'https://sidharth.dev', + }, + { + github: 'ashishjain0512', + name: 'Ashish Jain', + }, + { + github: 'mmorel-35', + name: 'Matthieu Morel', + linkedIn: 'matthieumorel35', + }, + { + github: 'aloisklink', + name: 'Alois Klink', + linkedIn: 'aloisklink', + website: 'https://aloisklink.com', + }, + { + github: 'pbrolin47', + name: 'Per Brolin', + }, + { + github: 'Yash-Singh1', + name: 'Yash Singh', + }, + { + github: 'GDFaber', + name: 'Marc Faber', + linkedIn: 'marc-faber', + }, + { + github: 'MindaugasLaganeckas', + name: 'Mindaugas Laganeckas', + }, + { + github: 'jgreywolf', + name: 'Justin Greywolf', + }, + { + github: 'IOrlandoni', + name: 'Nacho Orlandoni', + }, + { + github: 'huynhicode', + name: 'Steph Huynh', + }, + { + github: 'Yokozuna59', + name: 'Reda Al Sulais', + }, + { + github: 'nirname', + name: 'Nikolay Rozhkov', + }, +]; diff --git a/packages/mermaid/src/docs/news/announcements.md b/packages/mermaid/src/docs/news/announcements.md index 83dafaab6..b8d0669ec 100644 --- a/packages/mermaid/src/docs/news/announcements.md +++ b/packages/mermaid/src/docs/news/announcements.md @@ -1,7 +1,7 @@ # Announcements -## [Sequence diagrams, the only good thing UML brought to software development](https://www.mermaidchart.com/blog/posts/sequence-diagrams-the-good-thing-uml-brought-to-software-development/) +## [Mermaid Chart’s ChatGPT Plugin Combines Generative AI and Smart Diagramming For Users](https://www.mermaidchart.com/blog/posts/mermaid-chart-chatgpt-plugin-combines-generative-ai-and-smart-diagramming) -15 June 2023 · 12 mins +29 June 2023 · 4 mins -Sequence diagrams really shine when you’re documenting different parts of a system and the various ways these parts interact with each other. +Mermaid Chart’s new ChatGPT plugin integrates AI-powered text prompts with Mermaid’s intuitive diagramming editor, enabling users to generate, edit, and share complex diagrams with ease and efficiency. diff --git a/packages/mermaid/src/docs/news/blog.md b/packages/mermaid/src/docs/news/blog.md index 61d53656d..b536cb87e 100644 --- a/packages/mermaid/src/docs/news/blog.md +++ b/packages/mermaid/src/docs/news/blog.md @@ -1,5 +1,11 @@ # Blog +## [Mermaid Chart’s ChatGPT Plugin Combines Generative AI and Smart Diagramming For Users](https://www.mermaidchart.com/blog/posts/mermaid-chart-chatgpt-plugin-combines-generative-ai-and-smart-diagramming) + +29 June 2023 · 4 mins + +Mermaid Chart’s new ChatGPT plugin integrates AI-powered text prompts with Mermaid’s intuitive diagramming editor, enabling users to generate, edit, and share complex diagrams with ease and efficiency. + ## [Sequence diagrams, the only good thing UML brought to software development](https://www.mermaidchart.com/blog/posts/sequence-diagrams-the-good-thing-uml-brought-to-software-development/) 15 June 2023 · 12 mins diff --git a/packages/mermaid/src/docs/package.json b/packages/mermaid/src/docs/package.json index 6e1934022..4529a7622 100644 --- a/packages/mermaid/src/docs/package.json +++ b/packages/mermaid/src/docs/package.json @@ -4,6 +4,7 @@ "type": "module", "scripts": { "dev": "vitepress --port 3333 --open", + "dev:docker": "vitepress --port 3333 --host", "build": "pnpm prefetch && vitepress build", "build-no-prefetch": "vitepress build", "serve": "vitepress serve", diff --git a/packages/mermaid/src/docs/syntax/flowchart.md b/packages/mermaid/src/docs/syntax/flowchart.md index 80cb242d6..2e3d78c30 100644 --- a/packages/mermaid/src/docs/syntax/flowchart.md +++ b/packages/mermaid/src/docs/syntax/flowchart.md @@ -676,6 +676,16 @@ flowchart LR classDef someclass fill:#f96 ``` +This form can be used when declaring multiple links between nodes: + +```mermaid-example +flowchart LR + A:::foo & B:::bar --> C:::foobar + classDef foo stroke:#f00 + classDef bar stroke:#0f0 + classDef foobar stroke:#00f +``` + ### Css classes It is also possible to predefine classes in css styles that can be applied from the graph definition as in the example diff --git a/packages/mermaid/src/oldDefaultConfig.ts b/packages/mermaid/src/oldDefaultConfig.ts new file mode 100644 index 000000000..fbbd39f2a --- /dev/null +++ b/packages/mermaid/src/oldDefaultConfig.ts @@ -0,0 +1,2306 @@ +/** + * Temporary file for testing whether the new mermaid configuration defined in + * packages/mermaid/src/schemas/config.schema.yaml has the exact same default config. + */ + +import theme from './themes/index.js'; +import { type MermaidConfig } from './config.type.js'; +/** + * **Configuration methods in Mermaid version 8.6.0 have been updated, to learn more[[click + * here](8.6.0_docs.md)].** + * + * ## **What follows are config instructions for older versions** + * + * These are the default options which can be overridden with the initialization call like so: + * + * **Example 1:** + * + * ```js + * mermaid.initialize({ flowchart:{ htmlLabels: false } }); + * ``` + * + * **Example 2:** + * + * ```html + * + * ``` + * + * A summary of all options and their defaults is found [here](#mermaidapi-configuration-defaults). + * A description of each option follows below. + */ +const config: Partial = { + /** + * Theme , the CSS style sheet + * + * | Parameter | Description | Type | Required | Values | + * | --------- | --------------- | ------ | -------- | ---------------------------------------------- | + * | theme | Built in Themes | string | Optional | 'default', 'forest', 'dark', 'neutral', 'null' | + * + * **Notes:** To disable any pre-defined mermaid theme, use "null". + * + * @example + * + * ```js + * { + * "theme": "forest", + * "themeCSS": ".node rect { fill: red; }" + * } + * ``` + */ + theme: 'default', + themeVariables: theme['default'].getThemeVariables(), + themeCSS: undefined, + /* **maxTextSize** - The maximum allowed size of the users text diagram */ + maxTextSize: 50000, + darkMode: false, + + /** + * | Parameter | Description | Type | Required | Values | + * | ---------- | ------------------------------------------------------ | ------ | -------- | --------------------------- | + * | fontFamily | specifies the font to be used in the rendered diagrams | string | Required | Any Possible CSS FontFamily | + * + * **Notes:** Default value: '"trebuchet ms", verdana, arial, sans-serif;'. + */ + fontFamily: '"trebuchet ms", verdana, arial, sans-serif;', + + /** + * | Parameter | Description | Type | Required | Values | + * | --------- | ----------------------------------------------------- | ---------------- | -------- | --------------------------------------------- | + * | logLevel | This option decides the amount of logging to be used. | string \| number | Required | 'trace','debug','info','warn','error','fatal' | + * + * **Notes:** + * + * - Trace: 0 + * - Debug: 1 + * - Info: 2 + * - Warn: 3 + * - Error: 4 + * - Fatal: 5 (default) + */ + logLevel: 5, + + /** + * | Parameter | Description | Type | Required | Values | + * | ------------- | --------------------------------- | ------ | -------- | ------------------------------------------ | + * | securityLevel | Level of trust for parsed diagram | string | Required | 'sandbox', 'strict', 'loose', 'antiscript' | + * + * **Notes**: + * + * - **strict**: (**default**) HTML tags in the text are encoded and click functionality is disabled. + * - **antiscript**: HTML tags in text are allowed (only script elements are removed), and click + * functionality is enabled. + * - **loose**: HTML tags in text are allowed and click functionality is enabled. + * - **sandbox**: With this security level, all rendering takes place in a sandboxed iframe. This + * prevent any JavaScript from running in the context. This may hinder interactive functionality + * of the diagram, like scripts, popups in the sequence diagram, links to other tabs or targets, etc. + */ + securityLevel: 'strict', + + /** + * | Parameter | Description | Type | Required | Values | + * | ----------- | -------------------------------------------- | ------- | -------- | ----------- | + * | startOnLoad | Dictates whether mermaid starts on Page load | boolean | Required | true, false | + * + * **Notes:** Default value: true + */ + startOnLoad: true, + + /** + * | Parameter | Description | Type | Required | Values | + * | ------------------- | ---------------------------------------------------------------------------- | ------- | -------- | ----------- | + * | arrowMarkerAbsolute | Controls whether or arrow markers in html code are absolute paths or anchors | boolean | Required | true, false | + * + * **Notes**: + * + * This matters if you are using base tag settings. + * + * Default value: false + */ + arrowMarkerAbsolute: false, + + /** + * This option controls which currentConfig keys are considered _secure_ and can only be changed + * via call to mermaidAPI.initialize. Calls to mermaidAPI.reinitialize cannot make changes to the + * `secure` keys in the current currentConfig. This prevents malicious graph directives from + * overriding a site's default security. + * + * **Notes**: + * + * Default value: ['secure', 'securityLevel', 'startOnLoad', 'maxTextSize'] + */ + secure: ['secure', 'securityLevel', 'startOnLoad', 'maxTextSize'], + /** + * This option controls if the generated ids of nodes in the SVG are generated randomly or based + * on a seed. If set to false, the IDs are generated based on the current date and thus are not + * deterministic. This is the default behavior. + * + * **Notes**: + * + * This matters if your files are checked into source control e.g. git and should not change unless + * content is changed. + * + * Default value: false + */ + deterministicIds: false, + + /** + * This option is the optional seed for deterministic ids. if set to undefined but + * deterministicIds is true, a simple number iterator is used. You can set this attribute to base + * the seed on a static string. + */ + deterministicIDSeed: undefined, + + /** The object containing configurations specific for flowcharts */ + flowchart: { + /** + * ### titleTopMargin + * + * | Parameter | Description | Type | Required | Values | + * | -------------- | ---------------------------------------------- | ------- | -------- | ------------------ | + * | titleTopMargin | Margin top for the text over the flowchart | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 25 + */ + titleTopMargin: 25, + + /** + * | Parameter | Description | Type | Required | Values | + * | -------------- | ----------------------------------------------- | ------- | -------- | ------------------ | + * | diagramPadding | Amount of padding around the diagram as a whole | Integer | Required | Any Positive Value | + * + * **Notes:** + * + * The amount of padding around the diagram as a whole so that embedded diagrams have margins, + * expressed in pixels + * + * Default value: 8 + */ + diagramPadding: 8, + + /** + * | Parameter | Description | Type | Required | Values | + * | ---------- | -------------------------------------------------------------------------------------------- | ------- | -------- | ----------- | + * | htmlLabels | Flag for setting whether or not a html tag should be used for rendering labels on the edges. | boolean | Required | true, false | + * + * **Notes:** Default value: true. + */ + htmlLabels: true, + + /** + * | Parameter | Description | Type | Required | Values | + * | ----------- | --------------------------------------------------- | ------- | -------- | ------------------- | + * | nodeSpacing | Defines the spacing between nodes on the same level | Integer | Required | Any positive Number | + * + * **Notes:** + * + * 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.** + * + * Default value: 50 + */ + nodeSpacing: 50, + + /** + * | Parameter | Description | Type | Required | Values | + * | ----------- | ----------------------------------------------------- | ------- | -------- | ------------------- | + * | rankSpacing | Defines the spacing between nodes on different levels | Integer | Required | Any Positive Number | + * + * **Notes**: + * + * Pertains to vertical spacing for TB (top to bottom) or BT (bottom to top), and the horizontal + * spacing for LR as well as RL graphs. + * + * Default value 50 + */ + rankSpacing: 50, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------- | -------------------------------------------------- | ------ | -------- | ----------------------------- | + * | curve | Defines how mermaid renders curves for flowcharts. | string | Required | 'basis', 'linear', 'cardinal' | + * + * **Notes:** + * + * Default Value: 'basis' + */ + curve: 'basis', + // Only used in new experimental rendering + // represents the padding between the labels and the shape + padding: 15, + + /** + * | Parameter | Description | Type | Required | Values | + * | ----------- | ----------- | ------- | -------- | ----------- | + * | useMaxWidth | See notes | boolean | 4 | true, false | + * + * **Notes:** + * + * When this flag is set the height and width is set to 100% and is then scaling with the + * available space if not the absolute space required is used. + * + * Default value: true + */ + useMaxWidth: true, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------------- | ----------- | ------- | -------- | ----------------------- | + * | defaultRenderer | See notes | boolean | 4 | dagre-d3, dagre-wrapper, elk | + * + * **Notes:** + * + * Decides which rendering engine that is to be used for the rendering. Legal values are: + * dagre-d3 dagre-wrapper - wrapper for dagre implemented in mermaid, elk for layout using + * elkjs + * + * Default value: 'dagre-wrapper' + */ + defaultRenderer: 'dagre-wrapper', + /** + * | Parameter | Description | Type | Required | Values | + * | --------------- | ----------- | ------- | -------- | ----------------------- | + * | wrappingWidth | See notes | number | 4 | width of nodes where text is wrapped | + * + * **Notes:** + * + * 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. + * Default value: 'dagre-wrapper' + */ + wrappingWidth: 200, + }, + + /** The object containing configurations specific for sequence diagrams */ + sequence: { + hideUnusedParticipants: false, + /** + * | Parameter | Description | Type | Required | Values | + * | --------------- | ---------------------------- | ------- | -------- | ------------------ | + * | activationWidth | Width of the activation rect | Integer | Required | Any Positive Value | + * + * **Notes:** Default value :10 + */ + activationWidth: 10, + + /** + * | Parameter | Description | Type | Required | Values | + * | -------------- | ---------------------------------------------------- | ------- | -------- | ------------------ | + * | diagramMarginX | Margin to the right and left of the sequence diagram | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 50 + */ + diagramMarginX: 50, + + /** + * | Parameter | Description | Type | Required | Values | + * | -------------- | ------------------------------------------------- | ------- | -------- | ------------------ | + * | diagramMarginY | Margin to the over and under the sequence diagram | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 10 + */ + diagramMarginY: 10, + + /** + * | Parameter | Description | Type | Required | Values | + * | ----------- | --------------------- | ------- | -------- | ------------------ | + * | actorMargin | Margin between actors | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 50 + */ + actorMargin: 50, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------- | -------------------- | ------- | -------- | ------------------ | + * | width | Width of actor boxes | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 150 + */ + width: 150, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------- | --------------------- | ------- | -------- | ------------------ | + * | height | Height of actor boxes | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 65 + */ + height: 65, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------- | ------------------------ | ------- | -------- | ------------------ | + * | boxMargin | Margin around loop boxes | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 10 + */ + boxMargin: 10, + + /** + * | Parameter | Description | Type | Required | Values | + * | ------------- | -------------------------------------------- | ------- | -------- | ------------------ | + * | boxTextMargin | Margin around the text in loop/alt/opt boxes | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 5 + */ + boxTextMargin: 5, + + /** + * | Parameter | Description | Type | Required | Values | + * | ---------- | ------------------- | ------- | -------- | ------------------ | + * | noteMargin | margin around notes | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 10 + */ + noteMargin: 10, + + /** + * | Parameter | Description | Type | Required | Values | + * | ------------- | ---------------------- | ------- | -------- | ------------------ | + * | messageMargin | Space between messages | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 35 + */ + messageMargin: 35, + + /** + * | Parameter | Description | Type | Required | Values | + * | ------------ | --------------------------- | ------ | -------- | ------------------------- | + * | messageAlign | Multiline message alignment | string | Required | 'left', 'center', 'right' | + * + * **Notes:** Default value: 'center' + */ + messageAlign: 'center', + + /** + * | Parameter | Description | Type | Required | Values | + * | ------------ | --------------------------- | ------- | -------- | ----------- | + * | mirrorActors | Mirror actors under diagram | boolean | Required | true, false | + * + * **Notes:** Default value: true + */ + mirrorActors: true, + + /** + * | Parameter | Description | Type | Required | Values | + * | ---------- | ----------------------------------------------------------------------- | ------- | -------- | ----------- | + * | forceMenus | forces actor popup menus to always be visible (to support E2E testing). | Boolean | Required | True, False | + * + * **Notes:** + * + * Default value: false. + */ + forceMenus: false, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------------- | ------------------------------------------ | ------- | -------- | ------------------ | + * | bottomMarginAdj | Prolongs the edge of the diagram downwards | Integer | Required | Any Positive Value | + * + * **Notes:** + * + * Depending on css styling this might need adjustment. + * + * Default value: 1 + */ + bottomMarginAdj: 1, + + /** + * | Parameter | Description | Type | Required | Values | + * | ----------- | ----------- | ------- | -------- | ----------- | + * | useMaxWidth | See Notes | boolean | Required | true, false | + * + * **Notes:** When this flag is set to true, the height and width is set to 100% and is then + * scaling with the available space. If set to false, the absolute space required is used. + * + * Default value: true + */ + useMaxWidth: true, + + /** + * | Parameter | Description | Type | Required | Values | + * | ----------- | ------------------------------------ | ------- | -------- | ----------- | + * | rightAngles | display curve arrows as right angles | boolean | Required | true, false | + * + * **Notes:** + * + * This will display arrows that start and begin at the same node as right angles, rather than a + * curve + * + * Default value: false + */ + rightAngles: false, + + /** + * | Parameter | Description | Type | Required | Values | + * | ------------------- | ------------------------------- | ------- | -------- | ----------- | + * | showSequenceNumbers | This will show the node numbers | boolean | Required | true, false | + * + * **Notes:** Default value: false + */ + showSequenceNumbers: false, + + /** + * | Parameter | Description | Type | Required | Values | + * | ------------- | -------------------------------------------------- | ------- | -------- | ------------------ | + * | actorFontSize | This sets the font size of the actor's description | Integer | Require | Any Positive Value | + * + * **Notes:** **Default value 14**.. + */ + actorFontSize: 14, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------------- | ---------------------------------------------------- | ------ | -------- | --------------------------- | + * | actorFontFamily | This sets the font family of the actor's description | string | Required | Any Possible CSS FontFamily | + * + * **Notes:** Default value: "'Open Sans", sans-serif' + */ + actorFontFamily: '"Open Sans", sans-serif', + + /** + * This sets the font weight of the actor's description + * + * **Notes:** Default value: 400. + */ + actorFontWeight: 400, + + /** + * | Parameter | Description | Type | Required | Values | + * | ------------ | ----------------------------------------------- | ------- | -------- | ------------------ | + * | noteFontSize | This sets the font size of actor-attached notes | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 14 + */ + noteFontSize: 14, + + /** + * | Parameter | Description | Type | Required | Values | + * | -------------- | -------------------------------------------------- | ------ | -------- | --------------------------- | + * | noteFontFamily | This sets the font family of actor-attached notes. | string | Required | Any Possible CSS FontFamily | + * + * **Notes:** Default value: ''"trebuchet ms", verdana, arial, sans-serif' + */ + noteFontFamily: '"trebuchet ms", verdana, arial, sans-serif', + + /** + * This sets the font weight of the note's description + * + * **Notes:** Default value: 400 + */ + noteFontWeight: 400, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------- | ---------------------------------------------------- | ------ | -------- | ------------------------- | + * | noteAlign | This sets the text alignment of actor-attached notes | string | required | 'left', 'center', 'right' | + * + * **Notes:** Default value: 'center' + */ + noteAlign: 'center', + + /** + * | Parameter | Description | Type | Required | Values | + * | --------------- | ----------------------------------------- | ------- | -------- | ------------------- | + * | messageFontSize | This sets the font size of actor messages | Integer | Required | Any Positive Number | + * + * **Notes:** Default value: 16 + */ + messageFontSize: 16, + + /** + * | Parameter | Description | Type | Required | Values | + * | ----------------- | ------------------------------------------- | ------ | -------- | --------------------------- | + * | messageFontFamily | This sets the font family of actor messages | string | Required | Any Possible CSS FontFamily | + * + * **Notes:** Default value: '"trebuchet ms", verdana, arial, sans-serif' + */ + messageFontFamily: '"trebuchet ms", verdana, arial, sans-serif', + + /** + * This sets the font weight of the message's description + * + * **Notes:** Default value: 400. + */ + messageFontWeight: 400, + + /** + * This sets the auto-wrap state for the diagram + * + * **Notes:** Default value: false. + */ + wrap: false, + + /** + * This sets the auto-wrap padding for the diagram (sides only) + * + * **Notes:** Default value: 0. + */ + wrapPadding: 10, + + /** + * This sets the width of the loop-box (loop, alt, opt, par) + * + * **Notes:** Default value: 50. + */ + labelBoxWidth: 50, + + /** + * This sets the height of the loop-box (loop, alt, opt, par) + * + * **Notes:** Default value: 20. + */ + labelBoxHeight: 20, + + messageFont: function () { + return { + fontFamily: this.messageFontFamily, + fontSize: this.messageFontSize, + fontWeight: this.messageFontWeight, + }; + }, + noteFont: function () { + return { + fontFamily: this.noteFontFamily, + fontSize: this.noteFontSize, + fontWeight: this.noteFontWeight, + }; + }, + actorFont: function () { + return { + fontFamily: this.actorFontFamily, + fontSize: this.actorFontSize, + fontWeight: this.actorFontWeight, + }; + }, + }, + + /** The object containing configurations specific for gantt diagrams */ + gantt: { + /** + * ### titleTopMargin + * + * | Parameter | Description | Type | Required | Values | + * | -------------- | ---------------------------------------------- | ------- | -------- | ------------------ | + * | titleTopMargin | Margin top for the text over the gantt diagram | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 25 + */ + titleTopMargin: 25, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------- | ----------------------------------- | ------- | -------- | ------------------ | + * | barHeight | The height of the bars in the graph | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 20 + */ + barHeight: 20, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------- | ---------------------------------------------------------------- | ------- | -------- | ------------------ | + * | barGap | The margin between the different activities in the gantt diagram | Integer | Optional | Any Positive Value | + * + * **Notes:** Default value: 4 + */ + barGap: 4, + + /** + * | Parameter | Description | Type | Required | Values | + * | ---------- | -------------------------------------------------------------------------- | ------- | -------- | ------------------ | + * | topPadding | Margin between title and gantt diagram and between axis and gantt diagram. | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 50 + */ + topPadding: 50, + + /** + * | Parameter | Description | Type | Required | Values | + * | ------------ | ----------------------------------------------------------------------- | ------- | -------- | ------------------ | + * | rightPadding | The space allocated for the section name to the right of the activities | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 75 + */ + rightPadding: 75, + + /** + * | Parameter | Description | Type | Required | Values | + * | ----------- | ---------------------------------------------------------------------- | ------- | -------- | ------------------ | + * | leftPadding | The space allocated for the section name to the left of the activities | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 75 + */ + leftPadding: 75, + + /** + * | Parameter | Description | Type | Required | Values | + * | -------------------- | -------------------------------------------- | ------- | -------- | ------------------ | + * | gridLineStartPadding | Vertical starting position of the grid lines | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 35 + */ + gridLineStartPadding: 35, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------- | ----------- | ------- | -------- | ------------------ | + * | fontSize | Font size | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 11 + */ + fontSize: 11, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------------- | ---------------------- | ------- | -------- | ------------------ | + * | sectionFontSize | Font size for sections | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 11 + */ + sectionFontSize: 11, + + /** + * | Parameter | Description | Type | Required | Values | + * | ------------------- | ---------------------------------------- | ------- | -------- | ------------------ | + * | numberSectionStyles | The number of alternating section styles | Integer | 4 | Any Positive Value | + * + * **Notes:** Default value: 4 + */ + numberSectionStyles: 4, + + /** + * | Parameter | Description | Type | Required | Values | + * | ----------- | ------------------------- | ------ | -------- | --------- | + * | displayMode | Controls the display mode | string | 4 | 'compact' | + * + * **Notes**: + * + * - **compact**: Enables displaying multiple tasks on the same row. + */ + displayMode: '', + + /** + * | Parameter | Description | Type | Required | Values | + * | ---------- | ---------------------------- | ---- | -------- | ---------------- | + * | axisFormat | Date/time format of the axis | 3 | Required | Date in yy-mm-dd | + * + * **Notes:** + * + * This might need adjustment to match your locale and preferences + * + * Default value: '%Y-%m-%d'. + */ + axisFormat: '%Y-%m-%d', + + /** + * | Parameter | Description | Type | Required | Values | + * | ------------ | ------------| ------ | -------- | ------- | + * | tickInterval | axis ticks | string | Optional | string | + * + * **Notes:** + * + * Pattern is /^([1-9][0-9]*)(minute|hour|day|week|month)$/ + * + * Default value: undefined + */ + tickInterval: undefined, + /** + * | Parameter | Description | Type | Required | Values | + * | ----------- | ----------- | ------- | -------- | ----------- | + * | useMaxWidth | See notes | boolean | 4 | true, false | + * + * **Notes:** + * + * When this flag is set the height and width is set to 100% and is then scaling with the + * available space if not the absolute space required is used. + * + * Default value: true + */ + useMaxWidth: true, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------- | ----------- | ------- | -------- | ----------- | + * | topAxis | See notes | Boolean | 4 | True, False | + * + * **Notes:** when this flag is set date labels will be added to the top of the chart + * + * **Default value false**. + */ + topAxis: false, + + useWidth: undefined, + }, + + /** The object containing configurations specific for journey diagrams */ + journey: { + /** + * | Parameter | Description | Type | Required | Values | + * | -------------- | ---------------------------------------------------- | ------- | -------- | ------------------ | + * | diagramMarginX | Margin to the right and left of the sequence diagram | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 50 + */ + diagramMarginX: 50, + + /** + * | Parameter | Description | Type | Required | Values | + * | -------------- | -------------------------------------------------- | ------- | -------- | ------------------ | + * | diagramMarginY | Margin to the over and under the sequence diagram. | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 10 + */ + diagramMarginY: 10, + + /** + * | Parameter | Description | Type | Required | Values | + * | ----------- | --------------------- | ------- | -------- | ------------------ | + * | actorMargin | Margin between actors | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 50 + */ + leftMargin: 150, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------- | -------------------- | ------- | -------- | ------------------ | + * | width | Width of actor boxes | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 150 + */ + width: 150, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------- | --------------------- | ------- | -------- | ------------------ | + * | height | Height of actor boxes | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 65 + */ + height: 50, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------- | ------------------------ | ------- | -------- | ------------------ | + * | boxMargin | Margin around loop boxes | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 10 + */ + boxMargin: 10, + + /** + * | Parameter | Description | Type | Required | Values | + * | ------------- | -------------------------------------------- | ------- | -------- | ------------------ | + * | boxTextMargin | Margin around the text in loop/alt/opt boxes | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 5 + */ + boxTextMargin: 5, + + /** + * | Parameter | Description | Type | Required | Values | + * | ---------- | ------------------- | ------- | -------- | ------------------ | + * | noteMargin | Margin around notes | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 10 + */ + noteMargin: 10, + + /** + * | Parameter | Description | Type | Required | Values | + * | ------------- | ----------------------- | ------- | -------- | ------------------ | + * | messageMargin | Space between messages. | Integer | Required | Any Positive Value | + * + * **Notes:** + * + * Space between messages. + * + * Default value: 35 + */ + messageMargin: 35, + + /** + * | Parameter | Description | Type | Required | Values | + * | ------------ | --------------------------- | ---- | -------- | ------------------------- | + * | messageAlign | Multiline message alignment | 3 | 4 | 'left', 'center', 'right' | + * + * **Notes:** Default value: 'center' + */ + messageAlign: 'center', + + /** + * | Parameter | Description | Type | Required | Values | + * | --------------- | ------------------------------------------ | ------- | -------- | ------------------ | + * | bottomMarginAdj | Prolongs the edge of the diagram downwards | Integer | 4 | Any Positive Value | + * + * **Notes:** + * + * Depending on css styling this might need adjustment. + * + * Default value: 1 + */ + bottomMarginAdj: 1, + + /** + * | Parameter | Description | Type | Required | Values | + * | ----------- | ----------- | ------- | -------- | ----------- | + * | useMaxWidth | See notes | boolean | 4 | true, false | + * + * **Notes:** + * + * When this flag is set the height and width is set to 100% and is then scaling with the + * available space if not the absolute space required is used. + * + * Default value: true + */ + useMaxWidth: true, + + /** + * | Parameter | Description | Type | Required | Values | + * | ----------- | --------------------------------- | ---- | -------- | ----------- | + * | rightAngles | Curved Arrows become Right Angles | 3 | 4 | true, false | + * + * **Notes:** + * + * This will display arrows that start and begin at the same node as right angles, rather than a + * curves + * + * Default value: false + */ + rightAngles: false, + taskFontSize: 14, + taskFontFamily: '"Open Sans", sans-serif', + taskMargin: 50, + // width of activation box + activationWidth: 10, + + // text placement as: tspan | fo | old only text as before + textPlacement: 'fo', + actorColours: ['#8FBC8F', '#7CFC00', '#00FFFF', '#20B2AA', '#B0E0E6', '#FFFFE0'], + + sectionFills: ['#191970', '#8B008B', '#4B0082', '#2F4F4F', '#800000', '#8B4513', '#00008B'], + sectionColours: ['#fff'], + }, + /** The object containing configurations specific for timeline diagrams */ + timeline: { + /** + * | Parameter | Description | Type | Required | Values | + * | -------------- | ---------------------------------------------------- | ------- | -------- | ------------------ | + * | diagramMarginX | Margin to the right and left of the sequence diagram | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 50 + */ + diagramMarginX: 50, + + /** + * | Parameter | Description | Type | Required | Values | + * | -------------- | -------------------------------------------------- | ------- | -------- | ------------------ | + * | diagramMarginY | Margin to the over and under the sequence diagram. | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 10 + */ + diagramMarginY: 10, + + /** + * | Parameter | Description | Type | Required | Values | + * | ----------- | --------------------- | ------- | -------- | ------------------ | + * | actorMargin | Margin between actors | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 50 + */ + leftMargin: 150, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------- | -------------------- | ------- | -------- | ------------------ | + * | width | Width of actor boxes | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 150 + */ + width: 150, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------- | --------------------- | ------- | -------- | ------------------ | + * | height | Height of actor boxes | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 65 + */ + height: 50, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------- | ------------------------ | ------- | -------- | ------------------ | + * | boxMargin | Margin around loop boxes | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 10 + */ + boxMargin: 10, + + /** + * | Parameter | Description | Type | Required | Values | + * | ------------- | -------------------------------------------- | ------- | -------- | ------------------ | + * | boxTextMargin | Margin around the text in loop/alt/opt boxes | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 5 + */ + boxTextMargin: 5, + + /** + * | Parameter | Description | Type | Required | Values | + * | ---------- | ------------------- | ------- | -------- | ------------------ | + * | noteMargin | Margin around notes | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 10 + */ + noteMargin: 10, + + /** + * | Parameter | Description | Type | Required | Values | + * | ------------- | ----------------------- | ------- | -------- | ------------------ | + * | messageMargin | Space between messages. | Integer | Required | Any Positive Value | + * + * **Notes:** + * + * Space between messages. + * + * Default value: 35 + */ + messageMargin: 35, + + /** + * | Parameter | Description | Type | Required | Values | + * | ------------ | --------------------------- | ---- | -------- | ------------------------- | + * | messageAlign | Multiline message alignment | 3 | 4 | 'left', 'center', 'right' | + * + * **Notes:** Default value: 'center' + */ + messageAlign: 'center', + + /** + * | Parameter | Description | Type | Required | Values | + * | --------------- | ------------------------------------------ | ------- | -------- | ------------------ | + * | bottomMarginAdj | Prolongs the edge of the diagram downwards | Integer | 4 | Any Positive Value | + * + * **Notes:** + * + * Depending on css styling this might need adjustment. + * + * Default value: 1 + */ + bottomMarginAdj: 1, + + /** + * | Parameter | Description | Type | Required | Values | + * | ----------- | ----------- | ------- | -------- | ----------- | + * | useMaxWidth | See notes | boolean | 4 | true, false | + * + * **Notes:** + * + * When this flag is set the height and width is set to 100% and is then scaling with the + * available space if not the absolute space required is used. + * + * Default value: true + */ + useMaxWidth: true, + + /** + * | Parameter | Description | Type | Required | Values | + * | ----------- | --------------------------------- | ---- | -------- | ----------- | + * | rightAngles | Curved Arrows become Right Angles | 3 | 4 | true, false | + * + * **Notes:** + * + * This will display arrows that start and begin at the same node as right angles, rather than a + * curves + * + * Default value: false + */ + rightAngles: false, + taskFontSize: 14, + taskFontFamily: '"Open Sans", sans-serif', + taskMargin: 50, + // width of activation box + activationWidth: 10, + + // text placement as: tspan | fo | old only text as before + textPlacement: 'fo', + actorColours: ['#8FBC8F', '#7CFC00', '#00FFFF', '#20B2AA', '#B0E0E6', '#FFFFE0'], + + sectionFills: ['#191970', '#8B008B', '#4B0082', '#2F4F4F', '#800000', '#8B4513', '#00008B'], + sectionColours: ['#fff'], + disableMulticolor: false, + }, + class: { + /** + * ### titleTopMargin + * + * | Parameter | Description | Type | Required | Values | + * | -------------- | ---------------------------------------------- | ------- | -------- | ------------------ | + * | titleTopMargin | Margin top for the text over the class diagram | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 25 + */ + titleTopMargin: 25, + arrowMarkerAbsolute: false, + dividerMargin: 10, + padding: 5, + textHeight: 10, + + /** + * | Parameter | Description | Type | Required | Values | + * | ----------- | ----------- | ------- | -------- | ----------- | + * | useMaxWidth | See notes | boolean | 4 | true, false | + * + * **Notes:** + * + * When this flag is set the height and width is set to 100% and is then scaling with the + * available space if not the absolute space required is used. + * + * Default value: true + */ + useMaxWidth: true, + /** + * | Parameter | Description | Type | Required | Values | + * | --------------- | ----------- | ------- | -------- | ----------------------- | + * | defaultRenderer | See notes | boolean | 4 | dagre-d3, dagre-wrapper | + * + * **Notes**: + * + * Decides which rendering engine that is to be used for the rendering. Legal values are: + * dagre-d3 dagre-wrapper - wrapper for dagre implemented in mermaid + * + * Default value: 'dagre-d3' + */ + defaultRenderer: 'dagre-wrapper', + }, + state: { + /** + * ### titleTopMargin + * + * | Parameter | Description | Type | Required | Values | + * | -------------- | ---------------------------------------------- | ------- | -------- | ------------------ | + * | titleTopMargin | Margin top for the text over the state diagram | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 25 + */ + titleTopMargin: 25, + dividerMargin: 10, + sizeUnit: 5, + padding: 8, + textHeight: 10, + titleShift: -15, + noteMargin: 10, + forkWidth: 70, + forkHeight: 7, + // Used + miniPadding: 2, + // 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: 5.02, + fontSize: 24, + labelHeight: 16, + edgeLengthFactor: '20', + compositTitleSize: 35, + radius: 5, + /** + * | Parameter | Description | Type | Required | Values | + * | ----------- | ----------- | ------- | -------- | ----------- | + * | useMaxWidth | See notes | boolean | 4 | true, false | + * + * **Notes:** + * + * When this flag is set the height and width is set to 100% and is then scaling with the + * available space if not the absolute space required is used. + * + * Default value: true + */ + useMaxWidth: true, + /** + * | Parameter | Description | Type | Required | Values | + * | --------------- | ----------- | ------- | -------- | ----------------------- | + * | defaultRenderer | See notes | boolean | 4 | dagre-d3, dagre-wrapper | + * + * **Notes:** + * + * Decides which rendering engine that is to be used for the rendering. Legal values are: + * dagre-d3 dagre-wrapper - wrapper for dagre implemented in mermaid + * + * Default value: 'dagre-d3' + */ + defaultRenderer: 'dagre-wrapper', + }, + + /** The object containing configurations specific for entity relationship diagrams */ + er: { + /** + * ### titleTopMargin + * + * | Parameter | Description | Type | Required | Values | + * | -------------- | ---------------------------------------------- | ------- | -------- | ------------------ | + * | titleTopMargin | Margin top for the text over the diagram | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 25 + */ + titleTopMargin: 25, + + /** + * | Parameter | Description | Type | Required | Values | + * | -------------- | ----------------------------------------------- | ------- | -------- | ------------------ | + * | diagramPadding | Amount of padding around the diagram as a whole | Integer | Required | Any Positive Value | + * + * **Notes:** + * + * The amount of padding around the diagram as a whole so that embedded diagrams have margins, + * expressed in pixels + * + * Default value: 20 + */ + diagramPadding: 20, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------------- | ---------------------------------------- | ------ | -------- | ---------------------- | + * | layoutDirection | Directional bias for layout of entities. | string | Required | "TB", "BT", "LR", "RL" | + * + * **Notes:** + * + * 'TB' for Top-Bottom, 'BT'for Bottom-Top, 'LR' for Left-Right, or 'RL' for Right to Left. + * + * T = top, B = bottom, L = left, and R = right. + * + * Default value: 'TB' + */ + layoutDirection: 'TB', + + /** + * | Parameter | Description | Type | Required | Values | + * | -------------- | ---------------------------------- | ------- | -------- | ------------------ | + * | minEntityWidth | The minimum width of an entity box | Integer | Required | Any Positive Value | + * + * **Notes:** Expressed in pixels. Default value: 100 + */ + minEntityWidth: 100, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------------- | ----------------------------------- | ------- | -------- | ------------------ | + * | minEntityHeight | The minimum height of an entity box | Integer | 4 | Any Positive Value | + * + * **Notes:** Expressed in pixels Default value: 75 + */ + minEntityHeight: 75, + + /** + * | Parameter | Description | Type | Required | Values | + * | ------------- | ------------------------------------------------------------ | ------- | -------- | ------------------ | + * | entityPadding | Minimum internal padding between text in box and box borders | Integer | 4 | Any Positive Value | + * + * **Notes:** + * + * The minimum internal padding between text in an entity box and the enclosing box borders, + * expressed in pixels. + * + * Default value: 15 + */ + entityPadding: 15, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------- | ----------------------------------- | ------ | -------- | -------------------- | + * | stroke | Stroke color of box edges and lines | string | 4 | Any recognized color | + * + * **Notes:** Default value: 'gray' + */ + stroke: 'gray', + + /** + * | Parameter | Description | Type | Required | Values | + * | --------- | -------------------------- | ------ | -------- | -------------------- | + * | fill | Fill color of entity boxes | string | 4 | Any recognized color | + * + * **Notes:** Default value: 'honeydew' + */ + fill: 'honeydew', + + /** + * | Parameter | Description | Type | Required | Values | + * | --------- | ------------------- | ------- | -------- | ------------------ | + * | fontSize | Font Size in pixels | Integer | | Any Positive Value | + * + * **Notes:** + * + * Font size (expressed as an integer representing a number of pixels) Default value: 12 + */ + fontSize: 12, + + /** + * | Parameter | Description | Type | Required | Values | + * | ----------- | ----------- | ------- | -------- | ----------- | + * | useMaxWidth | See Notes | boolean | Required | true, false | + * + * **Notes:** + * + * When this flag is set to true, the diagram width is locked to 100% and scaled based on + * available space. If set to false, the diagram reserves its absolute width. + * + * Default value: true + */ + useMaxWidth: true, + }, + + /** The object containing configurations specific for pie diagrams */ + pie: { + useWidth: undefined, + + /** + * | Parameter | Description | Type | Required | Values | + * | ----------- | ----------- | ------- | -------- | ----------- | + * | useMaxWidth | See Notes | boolean | Required | true, false | + * + * **Notes:** + * + * When this flag is set to true, the diagram width is locked to 100% and scaled based on + * available space. If set to false, the diagram reserves its absolute width. + * + * Default value: true + */ + useMaxWidth: true, + + /** + * | Parameter | Description | Type | Required | Values | + * | ------------ | -------------------------------------------------------------------------------- | ------- | -------- | ------------------- | + * | textPosition | Axial position of slice's label from zero at the center to 1 at the outside edge | Number | Optional | Decimal from 0 to 1 | + * + * **Notes:** Default value: 0.75 + */ + textPosition: 0.75, + }, + + quadrantChart: { + /** + * | Parameter | Description | Type | Required | Values | + * | --------------- | ---------------------------------- | ------- | -------- | ------------------- | + * | chartWidth | Width of the chart | number | Optional | Any positive number | + * + * **Notes:** + * Default value: 500 + */ + chartWidth: 500, + /** + * | Parameter | Description | Type | Required | Values | + * | --------------- | ---------------------------------- | ------- | -------- | ------------------- | + * | chartHeight | Height of the chart | number | Optional | Any positive number | + * + * **Notes:** + * Default value: 500 + */ + chartHeight: 500, + /** + * | Parameter | Description | Type | Required | Values | + * | ------------------ | ---------------------------------- | ------- | -------- | ------------------- | + * | titlePadding | Chart title top and bottom padding | number | Optional | Any positive number | + * + * **Notes:** + * Default value: 10 + */ + titlePadding: 10, + /** + * | Parameter | Description | Type | Required | Values | + * | ------------------ | ---------------------------------- | ------- | -------- | ------------------- | + * | titleFontSize | Chart title font size | number | Optional | Any positive number | + * + * **Notes:** + * Default value: 20 + */ + titleFontSize: 20, + /** + * | Parameter | Description | Type | Required | Values | + * | --------------- | ---------------------------------- | ------- | -------- | ------------------- | + * | quadrantPadding | Padding around the quadrant square | number | Optional | Any positive number | + * + * **Notes:** + * Default value: 5 + */ + quadrantPadding: 5, + /** + * | Parameter | Description | Type | Required | Values | + * | ---------------------- | -------------------------------------------------------------------------- | ------- | -------- | ------------------- | + * | quadrantTextTopPadding | quadrant title padding from top if the quadrant is rendered on top | number | Optional | Any positive number | + * + * **Notes:** + * Default value: 5 + */ + quadrantTextTopPadding: 5, + /** + * | Parameter | Description | Type | Required | Values | + * | ------------------ | ---------------------------------- | ------- | -------- | ------------------- | + * | quadrantLabelFontSize | quadrant title font size | number | Optional | Any positive number | + * + * **Notes:** + * Default value: 16 + */ + quadrantLabelFontSize: 16, + /** + * | Parameter | Description | Type | Required | Values | + * | --------------------------------- | ------------------------------------------------------------- | ------- | -------- | ------------------- | + * | quadrantInternalBorderStrokeWidth | stroke width of edges of the box that are inside the quadrant | number | Optional | Any positive number | + * + * **Notes:** + * Default value: 1 + */ + quadrantInternalBorderStrokeWidth: 1, + /** + * | Parameter | Description | Type | Required | Values | + * | --------------------------------- | -------------------------------------------------------------- | ------- | -------- | ------------------- | + * | quadrantExternalBorderStrokeWidth | stroke width of edges of the box that are outside the quadrant | number | Optional | Any positive number | + * + * **Notes:** + * Default value: 2 + */ + quadrantExternalBorderStrokeWidth: 2, + /** + * | Parameter | Description | Type | Required | Values | + * | --------------- | ---------------------------------- | ------- | -------- | ------------------- | + * | xAxisLabelPadding | Padding around x-axis labels | number | Optional | Any positive number | + * + * **Notes:** + * Default value: 5 + */ + xAxisLabelPadding: 5, + /** + * | Parameter | Description | Type | Required | Values | + * | ------------------ | ---------------------------------- | ------- | -------- | ------------------- | + * | xAxisLabelFontSize | x-axis label font size | number | Optional | Any positive number | + * + * **Notes:** + * Default value: 16 + */ + xAxisLabelFontSize: 16, + /** + * | Parameter | Description | Type | Required | Values | + * | ------------- | ------------------------------- | ------- | -------- | ------------------- | + * | xAxisPosition | position of x-axis labels | string | Optional | 'top' or 'bottom' | + * + * **Notes:** + * Default value: top + */ + xAxisPosition: 'top', + /** + * | Parameter | Description | Type | Required | Values | + * | --------------- | ---------------------------------- | ------- | -------- | ------------------- | + * | yAxisLabelPadding | Padding around y-axis labels | number | Optional | Any positive number | + * + * **Notes:** + * Default value: 5 + */ + yAxisLabelPadding: 5, + /** + * | Parameter | Description | Type | Required | Values | + * | ------------------ | ---------------------------------- | ------- | -------- | ------------------- | + * | yAxisLabelFontSize | y-axis label font size | number | Optional | Any positive number | + * + * **Notes:** + * Default value: 16 + */ + yAxisLabelFontSize: 16, + /** + * | Parameter | Description | Type | Required | Values | + * | ------------- | ------------------------------- | ------- | -------- | ------------------- | + * | yAxisPosition | position of y-axis labels | string | Optional | 'left' or 'right' | + * + * **Notes:** + * Default value: left + */ + yAxisPosition: 'left', + /** + * | Parameter | Description | Type | Required | Values | + * | ---------------------- | -------------------------------------- | ------- | -------- | ------------------- | + * | pointTextPadding | padding between point and point label | number | Optional | Any positive number | + * + * **Notes:** + * Default value: 5 + */ + pointTextPadding: 5, + /** + * | Parameter | Description | Type | Required | Values | + * | ---------------------- | ---------------------- | ------- | -------- | ------------------- | + * | pointTextPadding | point title font size | number | Optional | Any positive number | + * + * **Notes:** + * Default value: 12 + */ + pointLabelFontSize: 12, + /** + * | Parameter | Description | Type | Required | Values | + * | ------------- | ------------------------------- | ------- | -------- | ------------------- | + * | pointRadius | radius of the point to be drawn | number | Optional | Any positive number | + * + * **Notes:** + * Default value: 5 + */ + pointRadius: 5, + /** + * | Parameter | Description | Type | Required | Values | + * | ----------- | ----------- | ------- | -------- | ----------- | + * | useMaxWidth | See Notes | boolean | Required | true, false | + * + * **Notes:** + * + * When this flag is set to true, the diagram width is locked to 100% and scaled based on + * available space. If set to false, the diagram reserves its absolute width. + * + * Default value: true + */ + useMaxWidth: true, + }, + + /** The object containing configurations specific for req diagrams */ + requirement: { + useWidth: undefined, + + /** + * | Parameter | Description | Type | Required | Values | + * | ----------- | ----------- | ------- | -------- | ----------- | + * | useMaxWidth | See Notes | boolean | Required | true, false | + * + * **Notes:** + * + * When this flag is set to true, the diagram width is locked to 100% and scaled based on + * available space. If set to false, the diagram reserves its absolute width. + * + * Default value: true + */ + useMaxWidth: true, + + rect_fill: '#f9f9f9', + text_color: '#333', + rect_border_size: '0.5px', + rect_border_color: '#bbb', + rect_min_width: 200, + rect_min_height: 200, + fontSize: 14, + rect_padding: 10, + line_height: 20, + }, + gitGraph: { + /** + * ### titleTopMargin + * + * | Parameter | Description | Type | Required | Values | + * | -------------- | ---------------------------------------------- | ------- | -------- | ------------------ | + * | titleTopMargin | Margin top for the text over the Git diagram | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 25 + */ + titleTopMargin: 25, + diagramPadding: 8, + nodeLabel: { + width: 75, + height: 100, + x: -25, + y: 0, + }, + mainBranchName: 'main', + mainBranchOrder: 0, + showCommitLabel: true, + showBranches: true, + rotateCommitLabel: true, + }, + + /** The object containing configurations specific for c4 diagrams */ + c4: { + useWidth: undefined, + + /** + * | Parameter | Description | Type | Required | Values | + * | -------------- | ---------------------------------------------- | ------- | -------- | ------------------ | + * | diagramMarginX | Margin to the right and left of the c4 diagram | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 50 + */ + diagramMarginX: 50, + + /** + * | Parameter | Description | Type | Required | Values | + * | -------------- | ------------------------------------------- | ------- | -------- | ------------------ | + * | diagramMarginY | Margin to the over and under the c4 diagram | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 10 + */ + diagramMarginY: 10, + + /** + * | Parameter | Description | Type | Required | Values | + * | ------------- | --------------------- | ------- | -------- | ------------------ | + * | c4ShapeMargin | Margin between shapes | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 50 + */ + c4ShapeMargin: 50, + + /** + * | Parameter | Description | Type | Required | Values | + * | -------------- | ---------------------- | ------- | -------- | ------------------ | + * | c4ShapePadding | Padding between shapes | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 20 + */ + c4ShapePadding: 20, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------- | --------------------- | ------- | -------- | ------------------ | + * | width | Width of person boxes | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 216 + */ + width: 216, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------- | ---------------------- | ------- | -------- | ------------------ | + * | height | Height of person boxes | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 60 + */ + height: 60, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------- | ------------------- | ------- | -------- | ------------------ | + * | boxMargin | Margin around boxes | Integer | Required | Any Positive Value | + * + * **Notes:** Default value: 10 + */ + boxMargin: 10, + + /** + * | Parameter | Description | Type | Required | Values | + * | ----------- | ----------- | ------- | -------- | ----------- | + * | useMaxWidth | See Notes | boolean | Required | true, false | + * + * **Notes:** When this flag is set to true, the height and width is set to 100% and is then + * scaling with the available space. If set to false, the absolute space required is used. + * + * Default value: true + */ + useMaxWidth: true, + + /** + * | Parameter | Description | Type | Required | Values | + * | ------------ | ----------- | ------- | -------- | ------------------ | + * | c4ShapeInRow | See Notes | Integer | Required | Any Positive Value | + * + * **Notes:** How many shapes to place in each row. + * + * Default value: 4 + */ + c4ShapeInRow: 4, + + nextLinePaddingX: 0, + + /** + * | Parameter | Description | Type | Required | Values | + * | --------------- | ----------- | ------- | -------- | ------------------ | + * | c4BoundaryInRow | See Notes | Integer | Required | Any Positive Value | + * + * **Notes:** How many boundaries to place in each row. + * + * Default value: 2 + */ + c4BoundaryInRow: 2, + + /** + * This sets the font size of Person shape for the diagram + * + * **Notes:** Default value: 14. + */ + personFontSize: 14, + /** + * This sets the font family of Person shape for the diagram + * + * **Notes:** Default value: "Open Sans", sans-serif. + */ + personFontFamily: '"Open Sans", sans-serif', + /** + * This sets the font weight of Person shape for the diagram + * + * **Notes:** Default value: normal. + */ + personFontWeight: 'normal', + + /** + * This sets the font size of External Person shape for the diagram + * + * **Notes:** Default value: 14. + */ + external_personFontSize: 14, + /** + * This sets the font family of External Person shape for the diagram + * + * **Notes:** Default value: "Open Sans", sans-serif. + */ + external_personFontFamily: '"Open Sans", sans-serif', + /** + * This sets the font weight of External Person shape for the diagram + * + * **Notes:** Default value: normal. + */ + external_personFontWeight: 'normal', + + /** + * This sets the font size of System shape for the diagram + * + * **Notes:** Default value: 14. + */ + systemFontSize: 14, + /** + * This sets the font family of System shape for the diagram + * + * **Notes:** Default value: "Open Sans", sans-serif. + */ + systemFontFamily: '"Open Sans", sans-serif', + /** + * This sets the font weight of System shape for the diagram + * + * **Notes:** Default value: normal. + */ + systemFontWeight: 'normal', + + /** + * This sets the font size of External System shape for the diagram + * + * **Notes:** Default value: 14. + */ + external_systemFontSize: 14, + /** + * This sets the font family of External System shape for the diagram + * + * **Notes:** Default value: "Open Sans", sans-serif. + */ + external_systemFontFamily: '"Open Sans", sans-serif', + /** + * This sets the font weight of External System shape for the diagram + * + * **Notes:** Default value: normal. + */ + external_systemFontWeight: 'normal', + + /** + * This sets the font size of System DB shape for the diagram + * + * **Notes:** Default value: 14. + */ + system_dbFontSize: 14, + /** + * This sets the font family of System DB shape for the diagram + * + * **Notes:** Default value: "Open Sans", sans-serif. + */ + system_dbFontFamily: '"Open Sans", sans-serif', + /** + * This sets the font weight of System DB shape for the diagram + * + * **Notes:** Default value: normal. + */ + system_dbFontWeight: 'normal', + + /** + * This sets the font size of External System DB shape for the diagram + * + * **Notes:** Default value: 14. + */ + external_system_dbFontSize: 14, + /** + * This sets the font family of External System DB shape for the diagram + * + * **Notes:** Default value: "Open Sans", sans-serif. + */ + external_system_dbFontFamily: '"Open Sans", sans-serif', + /** + * This sets the font weight of External System DB shape for the diagram + * + * **Notes:** Default value: normal. + */ + external_system_dbFontWeight: 'normal', + + /** + * This sets the font size of System Queue shape for the diagram + * + * **Notes:** Default value: 14. + */ + system_queueFontSize: 14, + /** + * This sets the font family of System Queue shape for the diagram + * + * **Notes:** Default value: "Open Sans", sans-serif. + */ + system_queueFontFamily: '"Open Sans", sans-serif', + /** + * This sets the font weight of System Queue shape for the diagram + * + * **Notes:** Default value: normal. + */ + system_queueFontWeight: 'normal', + + /** + * This sets the font size of External System Queue shape for the diagram + * + * **Notes:** Default value: 14. + */ + external_system_queueFontSize: 14, + /** + * This sets the font family of External System Queue shape for the diagram + * + * **Notes:** Default value: "Open Sans", sans-serif. + */ + external_system_queueFontFamily: '"Open Sans", sans-serif', + /** + * This sets the font weight of External System Queue shape for the diagram + * + * **Notes:** Default value: normal. + */ + external_system_queueFontWeight: 'normal', + + /** + * This sets the font size of Boundary shape for the diagram + * + * **Notes:** Default value: 14. + */ + boundaryFontSize: 14, + /** + * This sets the font family of Boundary shape for the diagram + * + * **Notes:** Default value: "Open Sans", sans-serif. + */ + boundaryFontFamily: '"Open Sans", sans-serif', + /** + * This sets the font weight of Boundary shape for the diagram + * + * **Notes:** Default value: normal. + */ + boundaryFontWeight: 'normal', + + /** + * This sets the font size of Message shape for the diagram + * + * **Notes:** Default value: 12. + */ + messageFontSize: 12, + /** + * This sets the font family of Message shape for the diagram + * + * **Notes:** Default value: "Open Sans", sans-serif. + */ + messageFontFamily: '"Open Sans", sans-serif', + /** + * This sets the font weight of Message shape for the diagram + * + * **Notes:** Default value: normal. + */ + messageFontWeight: 'normal', + + /** + * This sets the font size of Container shape for the diagram + * + * **Notes:** Default value: 14. + */ + containerFontSize: 14, + /** + * This sets the font family of Container shape for the diagram + * + * **Notes:** Default value: "Open Sans", sans-serif. + */ + containerFontFamily: '"Open Sans", sans-serif', + /** + * This sets the font weight of Container shape for the diagram + * + * **Notes:** Default value: normal. + */ + containerFontWeight: 'normal', + + /** + * This sets the font size of External Container shape for the diagram + * + * **Notes:** Default value: 14. + */ + external_containerFontSize: 14, + /** + * This sets the font family of External Container shape for the diagram + * + * **Notes:** Default value: "Open Sans", sans-serif. + */ + external_containerFontFamily: '"Open Sans", sans-serif', + /** + * This sets the font weight of External Container shape for the diagram + * + * **Notes:** Default value: normal. + */ + external_containerFontWeight: 'normal', + + /** + * This sets the font size of Container DB shape for the diagram + * + * **Notes:** Default value: 14. + */ + container_dbFontSize: 14, + /** + * This sets the font family of Container DB shape for the diagram + * + * **Notes:** Default value: "Open Sans", sans-serif. + */ + container_dbFontFamily: '"Open Sans", sans-serif', + /** + * This sets the font weight of Container DB shape for the diagram + * + * **Notes:** Default value: normal. + */ + container_dbFontWeight: 'normal', + + /** + * This sets the font size of External Container DB shape for the diagram + * + * **Notes:** Default value: 14. + */ + external_container_dbFontSize: 14, + /** + * This sets the font family of External Container DB shape for the diagram + * + * **Notes:** Default value: "Open Sans", sans-serif. + */ + external_container_dbFontFamily: '"Open Sans", sans-serif', + /** + * This sets the font weight of External Container DB shape for the diagram + * + * **Notes:** Default value: normal. + */ + external_container_dbFontWeight: 'normal', + + /** + * This sets the font size of Container Queue shape for the diagram + * + * **Notes:** Default value: 14. + */ + container_queueFontSize: 14, + /** + * This sets the font family of Container Queue shape for the diagram + * + * **Notes:** Default value: "Open Sans", sans-serif. + */ + container_queueFontFamily: '"Open Sans", sans-serif', + /** + * This sets the font weight of Container Queue shape for the diagram + * + * **Notes:** Default value: normal. + */ + container_queueFontWeight: 'normal', + + /** + * This sets the font size of External Container Queue shape for the diagram + * + * **Notes:** Default value: 14. + */ + external_container_queueFontSize: 14, + /** + * This sets the font family of External Container Queue shape for the diagram + * + * **Notes:** Default value: "Open Sans", sans-serif. + */ + external_container_queueFontFamily: '"Open Sans", sans-serif', + /** + * This sets the font weight of External Container Queue shape for the diagram + * + * **Notes:** Default value: normal. + */ + external_container_queueFontWeight: 'normal', + + /** + * This sets the font size of Component shape for the diagram + * + * **Notes:** Default value: 14. + */ + componentFontSize: 14, + /** + * This sets the font family of Component shape for the diagram + * + * **Notes:** Default value: "Open Sans", sans-serif. + */ + componentFontFamily: '"Open Sans", sans-serif', + /** + * This sets the font weight of Component shape for the diagram + * + * **Notes:** Default value: normal. + */ + componentFontWeight: 'normal', + + /** + * This sets the font size of External Component shape for the diagram + * + * **Notes:** Default value: 14. + */ + external_componentFontSize: 14, + /** + * This sets the font family of External Component shape for the diagram + * + * **Notes:** Default value: "Open Sans", sans-serif. + */ + external_componentFontFamily: '"Open Sans", sans-serif', + /** + * This sets the font weight of External Component shape for the diagram + * + * **Notes:** Default value: normal. + */ + external_componentFontWeight: 'normal', + + /** + * This sets the font size of Component DB shape for the diagram + * + * **Notes:** Default value: 14. + */ + component_dbFontSize: 14, + /** + * This sets the font family of Component DB shape for the diagram + * + * **Notes:** Default value: "Open Sans", sans-serif. + */ + component_dbFontFamily: '"Open Sans", sans-serif', + /** + * This sets the font weight of Component DB shape for the diagram + * + * **Notes:** Default value: normal. + */ + component_dbFontWeight: 'normal', + + /** + * This sets the font size of External Component DB shape for the diagram + * + * **Notes:** Default value: 14. + */ + external_component_dbFontSize: 14, + /** + * This sets the font family of External Component DB shape for the diagram + * + * **Notes:** Default value: "Open Sans", sans-serif. + */ + external_component_dbFontFamily: '"Open Sans", sans-serif', + /** + * This sets the font weight of External Component DB shape for the diagram + * + * **Notes:** Default value: normal. + */ + external_component_dbFontWeight: 'normal', + + /** + * This sets the font size of Component Queue shape for the diagram + * + * **Notes:** Default value: 14. + */ + component_queueFontSize: 14, + /** + * This sets the font family of Component Queue shape for the diagram + * + * **Notes:** Default value: "Open Sans", sans-serif. + */ + component_queueFontFamily: '"Open Sans", sans-serif', + /** + * This sets the font weight of Component Queue shape for the diagram + * + * **Notes:** Default value: normal. + */ + component_queueFontWeight: 'normal', + + /** + * This sets the font size of External Component Queue shape for the diagram + * + * **Notes:** Default value: 14. + */ + external_component_queueFontSize: 14, + /** + * This sets the font family of External Component Queue shape for the diagram + * + * **Notes:** Default value: "Open Sans", sans-serif. + */ + external_component_queueFontFamily: '"Open Sans", sans-serif', + /** + * This sets the font weight of External Component Queue shape for the diagram + * + * **Notes:** Default value: normal. + */ + external_component_queueFontWeight: 'normal', + + /** + * This sets the auto-wrap state for the diagram + * + * **Notes:** Default value: true. + */ + wrap: true, + + /** + * This sets the auto-wrap padding for the diagram (sides only) + * + * **Notes:** Default value: 0. + */ + wrapPadding: 10, + + personFont: function () { + return { + fontFamily: this.personFontFamily, + fontSize: this.personFontSize, + fontWeight: this.personFontWeight, + }; + }, + + external_personFont: function () { + return { + fontFamily: this.external_personFontFamily, + fontSize: this.external_personFontSize, + fontWeight: this.external_personFontWeight, + }; + }, + + systemFont: function () { + return { + fontFamily: this.systemFontFamily, + fontSize: this.systemFontSize, + fontWeight: this.systemFontWeight, + }; + }, + + external_systemFont: function () { + return { + fontFamily: this.external_systemFontFamily, + fontSize: this.external_systemFontSize, + fontWeight: this.external_systemFontWeight, + }; + }, + + system_dbFont: function () { + return { + fontFamily: this.system_dbFontFamily, + fontSize: this.system_dbFontSize, + fontWeight: this.system_dbFontWeight, + }; + }, + + external_system_dbFont: function () { + return { + fontFamily: this.external_system_dbFontFamily, + fontSize: this.external_system_dbFontSize, + fontWeight: this.external_system_dbFontWeight, + }; + }, + + system_queueFont: function () { + return { + fontFamily: this.system_queueFontFamily, + fontSize: this.system_queueFontSize, + fontWeight: this.system_queueFontWeight, + }; + }, + + external_system_queueFont: function () { + return { + fontFamily: this.external_system_queueFontFamily, + fontSize: this.external_system_queueFontSize, + fontWeight: this.external_system_queueFontWeight, + }; + }, + + containerFont: function () { + return { + fontFamily: this.containerFontFamily, + fontSize: this.containerFontSize, + fontWeight: this.containerFontWeight, + }; + }, + + external_containerFont: function () { + return { + fontFamily: this.external_containerFontFamily, + fontSize: this.external_containerFontSize, + fontWeight: this.external_containerFontWeight, + }; + }, + + container_dbFont: function () { + return { + fontFamily: this.container_dbFontFamily, + fontSize: this.container_dbFontSize, + fontWeight: this.container_dbFontWeight, + }; + }, + + external_container_dbFont: function () { + return { + fontFamily: this.external_container_dbFontFamily, + fontSize: this.external_container_dbFontSize, + fontWeight: this.external_container_dbFontWeight, + }; + }, + + container_queueFont: function () { + return { + fontFamily: this.container_queueFontFamily, + fontSize: this.container_queueFontSize, + fontWeight: this.container_queueFontWeight, + }; + }, + + external_container_queueFont: function () { + return { + fontFamily: this.external_container_queueFontFamily, + fontSize: this.external_container_queueFontSize, + fontWeight: this.external_container_queueFontWeight, + }; + }, + + componentFont: function () { + return { + fontFamily: this.componentFontFamily, + fontSize: this.componentFontSize, + fontWeight: this.componentFontWeight, + }; + }, + + external_componentFont: function () { + return { + fontFamily: this.external_componentFontFamily, + fontSize: this.external_componentFontSize, + fontWeight: this.external_componentFontWeight, + }; + }, + + component_dbFont: function () { + return { + fontFamily: this.component_dbFontFamily, + fontSize: this.component_dbFontSize, + fontWeight: this.component_dbFontWeight, + }; + }, + + external_component_dbFont: function () { + return { + fontFamily: this.external_component_dbFontFamily, + fontSize: this.external_component_dbFontSize, + fontWeight: this.external_component_dbFontWeight, + }; + }, + + component_queueFont: function () { + return { + fontFamily: this.component_queueFontFamily, + fontSize: this.component_queueFontSize, + fontWeight: this.component_queueFontWeight, + }; + }, + + external_component_queueFont: function () { + return { + fontFamily: this.external_component_queueFontFamily, + fontSize: this.external_component_queueFontSize, + fontWeight: this.external_component_queueFontWeight, + }; + }, + + boundaryFont: function () { + return { + fontFamily: this.boundaryFontFamily, + fontSize: this.boundaryFontSize, + fontWeight: this.boundaryFontWeight, + }; + }, + + messageFont: function () { + return { + fontFamily: this.messageFontFamily, + fontSize: this.messageFontSize, + fontWeight: this.messageFontWeight, + }; + }, + + // ' Colors + // ' ################################## + person_bg_color: '#08427B', + person_border_color: '#073B6F', + external_person_bg_color: '#686868', + external_person_border_color: '#8A8A8A', + system_bg_color: '#1168BD', + system_border_color: '#3C7FC0', + system_db_bg_color: '#1168BD', + system_db_border_color: '#3C7FC0', + system_queue_bg_color: '#1168BD', + system_queue_border_color: '#3C7FC0', + external_system_bg_color: '#999999', + external_system_border_color: '#8A8A8A', + external_system_db_bg_color: '#999999', + external_system_db_border_color: '#8A8A8A', + external_system_queue_bg_color: '#999999', + external_system_queue_border_color: '#8A8A8A', + container_bg_color: '#438DD5', + container_border_color: '#3C7FC0', + container_db_bg_color: '#438DD5', + container_db_border_color: '#3C7FC0', + container_queue_bg_color: '#438DD5', + container_queue_border_color: '#3C7FC0', + external_container_bg_color: '#B3B3B3', + external_container_border_color: '#A6A6A6', + external_container_db_bg_color: '#B3B3B3', + external_container_db_border_color: '#A6A6A6', + external_container_queue_bg_color: '#B3B3B3', + external_container_queue_border_color: '#A6A6A6', + component_bg_color: '#85BBF0', + component_border_color: '#78A8D8', + component_db_bg_color: '#85BBF0', + component_db_border_color: '#78A8D8', + component_queue_bg_color: '#85BBF0', + component_queue_border_color: '#78A8D8', + external_component_bg_color: '#CCCCCC', + external_component_border_color: '#BFBFBF', + external_component_db_bg_color: '#CCCCCC', + external_component_db_border_color: '#BFBFBF', + external_component_queue_bg_color: '#CCCCCC', + external_component_queue_border_color: '#BFBFBF', + }, + mindmap: { + useMaxWidth: true, + padding: 10, + maxNodeWidth: 200, + }, + sankey: { + width: 600, + height: 400, + linkColor: 'gradient', + nodeAlignment: 'justify', + useMaxWidth: false, + }, + fontSize: 16, +}; + +if (config.class) { + config.class.arrowMarkerAbsolute = config.arrowMarkerAbsolute; +} +if (config.gitGraph) { + config.gitGraph.arrowMarkerAbsolute = config.arrowMarkerAbsolute; +} + +const keyify = (obj: any, prefix = ''): string[] => + Object.keys(obj).reduce((res: string[], el): string[] => { + if (Array.isArray(obj[el])) { + return res; + } else if (typeof obj[el] === 'object' && obj[el] !== null) { + return [...res, prefix + el, ...keyify(obj[el], '')]; + } + return [...res, prefix + el]; + }, []); + +export const configKeys: string[] = keyify(config, ''); +export default config; diff --git a/packages/mermaid/src/schemas/config.schema.yaml b/packages/mermaid/src/schemas/config.schema.yaml new file mode 100644 index 000000000..306aab2cc --- /dev/null +++ b/packages/mermaid/src/schemas/config.schema.yaml @@ -0,0 +1,1886 @@ +# Used for VS Code's YAML plugin to automatically error on invalid types +# yaml-language-server: $schema=https://json-schema.org/draft/2019-09/schema + +# This file defines the MermaidConfig JSON Schema as a YAML file. +# +# From this file, the following things can be generated: +# - `scripts/create-types-from-json-schema.mjs` +# Used to generate the `src/config.type.ts` TypeScript types for MermaidConfig +# with the `json-schema-to-typescript` NPM package. +# - `.vite/jsonSchemaPlugin.ts` +# Used to generate the default values from the `default` keys in this +# JSON Schema using the `ajv` NPM package. +# Non-JSON values, like functions or `undefined`, still need to be manually +# set in `src/defaultConfig.ts`) +# - `src/docs.mts` +# Used to genereate Markdown documentation for this JSON Schema by using +# the `@adobe/jsonschema2md` NPM package. + +# Useful things to know when editting this file +# - Use the `|` character for multi-line strings +# - Use `meta:enum` to document enum values (from jsonschema2md) +# - Use `tsType` to override the TypeScript type (from json-schema-to-typescript) +# - If adding a new object to `MermaidConfig` (e.g. a new diagram type), +# you may need to add it to `.vite/jsonSchemaPlugin.ts` and `src/docs.mts` +# to get the docs/default values to generate properly. +$id: https://mermaid-js.github.io/schemas/config.schema.json +$schema: https://json-schema.org/draft/2019-09/schema +title: Mermaid Config +type: object +additionalProperties: false +required: + - fontFamily + - logLevel + - securityLevel + - startOnLoad + - arrowMarkerAbsolute + - flowchart + - sequence + - gantt + - journey + - class + - state + - er + - pie + - quadrantChart + - requirement + - mindmap + - gitGraph + - c4 + - sankey +properties: + theme: + description: | + Theme, the CSS style sheet. + You may also use `themeCSS` to override this value. + type: string + enum: + - default + - forest + - dark + - neutral + - 'null' # should this be a `null`-type? + meta:enum: + 'null': Can be set to disable any pre-defined mermaid theme + default: 'default' + # Allow any string for typescript backwards compatibility (fix in Mermaid v10) + tsType: 'string | "default" | "forest" | "dark" | "neutral" | "null"' + themeVariables: + tsType: any + themeCSS: + type: string + maxTextSize: + description: The maximum allowed size of the users text diagram + type: number + default: 50000 + darkMode: + type: boolean + default: false + htmlLabels: + type: boolean # maybe unused, seems to be copied in each diagram config + fontFamily: + description: | + Specifies the font to be used in the rendered diagrams. + Can be any possible CSS `font-family`. + See https://developer.mozilla.org/en-US/docs/Web/CSS/font-family + type: string + default: '"trebuchet ms", verdana, arial, sans-serif;' + altFontFamily: + # TODO: seems to be unused, except for in tests + type: string + logLevel: + description: | + This option decides the amount of logging to be used by mermaid. + type: + - string + - number + enum: + - trace + - 0 + - debug + - 1 + - info + - 2 + - warn + - 3 + - error + - 4 + - fatal + - 5 + meta:enum: + trace: Equivalent to 0 + debug: Equivalent to 1 + info: Equivalent to 2 + warn: Equivalent to 3 + error: Equivalent to 4 + fatal: Equivalent to 5 (default) + default: 5 + # Allow any number or string for typescript backwards compatibility (fix in Mermaid v10) + tsType: 'number | string | 0 | 2 | 1 | "trace" | "debug" | "info" | "warn" | "error" | "fatal" | 3 | 4 | 5 | undefined' + securityLevel: + description: Level of trust for parsed diagram + type: string + enum: + - strict + - loose + - antiscript + - sandbox + meta:enum: + strict: (**default**) HTML tags in the text are encoded and click functionality is disabled. + antiscript: HTML tags in text are allowed (only script elements are removed), and click functionality is enabled. + loose: HTML tags in text are allowed and click functionality is enabled. + sandbox: | + With this security level, all rendering takes place in a sandboxed iframe. + This prevent any JavaScript from running in the context. + This may hinder interactive functionality of the diagram, like scripts, popups in the sequence diagram, or links to other tabs or targets, etc. + default: strict + # Allow any string for typescript backwards compatibility (fix in Mermaid v10) + tsType: 'string | "strict" | "loose" | "antiscript" | "sandbox" | undefined' + startOnLoad: + description: Dictates whether mermaid starts on Page load + type: boolean + default: true + arrowMarkerAbsolute: + &arrowMarkerAbsolute # YAML anchor, can be used later with `*arrowMarkerAbsolute` + description: | + Controls whether or arrow markers in html code are absolute paths or anchors. + This matters if you are using base tag settings. + type: boolean + default: false + secure: + description: | + This option controls which `currentConfig` keys are considered secure and + can only be changed via call to `mermaidAPI.initialize`. + Calls to `mermaidAPI.reinitialize` cannot make changes to the secure keys + in the current `currentConfig`. + + This prevents malicious graph directives from overriding a site's default security. + default: ['secure', 'securityLevel', 'startOnLoad', 'maxTextSize'] + type: array + items: + type: string + uniqueItems: false # Should be enabled, but it may be a breaking change from the old config + deterministicIds: + description: | + This option controls if the generated ids of nodes in the SVG are + generated randomly or based on a seed. + If set to `false`, the IDs are generated based on the current date and + thus are not deterministic. This is the default behavior. + + This matters if your files are checked into source control e.g. git and + should not change unless content is changed. + type: boolean + default: false + deterministicIDSeed: + description: | + This option is the optional seed for deterministic ids. + If set to `undefined` but deterministicIds is `true`, a simple number iterator is used. + You can set this attribute to base the seed on a static string. + type: string + flowchart: + $ref: '#/$defs/FlowchartDiagramConfig' + sequence: + $ref: '#/$defs/SequenceDiagramConfig' + gantt: + $ref: '#/$defs/GanttDiagramConfig' + journey: + $ref: '#/$defs/JourneyDiagramConfig' + timeline: + $ref: '#/$defs/TimelineDiagramConfig' + class: + $ref: '#/$defs/ClassDiagramConfig' + state: + $ref: '#/$defs/StateDiagramConfig' + er: + $ref: '#/$defs/ErDiagramConfig' + pie: + $ref: '#/$defs/PieDiagramConfig' + quadrantChart: + $ref: '#/$defs/QuadrantChartConfig' + requirement: + $ref: '#/$defs/RequirementDiagramConfig' + mindmap: + $ref: '#/$defs/MindmapDiagramConfig' + gitGraph: + $ref: '#/$defs/GitGraphDiagramConfig' + c4: + $ref: '#/$defs/C4DiagramConfig' + sankey: + $ref: '#/$defs/SankeyDiagramConfig' + dompurifyConfig: + title: DOM Purify Configuration + description: Configuration options to pass to the `dompurify` library. + type: object + tsType: "import('dompurify').Config" + wrap: + type: boolean + fontSize: + type: number + default: 16 + +$defs: # JSON Schema definition (maybe we should move these to a seperate file) + BaseDiagramConfig: + # TODO: More config needs to be moved here + title: Base Diagram Config + type: object + properties: + useWidth: + type: number + useMaxWidth: + description: | + When this flag is set to `true`, the height and width is set to 100% + and is then scaled with the available space. + If set to `false`, the absolute space required is used. + type: boolean + default: true + C4DiagramConfig: + title: C4 Diagram Config + allOf: [{ $ref: '#/$defs/BaseDiagramConfig' }] + description: The object containing configurations specific for c4 diagrams + type: object + unevaluatedProperties: false + required: + - diagramMarginX + - diagramMarginY + - c4ShapeMargin + - c4ShapePadding + - width + - height + - boxMargin + - useMaxWidth + - c4ShapeInRow + - c4BoundaryInRow + properties: + diagramMarginX: + description: | + Margin to the right and left of the c4 diagram, must be a positive value. + type: integer + default: 50 + minimum: 0 + diagramMarginY: + description: | + Margin to the over and under the c4 diagram, must be a positive value. + type: integer + default: 10 + minimum: 0 + c4ShapeMargin: + description: Margin between shapes + type: integer + default: 50 + minimum: 0 + c4ShapePadding: + description: Padding between shapes + type: integer + default: 20 + minimum: 0 + width: + description: Width of person boxes + type: integer + default: 216 + minimum: 0 + height: + description: Height of person boxes + type: integer + default: 60 + minimum: 0 + boxMargin: + description: Margin around boxes + type: integer + default: 10 + minimum: 0 + c4ShapeInRow: + description: How many shapes to place in each row. + type: integer + default: 4 + minimum: 0 + nextLinePaddingX: + # TODO: add description + type: number + default: 0 + c4BoundaryInRow: + description: How many boundaries to place in each row. + type: integer + default: 2 + minimum: 0 + + # --------------------------------------------------------------------- # + # Default font values + # --------------------------------------------------------------------- # + personFontSize: + description: This sets the font size of Person shape for the diagram + type: &fontSizeType ['string', 'number'] # YAML anchor + default: 14 + personFontFamily: + description: This sets the font weight of Person shape for the diagram + type: string + default: '"Open Sans", sans-serif' + personFontWeight: + description: This sets the font weight of Person shape for the diagram + type: ['string', 'number'] + default: normal + external_personFontSize: + description: This sets the font size of External Person shape for the diagram + type: *fontSizeType + default: 14 + external_personFontFamily: + description: This sets the font family of External Person shape for the diagram + type: string + default: '"Open Sans", sans-serif' + external_personFontWeight: + description: This sets the font weight of External Person shape for the diagram + type: ['string', 'number'] + default: normal + systemFontSize: + description: This sets the font size of System shape for the diagram + type: *fontSizeType + default: 14 + systemFontFamily: + description: This sets the font family of System shape for the diagram + type: string + default: '"Open Sans", sans-serif' + systemFontWeight: + description: This sets the font weight of System shape for the diagram + type: ['string', 'number'] + default: normal + external_systemFontSize: + description: This sets the font size of External System shape for the diagram + type: *fontSizeType + default: 14 + external_systemFontFamily: + description: This sets the font family of External System shape for the diagram + type: string + default: '"Open Sans", sans-serif' + external_systemFontWeight: + description: This sets the font weight of External System shape for the diagram + type: ['string', 'number'] + default: normal + system_dbFontSize: + description: This sets the font size of System DB shape for the diagram + type: *fontSizeType + default: 14 + system_dbFontFamily: + description: This sets the font family of System DB shape for the diagram + type: string + default: '"Open Sans", sans-serif' + system_dbFontWeight: + description: This sets the font weight of System DB shape for the diagram + type: ['string', 'number'] + default: normal + external_system_dbFontSize: + description: This sets the font size of External System DB shape for the diagram + type: *fontSizeType + default: 14 + external_system_dbFontFamily: + description: This sets the font family of External System DB shape for the diagram + type: string + default: '"Open Sans", sans-serif' + external_system_dbFontWeight: + description: This sets the font weight of External System DB shape for the diagram + type: ['string', 'number'] + default: normal + system_queueFontSize: + description: This sets the font size of System Queue shape for the diagram + type: *fontSizeType + default: 14 + system_queueFontFamily: + description: This sets the font family of System Queue shape for the diagram + type: string + default: '"Open Sans", sans-serif' + system_queueFontWeight: + description: This sets the font weight of System Queue shape for the diagram + type: ['string', 'number'] + default: normal + external_system_queueFontSize: + description: This sets the font size of External System Queue shape for the diagram + type: *fontSizeType + default: 14 + external_system_queueFontFamily: + description: This sets the font family of External System Queue shape for the diagram + type: string + default: '"Open Sans", sans-serif' + external_system_queueFontWeight: + description: This sets the font weight of External System Queue shape for the diagram + type: ['string', 'number'] + default: normal + boundaryFontSize: + description: This sets the font size of Boundary shape for the diagram + type: *fontSizeType + default: 14 + boundaryFontFamily: + description: This sets the font family of Boundary shape for the diagram + type: string + default: '"Open Sans", sans-serif' + boundaryFontWeight: + description: This sets the font weight of Boundary shape for the diagram + type: ['string', 'number'] + default: normal + messageFontSize: + description: This sets the font size of Message shape for the diagram + type: *fontSizeType + default: 12 + messageFontFamily: + description: This sets the font family of Message shape for the diagram + type: string + default: '"Open Sans", sans-serif' + messageFontWeight: + description: This sets the font weight of Message shape for the diagram + type: ['string', 'number'] + default: normal + + containerFontSize: + description: This sets the font size of Container shape for the diagram + type: *fontSizeType + default: 14 + containerFontFamily: + description: This sets the font family of Container shape for the diagram + type: string + default: '"Open Sans", sans-serif' + containerFontWeight: + description: This sets the font weight of Container shape for the diagram + type: ['string', 'number'] + default: normal + external_containerFontSize: + description: This sets the font size of External Container shape for the diagram + type: *fontSizeType + default: 14 + external_containerFontFamily: + description: This sets the font family of External Container shape for the diagram + type: string + default: '"Open Sans", sans-serif' + external_containerFontWeight: + description: This sets the font weight of External Container shape for the diagram + type: ['string', 'number'] + default: normal + + container_dbFontSize: + description: This sets the font size of Container DB shape for the diagram + type: *fontSizeType + default: 14 + container_dbFontFamily: + description: This sets the font family of Container DB shape for the diagram + type: string + default: '"Open Sans", sans-serif' + container_dbFontWeight: + description: This sets the font weight of Container DB shape for the diagram + type: ['string', 'number'] + default: normal + external_container_dbFontSize: + description: This sets the font size of External Container DB shape for the diagram + type: *fontSizeType + default: 14 + external_container_dbFontFamily: + description: This sets the font family of External Container DB shape for the diagram + type: string + default: '"Open Sans", sans-serif' + external_container_dbFontWeight: + description: This sets the font weight of External Container DB shape for the diagram + type: ['string', 'number'] + default: normal + + container_queueFontSize: + description: This sets the font size of Container Queue shape for the diagram + type: *fontSizeType + default: 14 + container_queueFontFamily: + description: This sets the font family of Container Queue shape for the diagram + type: string + default: '"Open Sans", sans-serif' + container_queueFontWeight: + description: This sets the font weight of Container Queue shape for the diagram + type: ['string', 'number'] + default: normal + external_container_queueFontSize: + description: This sets the font size of External Container Queue shape for the diagram + type: *fontSizeType + default: 14 + external_container_queueFontFamily: + description: This sets the font family of External Container Queue shape for the diagram + type: string + default: '"Open Sans", sans-serif' + external_container_queueFontWeight: + description: This sets the font weight of External Container Queue shape for the diagram + type: ['string', 'number'] + default: normal + + componentFontSize: + description: This sets the font size of Component shape for the diagram + type: *fontSizeType + default: 14 + componentFontFamily: + description: This sets the font family of Component shape for the diagram + type: string + default: '"Open Sans", sans-serif' + componentFontWeight: + description: This sets the font weight of Component shape for the diagram + type: ['string', 'number'] + default: normal + external_componentFontSize: + description: This sets the font size of External Component shape for the diagram + type: *fontSizeType + default: 14 + external_componentFontFamily: + description: This sets the font family of External Component shape for the diagram + type: string + default: '"Open Sans", sans-serif' + external_componentFontWeight: + description: This sets the font weight of External Component shape for the diagram + type: ['string', 'number'] + default: normal + + component_dbFontSize: + description: This sets the font size of Component DB shape for the diagram + type: *fontSizeType + default: 14 + component_dbFontFamily: + description: This sets the font family of Component DB shape for the diagram + type: string + default: '"Open Sans", sans-serif' + component_dbFontWeight: + description: This sets the font weight of Component DB shape for the diagram + type: ['string', 'number'] + default: normal + external_component_dbFontSize: + description: This sets the font size of External Component DB shape for the diagram + type: *fontSizeType + default: 14 + external_component_dbFontFamily: + description: This sets the font family of External Component DB shape for the diagram + type: string + default: '"Open Sans", sans-serif' + external_component_dbFontWeight: + description: This sets the font weight of External Component DB shape for the diagram + type: ['string', 'number'] + default: normal + + component_queueFontSize: + description: This sets the font size of Component Queue shape for the diagram + type: *fontSizeType + default: 14 + component_queueFontFamily: + description: This sets the font family of Component Queue shape for the diagram + type: string + default: '"Open Sans", sans-serif' + component_queueFontWeight: + description: This sets the font weight of Component Queue shape for the diagram + type: ['string', 'number'] + default: normal + external_component_queueFontSize: + description: This sets the font size of External Component Queue shape for the diagram + type: *fontSizeType + default: 14 + external_component_queueFontFamily: + description: This sets the font family of External Component Queue shape for the diagram + type: string + default: '"Open Sans", sans-serif' + external_component_queueFontWeight: + description: This sets the font weight of External Component Queue shape for the diagram + type: ['string', 'number'] + default: normal + + wrap: + description: This sets the auto-wrap state for the diagram + type: boolean + default: true + wrapPadding: + description: This sets the auto-wrap padding for the diagram (sides only) + type: number + default: 10 + + # --------------------------------------------------------------------- # + # Colors + # --------------------------------------------------------------------- # + person_bg_color: + type: string + default: '#08427B' + person_border_color: + type: string + default: '#073B6F' + external_person_bg_color: + type: string + default: '#686868' + external_person_border_color: + type: string + default: '#8A8A8A' + system_bg_color: + type: string + default: '#1168BD' + system_border_color: + type: string + default: '#3C7FC0' + system_db_bg_color: + type: string + default: '#1168BD' + system_db_border_color: + type: string + default: '#3C7FC0' + system_queue_bg_color: + type: string + default: '#1168BD' + system_queue_border_color: + type: string + default: '#3C7FC0' + external_system_bg_color: + type: string + default: '#999999' + external_system_border_color: + type: string + default: '#8A8A8A' + external_system_db_bg_color: + type: string + default: '#999999' + external_system_db_border_color: + type: string + default: '#8A8A8A' + external_system_queue_bg_color: + type: string + default: '#999999' + external_system_queue_border_color: + type: string + default: '#8A8A8A' + container_bg_color: + type: string + default: '#438DD5' + container_border_color: + type: string + default: '#3C7FC0' + container_db_bg_color: + type: string + default: '#438DD5' + container_db_border_color: + type: string + default: '#3C7FC0' + container_queue_bg_color: + type: string + default: '#438DD5' + container_queue_border_color: + type: string + default: '#3C7FC0' + external_container_bg_color: + type: string + default: '#B3B3B3' + external_container_border_color: + type: string + default: '#A6A6A6' + external_container_db_bg_color: + type: string + default: '#B3B3B3' + external_container_db_border_color: + type: string + default: '#A6A6A6' + external_container_queue_bg_color: + type: string + default: '#B3B3B3' + external_container_queue_border_color: + type: string + default: '#A6A6A6' + component_bg_color: + type: string + default: '#85BBF0' + component_border_color: + type: string + default: '#78A8D8' + component_db_bg_color: + type: string + default: '#85BBF0' + component_db_border_color: + type: string + default: '#78A8D8' + component_queue_bg_color: + type: string + default: '#85BBF0' + component_queue_border_color: + type: string + default: '#78A8D8' + external_component_bg_color: + type: string + default: '#CCCCCC' + external_component_border_color: + type: string + default: '#BFBFBF' + external_component_db_bg_color: + type: string + default: '#CCCCCC' + external_component_db_border_color: + type: string + default: '#BFBFBF' + external_component_queue_bg_color: + type: string + default: '#CCCCCC' + external_component_queue_border_color: + type: string + default: '#BFBFBF' + + # Font Calculators + # By default, these all return the values from this configuration. + personFont: { '$ref': '#/$defs/FontCalculator' } + external_personFont: { '$ref': '#/$defs/FontCalculator' } + systemFont: { '$ref': '#/$defs/FontCalculator' } + external_systemFont: { '$ref': '#/$defs/FontCalculator' } + system_dbFont: { '$ref': '#/$defs/FontCalculator' } + external_system_dbFont: { '$ref': '#/$defs/FontCalculator' } + system_queueFont: { '$ref': '#/$defs/FontCalculator' } + external_system_queueFont: { '$ref': '#/$defs/FontCalculator' } + containerFont: { '$ref': '#/$defs/FontCalculator' } + external_containerFont: { '$ref': '#/$defs/FontCalculator' } + container_dbFont: { '$ref': '#/$defs/FontCalculator' } + external_container_dbFont: { '$ref': '#/$defs/FontCalculator' } + container_queueFont: { '$ref': '#/$defs/FontCalculator' } + external_container_queueFont: { '$ref': '#/$defs/FontCalculator' } + componentFont: { '$ref': '#/$defs/FontCalculator' } + external_componentFont: { '$ref': '#/$defs/FontCalculator' } + component_dbFont: { '$ref': '#/$defs/FontCalculator' } + external_component_dbFont: { '$ref': '#/$defs/FontCalculator' } + component_queueFont: { '$ref': '#/$defs/FontCalculator' } + external_component_queueFont: { '$ref': '#/$defs/FontCalculator' } + boundaryFont: { '$ref': '#/$defs/FontCalculator' } + messageFont: { '$ref': '#/$defs/FontCalculator' } + + GitGraphDiagramConfig: + title: Git Graph Diagram Config + allOf: [{ $ref: '#/$defs/BaseDiagramConfig' }] + type: object + unevaluatedProperties: false + required: + - titleTopMargin + properties: + titleTopMargin: + # TODO: I've removed the `Git` part from this description, so that I + # could $ref: "#/$defs/GitGraphDiagramConfig/properties/titleTopMargin" + # this field in other diagrams + description: Margin top for the text over the diagram + type: integer + default: 25 + minimum: 0 + diagramPadding: + type: number + default: 8 + nodeLabel: + allOf: [{ $ref: '#/$defs/NodeLabel' }] + type: object + default: + width: 75 + height: 100 + x: -25 + y: 0 + mainBranchName: + type: string + default: 'main' + mainBranchOrder: + type: number + default: 0 + showCommitLabel: + type: boolean + default: true + showBranches: + type: boolean + default: true + rotateCommitLabel: + type: boolean + default: true + # YAML anchor reference, don't use $ref since ajv doesn't load defaults + arrowMarkerAbsolute: *arrowMarkerAbsolute + + NodeLabel: + title: Node Label + type: object + properties: + width: + type: number + height: + type: number + x: + type: number + y: + type: number + + RequirementDiagramConfig: + title: Requirement Diagram Config + allOf: [{ $ref: '#/$defs/BaseDiagramConfig' }] + description: The object containing configurations specific for req diagrams + type: object + unevaluatedProperties: false + required: + - useMaxWidth + properties: + rect_fill: + type: string + default: '#f9f9f9' + text_color: + type: string + default: '#333' + rect_border_size: + type: string + default: '0.5px' + rect_border_color: + type: string + default: '#bbb' + rect_min_width: + type: number + default: 200 + rect_min_height: + type: number + default: 200 + fontSize: + type: number # TODO, should this be `type: *fontSizeType` (aka string too) + default: 14 + rect_padding: + type: number + default: 10 + line_height: + type: number + default: 20 + + MindmapDiagramConfig: + title: Mindmap Diagram Config + allOf: [{ $ref: '#/$defs/BaseDiagramConfig' }] + description: The object containing configurations specific for mindmap diagrams + type: object + unevaluatedProperties: false + required: + - useMaxWidth + - padding + - maxNodeWidth + properties: + padding: + type: number + default: 10 + maxNodeWidth: + type: number + default: 200 + + PieDiagramConfig: + title: Pie Diagram Config + allOf: [{ $ref: '#/$defs/BaseDiagramConfig' }] + type: object + unevaluatedProperties: false + properties: + textPosition: + type: number + minimum: 0 + maximum: 1 + description: | + Axial position of slice's label from zero at the center to 1 at the outside edges. + default: 0.75 + + QuadrantChartConfig: + title: Quadrant Chart Config + allOf: [{ $ref: '#/$defs/BaseDiagramConfig' }] + type: object + unevaluatedProperties: false + required: + - chartWidth + - chartHeight + - titleFontSize + - titlePadding + - quadrantPadding + - xAxisLabelPadding + - yAxisLabelPadding + - xAxisLabelFontSize + - yAxisLabelFontSize + - quadrantLabelFontSize + - quadrantTextTopPadding + - pointTextPadding + - pointLabelFontSize + - pointRadius + - xAxisPosition + - yAxisPosition + - quadrantInternalBorderStrokeWidth + - quadrantExternalBorderStrokeWidth + - useMaxWidth + properties: + chartWidth: + description: Width of the chart + type: number + minimum: 0 + default: 500 + chartHeight: + description: Height of the chart + type: number + minimum: 0 + default: 500 + titleFontSize: + description: Chart title top and bottom padding + type: number + minimum: 0 + default: 20 + titlePadding: + description: Padding around the quadrant square + type: number + minimum: 0 + default: 10 + quadrantPadding: + description: quadrant title padding from top if the quadrant is rendered on top + type: number + minimum: 0 + default: 5 + xAxisLabelPadding: + description: Padding around x-axis labels + type: number + minimum: 0 + default: 5 + yAxisLabelPadding: + description: Padding around y-axis labels + type: number + minimum: 0 + default: 5 + xAxisLabelFontSize: + description: x-axis label font size + type: number + minimum: 0 + default: 16 + yAxisLabelFontSize: + description: y-axis label font size + type: number + minimum: 0 + default: 16 + quadrantLabelFontSize: + description: quadrant title font size + type: number + minimum: 0 + default: 16 + quadrantTextTopPadding: + description: quadrant title padding from top if the quadrant is rendered on top + type: number + minimum: 0 + default: 5 + pointTextPadding: + description: padding between point and point label + type: number + minimum: 0 + default: 5 + pointLabelFontSize: + description: point title font size + type: number + minimum: 0 + default: 12 + pointRadius: + description: radius of the point to be drawn + type: number + minimum: 0 + default: 5 + xAxisPosition: + description: position of x-axis labels + type: string + enum: + - top + - bottom + default: top + yAxisPosition: + description: position of y-axis labels + type: string + enum: + - left + - right + default: left + quadrantInternalBorderStrokeWidth: + description: stroke width of edges of the box that are inside the quadrant + type: number + minimum: 0 + default: 1 + quadrantExternalBorderStrokeWidth: + description: stroke width of edges of the box that are outside the quadrant + type: number + minimum: 0 + default: 2 + + ErDiagramConfig: + title: Er Diagram Config + allOf: [{ $ref: '#/$defs/BaseDiagramConfig' }] + description: The object containing configurations specific for entity relationship diagrams + type: object + unevaluatedProperties: false + required: + - titleTopMargin + - diagramPadding + - layoutDirection + - minEntityWidth + - minEntityHeight + - entityPadding + - stroke + - fill + # TODO: fontSize is the only property that is not required, is this correct? + - useMaxWidth + properties: + titleTopMargin: + $ref: '#/$defs/GitGraphDiagramConfig/properties/titleTopMargin' + default: 25 + diagramPadding: + description: | + The amount of padding around the diagram as a whole so that embedded + diagrams have margins, expressed in pixels. + type: integer + default: 20 + minimum: 0 + layoutDirection: + description: Directional bias for layout of entities + type: string + enum: ['TB', 'BT', 'LR', 'RL'] + meta:enum: + TB: Top-Bottom + BT: Bottom-Top + LR: Left-Right + RL: Right to Left + default: TB + # Allow any string for typescript backwards compatibility (fix in Mermaid v10) + tsType: 'string | "TB" | "BT" | "LR" | "RL"' + minEntityWidth: + description: The minimum width of an entity box. Expressed in pixels. + type: integer + default: 100 + minimum: 0 + minEntityHeight: + description: The minimum height of an entity box. Expressed in pixels. + type: integer + default: 75 + minimum: 0 + entityPadding: + description: | + The minimum internal padding between text in an entity box and the enclosing box borders. + Expressed in pixels. + type: integer + default: 15 + minimum: 0 + stroke: + description: Stroke color of box edges and lines. + type: string + default: gray + fill: + description: Fill color of entity boxes + type: string + default: honeydew + fontSize: + description: Font size (expressed as an integer representing a number of pixels) + type: integer + default: 12 + minimum: 0 + + StateDiagramConfig: + title: State Diagram Config + allOf: [{ $ref: '#/$defs/BaseDiagramConfig' }] + description: The object containing configurations specific for entity relationship diagrams + type: object + unevaluatedProperties: false + required: + - titleTopMargin + - useMaxWidth + - defaultRenderer + properties: + titleTopMargin: + $ref: '#/$defs/GitGraphDiagramConfig/properties/titleTopMargin' + default: 25 + arrowMarkerAbsolute: + # TODO: use $ref: '#/properties/arrowMarkerAbsolute' to copy main setting + type: boolean + dividerMargin: + type: number + default: 10 + sizeUnit: + type: number + default: 5 + padding: + type: number + default: 8 + textHeight: + type: number + default: 10 + titleShift: + type: number + default: -15 + noteMargin: + type: number + default: 10 + forkWidth: + type: number + default: 70 + forkHeight: + type: number + default: 7 + # Used + miniPadding: + type: number + default: 2 + fontSizeFactor: + description: | + 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 + type: number + default: 5.02 + fontSize: + type: number + default: 24 + labelHeight: + type: number + default: 16 + edgeLengthFactor: + type: string + default: '20' + compositTitleSize: + type: number + default: 35 + radius: + type: number + default: 5 + defaultRenderer: + description: | + Decides which rendering engine that is to be used for the rendering. + type: string + enum: + - dagre-d3 + - dagre-wrapper + - elk + # todo, check this, old docs said dagre-d3 even though value was dagre-wrapper + default: dagre-wrapper + meta:enum: + dagre-d3: The [dagre-d3-es](https://www.npmjs.com/package/dagre-d3-es) library. + dagre-wrapper: wrapper for dagre implemented in mermaid + elk: Layout using [elkjs](https://github.com/kieler/elkjs) + # Allow any string for typescript backwards compatibility (fix in Mermaid v10) + tsType: 'string | "dagre-d3" | "dagre-wrapper" | "elk"' + + ClassDiagramConfig: + title: Class Diagram Config + allOf: [{ $ref: '#/$defs/BaseDiagramConfig' }] + type: object + unevaluatedProperties: false + required: + - titleTopMargin + - useMaxWidth + - defaultRenderer + properties: + titleTopMargin: + $ref: '#/$defs/GitGraphDiagramConfig/properties/titleTopMargin' + default: 25 + # YAML anchor reference, don't use $ref since ajv doesn't load defaults + arrowMarkerAbsolute: *arrowMarkerAbsolute + dividerMargin: + type: number + default: 10 + padding: + type: number + default: 5 + textHeight: + type: number + default: 10 + defaultRenderer: + $ref: '#/$defs/StateDiagramConfig/properties/defaultRenderer' + default: dagre-wrapper + nodeSpacing: + type: integer + minimum: 0 + # should the default value be 50? + # see https://github.com/mermaid-js/mermaid/blob/7647ae317a7b2130e32777248d25a9c4d24b8f9f/packages/mermaid/src/diagrams/class/classRenderer-v2.ts#L258 + rankSpacing: + type: integer + minimum: 0 + # should the default value be 50? + # see https://github.com/mermaid-js/mermaid/blob/7647ae317a7b2130e32777248d25a9c4d24b8f9f/packages/mermaid/src/diagrams/class/classRenderer-v2.ts#L259 + diagramPadding: + $ref: '#/$defs/ErDiagramConfig/properties/diagramPadding' + htmlLabels: + type: boolean + default: false + + JourneyDiagramConfig: + title: Journey Diagram Config + allOf: [{ $ref: '#/$defs/BaseDiagramConfig' }] + description: | + The object containing configurations specific for journey diagrams + type: object + unevaluatedProperties: false + required: + - diagramMarginX + - diagramMarginY + - leftMargin + - width + - height + - boxMargin + - boxTextMargin + - noteMargin + - messageMargin + - messageAlign + - bottomMarginAdj + - useMaxWidth + - rightAngles + properties: + diagramMarginX: + $ref: '#/$defs/C4DiagramConfig/properties/diagramMarginX' + default: 50 + diagramMarginY: + $ref: '#/$defs/C4DiagramConfig/properties/diagramMarginY' + default: 10 + leftMargin: + description: Margin between actors + type: integer + default: 150 + minimum: 0 + width: + description: Width of actor boxes + type: integer + default: 150 + minimum: 0 + height: + description: Height of actor boxes + type: integer + default: 50 + minimum: 0 + boxMargin: + description: Margin around loop boxes + type: integer + default: 10 + minimum: 0 + boxTextMargin: + description: Margin around the text in loop/alt/opt boxes + type: integer + default: 5 + minimum: 0 + noteMargin: + description: Margin around notes + type: integer + default: 10 + minimum: 0 + messageMargin: + description: Space between messages. + type: integer + default: 35 + minimum: 0 + messageAlign: + description: Multiline message alignment + type: string + enum: + - left + - center + - right + default: center + # Allow any string for typescript backwards compatibility (fix in Mermaid v10) + tsType: 'string | "left" | "center" | "right"' + bottomMarginAdj: + description: | + Prolongs the edge of the diagram downwards. + + Depending on css styling this might need adjustment. + type: integer + default: 1 + minimum: 0 + rightAngles: + description: | + Curved Arrows become Right Angles + + This will display arrows that start and begin at the same node as + right angles, rather than as curves. + type: boolean + default: false + taskFontSize: + type: *fontSizeType + default: 14 + taskFontFamily: + type: string + default: '"Open Sans", sans-serif' + taskMargin: + type: number + default: 50 + activationWidth: + description: Width of activation box + type: number + default: 10 + textPlacement: + description: | + text placement as: tspan | fo | old only text as before + type: string + # TODO, should this be an enum? + default: fo + actorColours: + type: array + items: + type: string + default: ['#8FBC8F', '#7CFC00', '#00FFFF', '#20B2AA', '#B0E0E6', '#FFFFE0'] + sectionFills: + type: array + items: + type: string + default: ['#191970', '#8B008B', '#4B0082', '#2F4F4F', '#800000', '#8B4513', '#00008B'] + sectionColours: + type: array + items: + type: string + default: ['#fff'] + + TimelineDiagramConfig: + # added by https://github.com/mermaid-js/mermaid/commit/0d5246fbc730bf15463d7183fe4400a1e2fc492c + title: Timeline Diagram Config + allOf: [{ $ref: '#/$defs/BaseDiagramConfig' }] + type: object + unevaluatedProperties: false + required: + - diagramMarginX + - diagramMarginY + - leftMargin + - width + - height + - boxMargin + - boxTextMargin + - noteMargin + - messageMargin + - messageAlign + - bottomMarginAdj + - useMaxWidth + properties: + diagramMarginX: + $ref: '#/$defs/C4DiagramConfig/properties/diagramMarginX' + default: 50 + diagramMarginY: + $ref: '#/$defs/C4DiagramConfig/properties/diagramMarginY' + default: 10 + leftMargin: + description: Margin between actors + type: integer + default: 150 + minimum: 0 + width: + description: Width of actor boxes + type: integer + default: 150 + minimum: 0 + height: + description: Height of actor boxes + type: integer + default: 50 + minimum: 0 + padding: + type: number + # should the default value be 50? + # see https://github.com/mermaid-js/mermaid/blob/7647ae317a7b2130e32777248d25a9c4d24b8f9f/packages/mermaid/src/diagrams/timeline/timelineRenderer.ts#L237 + boxMargin: + description: Margin around loop boxes + type: integer + default: 10 + minimum: 0 + boxTextMargin: + description: Margin around the text in loop/alt/opt boxes + type: integer + default: 5 + minimum: 0 + noteMargin: + description: Margin around notes + type: integer + default: 10 + minimum: 0 + messageMargin: + description: Space between messages. + type: integer + default: 35 + minimum: 0 + messageAlign: + description: Multiline message alignment + type: string + enum: + - left + - center + - right + default: center + # Allow any string for typescript backwards compatibility (fix in Mermaid v10) + tsType: 'string | "left" | "center" | "right"' + bottomMarginAdj: + description: | + Prolongs the edge of the diagram downwards. + + Depending on css styling this might need adjustment. + type: integer + default: 1 + minimum: 0 + rightAngles: + description: | + Curved Arrows become Right Angles + + This will display arrows that start and begin at the same node as + right angles, rather than as curves. + type: boolean + default: false + taskFontSize: + type: *fontSizeType + default: 14 + taskFontFamily: + type: string + default: '"Open Sans", sans-serif' + taskMargin: + type: number + default: 50 + activationWidth: + description: Width of activation box + type: number + default: 10 + textPlacement: + description: | + text placement as: tspan | fo | old only text as before + type: string + # TODO, should this be an enum? + default: fo + actorColours: + type: array + items: + type: string + default: ['#8FBC8F', '#7CFC00', '#00FFFF', '#20B2AA', '#B0E0E6', '#FFFFE0'] + sectionFills: + type: array + items: + type: string + default: ['#191970', '#8B008B', '#4B0082', '#2F4F4F', '#800000', '#8B4513', '#00008B'] + sectionColours: + type: array + items: + type: string + default: ['#fff'] + disableMulticolor: + # added by https://github.com/mermaid-js/mermaid/commit/652a42fe1aed7911a781a84716940a973b995639 + type: boolean + default: false + + GanttDiagramConfig: + title: Gantt Diagram Config + allOf: [{ $ref: '#/$defs/BaseDiagramConfig' }] + description: | + The object containing configurations specific for gantt diagrams + type: object + unevaluatedProperties: false + required: + - titleTopMargin + - barHeight + - topPadding + - rightPadding + - leftPadding + - gridLineStartPadding + - fontSize + - sectionFontSize + - numberSectionStyles + - axisFormat + - useMaxWidth + - topAxis + properties: + titleTopMargin: + $ref: '#/$defs/GitGraphDiagramConfig/properties/titleTopMargin' + default: 25 + barHeight: + description: The height of the bars in the graph + type: integer + default: 20 + minimum: 0 + barGap: + description: The margin between the different activities in the gantt diagram + type: integer + default: 4 + minimum: 0 + topPadding: + description: | + Margin between title and gantt diagram and between axis and gantt diagram. + type: integer + default: 50 + minimum: 0 + rightPadding: + description: | + The space allocated for the section name to the right of the activities + type: integer + default: 75 + minimum: 0 + leftPadding: + description: | + The space allocated for the section name to the left of the activities + type: integer + default: 75 + minimum: 0 + gridLineStartPadding: + description: Vertical starting position of the grid lines + type: integer + default: 35 + minimum: 0 + fontSize: + description: Font size + type: integer + default: 11 + minimum: 0 + sectionFontSize: + description: Font size for sections + type: integer + # TODO: typescript type for this also allows strings, but the docs say only integers + tsType: 'string | number' + default: 11 + minimum: 0 + numberSectionStyles: + description: The number of alternating section styles + type: integer + default: 4 + minimum: 0 + axisFormat: + description: | + Date/time format of the axis + + This might need adjustment to match your locale and preferences. + type: string + default: '%Y-%m-%d' + tickInterval: + description: | + axis ticks + + Pattern is: + + ```javascript + /^([1-9][0-9]*)(minute|hour|day|week|month)$/ + ``` + type: string + pattern: ^([1-9][0-9]*)(minute|hour|day|week|month)$ + topAxis: + description: | + When this flag is set, date labels will be added to the top of the chart + type: boolean + default: false + displayMode: + description: | + Controls the display mode. + type: string + enum: + - '' + - compact + meta:enum: + compact: Enables displaying multiple tasks on the same row. + default: '' + # Allow any string for typescript backwards compatibility (fix in Mermaid v10) + tsType: 'string | "compact"' + + SequenceDiagramConfig: + title: Sequence Diagram Config + allOf: [{ $ref: '#/$defs/BaseDiagramConfig' }] + description: The object containing configurations specific for sequence diagrams + type: object + unevaluatedProperties: false + required: + - activationWidth + - diagramMarginX + - diagramMarginY + - actorMargin + - width + - height + - boxMargin + - boxTextMargin + - noteMargin + - messageMargin + - messageAlign + - mirrorActors + - forceMenus + - bottomMarginAdj + - useMaxWidth + - rightAngles + - showSequenceNumbers + - actorFontSize + - actorFontFamily + - actorFontWeight + - noteFontSize + - noteFontFamily + - noteFontWeight + - noteAlign + - messageFontSize + - messageFontFamily + - messageFontWeight + properties: + arrowMarkerAbsolute: + type: boolean # TODO, is this actually used here (it has no default value but was in types) + hideUnusedParticipants: + type: boolean + default: false + activationWidth: + description: Width of the activation rect + type: integer + default: 10 + minimum: 0 + diagramMarginX: + description: Margin to the right and left of the sequence diagram + type: integer + default: 50 + minimum: 0 + diagramMarginY: + description: Margin to the over and under the sequence diagram + type: integer + default: 10 + minimum: 0 + actorMargin: + description: Margin between actors + type: integer + default: 50 + minimum: 0 + width: + $ref: '#/$defs/JourneyDiagramConfig/properties/width' + default: 150 + height: + $ref: '#/$defs/JourneyDiagramConfig/properties/height' + default: 65 + boxMargin: + $ref: '#/$defs/JourneyDiagramConfig/properties/boxMargin' + default: 10 + boxTextMargin: + $ref: '#/$defs/JourneyDiagramConfig/properties/boxTextMargin' + default: 5 + noteMargin: + $ref: '#/$defs/JourneyDiagramConfig/properties/noteMargin' + default: 10 + messageMargin: + $ref: '#/$defs/JourneyDiagramConfig/properties/messageMargin' + default: 35 + messageAlign: + $ref: '#/$defs/JourneyDiagramConfig/properties/messageAlign' + default: center + mirrorActors: + description: | + Mirror actors under diagram + type: boolean + default: true + forceMenus: + description: | + forces actor popup menus to always be visible (to support E2E testing). + type: boolean + default: false + bottomMarginAdj: + $ref: '#/$defs/JourneyDiagramConfig/properties/bottomMarginAdj' + default: 1 + rightAngles: + $ref: '#/$defs/JourneyDiagramConfig/properties/rightAngles' + default: false + showSequenceNumbers: + description: This will show the node numbers + type: boolean + default: false + actorFontSize: + description: This sets the font size of the actor's description + type: *fontSizeType + default: 14 + actorFontFamily: + description: This sets the font family of the actor's description + type: string + default: '"Open Sans", sans-serif' + actorFontWeight: + description: This sets the font weight of the actor's description + type: ['string', 'number'] + default: 400 + + noteFontSize: + description: This sets the font size of actor-attached notes + type: *fontSizeType + default: 14 + noteFontFamily: + description: This sets the font family of actor-attached notes + type: string + default: '"trebuchet ms", verdana, arial, sans-serif' + noteFontWeight: + description: This sets the font weight of actor-attached notes + type: ['string', 'number'] + default: 400 + noteAlign: + description: This sets the text alignment of actor-attached notes + type: string + enum: ['left', 'center', 'right'] + default: 'center' + # Allow any string for typescript backwards compatibility (fix in Mermaid v10) + tsType: 'string | "left" | "center" | "right"' + + messageFontSize: + description: This sets the font size of actor messages + type: *fontSizeType + default: 16 + messageFontFamily: + description: This sets the font family of actor messages + type: string + default: '"trebuchet ms", verdana, arial, sans-serif' + messageFontWeight: + description: This sets the font weight of actor messages + type: ['string', 'number'] + default: 400 + + wrap: + description: This sets the auto-wrap state for the diagram + type: boolean + default: false # different from C4 Diagram + wrapPadding: + $ref: '#/$defs/C4DiagramConfig/properties/wrapPadding' + default: 10 + labelBoxWidth: + description: This sets the width of the loop-box (loop, alt, opt, par) + type: number + default: 50 + labelBoxHeight: + description: This sets the height of the loop-box (loop, alt, opt, par) + type: number + default: 20 + messageFont: { '$ref': '#/$defs/FontCalculator' } + noteFont: { '$ref': '#/$defs/FontCalculator' } + actorFont: { '$ref': '#/$defs/FontCalculator' } + + FlowchartDiagramConfig: + title: Flowchart Diagram Config + allOf: [{ $ref: '#/$defs/BaseDiagramConfig' }] + description: The object containing configurations specific for flowcharts + type: object + unevaluatedProperties: false + required: + - titleTopMargin + - diagramPadding + - htmlLabels + - nodeSpacing + - rankSpacing + - curve + - useMaxWidth + - defaultRenderer + - wrappingWidth + properties: + titleTopMargin: + $ref: '#/$defs/GitGraphDiagramConfig/properties/titleTopMargin' + default: 25 + arrowMarkerAbsolute: + type: boolean # TODO, is this actually used here (it has no default value but was in types) + diagramPadding: + $ref: '#/$defs/ErDiagramConfig/properties/diagramPadding' + default: 8 + htmlLabels: + description: | + Flag for setting whether or not a html tag should be used for rendering labels on the edges. + type: boolean + default: true + nodeSpacing: + description: | + 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. + type: integer + default: 50 + minimum: 0 + rankSpacing: + description: | + 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. + type: integer + default: 50 + minimum: 0 + curve: + description: | + Defines how mermaid renders curves for flowcharts. + type: string + enum: ['basis', 'linear', 'cardinal'] + default: 'basis' + # Allow any string for typescript backwards compatibility (fix in Mermaid v10) + tsType: 'string | "basis" | "linear" | "cardinal"' + padding: + description: | + Represents the padding between the labels and the shape + + **Only used in new experimental rendering.** + type: number + default: 15 + defaultRenderer: + $ref: '#/$defs/StateDiagramConfig/properties/defaultRenderer' + default: dagre-wrapper + wrappingWidth: + description: | + 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. + type: number + default: 200 + + SankeyLinkColor: + description: | + Picks the color of the sankey diagram links, using the colors of the source and/or target of the links. + type: string + enum: + - source + - target + - gradient + meta:enum: + source: Use the source of sankey link for the color of the link. + target: Use the target of sankey link for the color of the link. + gradient: Use a gradient of the source and target for the color of the link. + default: gradient + + SankeyNodeAlignment: + description: | + Controls the alignment of the Sankey diagrams. + + See . + type: string + enum: + - left + - right + - center + - justify + meta:enum: + left: Align all inputs to the left. + right: Align all outputs to the right. + center: Like `left`, except that nodes without any incoming links are moved as right as possible. + justify: Like `left`, except that nodes without any outgoing links are moved to the far right. + default: justify + + SankeyDiagramConfig: + title: Sankey Diagram Config + allOf: [{ $ref: '#/$defs/BaseDiagramConfig' }] + description: The object containing configurations specific for sankey diagrams. + type: object + unevaluatedProperties: false + properties: + width: + type: number + default: 600 + height: + type: number + default: 400 + linkColor: + description: | + The color of the links in the sankey diagram. + anyOf: + - $ref: '#/$defs/SankeyLinkColor' + - description: An arbtirary [CSS color](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value) + type: string + default: gradient + nodeAlignment: + $ref: '#/$defs/SankeyNodeAlignment' + default: justify + useMaxWidth: + default: false + + FontCalculator: + title: Font Calculator + description: | + JavaScript function that returns a `FontConfig`. + + By default, these return the appropriate `*FontSize`, `*FontFamily`, `*FontWeight` + values. + + For example, the font calculator called `boundaryFont` might be defined as: + + ```javascript + boundaryFont: function () { + return { + fontFamily: this.boundaryFontFamily, + fontSize: this.boundaryFontSize, + fontWeight: this.boundaryFontWeight, + }; + } + ``` + tsType: '() => Partial' + + FontConfig: + title: Font Config + type: object + additionalProperties: false + properties: + fontSize: + title: CSS Font Size + description: The font size to use + type: *fontSizeType + default: 14 + fontFamily: + description: The CSS [`font-family`](https://developer.mozilla.org/en-US/docs/Web/CSS/font-family) to use. + type: string + default: '"Open Sans", sans-serif' + fontWeight: + description: The font weight to use. + type: ['string', 'number'] + default: normal diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 832703bae..303985a31 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -71,6 +71,9 @@ importers: '@vitest/ui': specifier: ^0.32.2 version: 0.32.2(vitest@0.32.2) + ajv: + specifier: ^8.12.0 + version: 8.12.0 concurrently: specifier: ^8.0.1 version: 8.0.1 @@ -252,6 +255,9 @@ importers: specifier: ^1.2.0 version: 1.2.0 devDependencies: + '@adobe/jsonschema2md': + specifier: ^7.1.4 + version: 7.1.4 '@types/cytoscape': specifier: ^3.19.9 version: 3.19.9 @@ -291,6 +297,9 @@ importers: '@typescript-eslint/parser': specifier: ^5.59.0 version: 5.59.0(eslint@8.39.0)(typescript@5.0.4) + ajv: + specifier: ^8.11.2 + version: 8.12.0 chokidar: specifier: ^3.5.3 version: 3.5.3 @@ -321,6 +330,9 @@ importers: jsdom: specifier: ^22.0.0 version: 22.0.0 + json-schema-to-typescript: + specifier: ^11.0.3 + version: 11.0.3 micromatch: specifier: ^4.0.5 version: 4.0.5 @@ -357,6 +369,9 @@ importers: unist-util-flatmap: specifier: ^1.0.0 version: 1.0.0 + unist-util-visit: + specifier: ^4.1.2 + version: 4.1.2 vitepress: specifier: ^1.0.0-alpha.72 version: 1.0.0-alpha.72(@algolia/client-search@4.14.2)(@types/node@18.16.0) @@ -484,6 +499,43 @@ importers: packages: + /@adobe/helix-log@6.0.0: + resolution: {integrity: sha512-+9gpf49sFDmZLV3gtjY+RmEUistqYJdVWpiqlRYpxE59x5bHFzYf93dZ7fljSTBtZdVq8lm97HxrTUloh5HvRg==} + dependencies: + big.js: 6.2.1 + colorette: 2.0.20 + ferrum: 1.9.4 + phin: 3.7.0 + polka: 0.5.2 + dev: true + + /@adobe/jsonschema2md@7.1.4: + resolution: {integrity: sha512-sqzH/G+2oNZi5ltwbl0hGJacGTDpXv7uUykzh+LD/DNfOIjUq577b1HbES/JP5yWcp4YkX4I3V5Kxltewr0BUg==} + engines: {node: '>= 14.0.0'} + hasBin: true + dependencies: + '@adobe/helix-log': 6.0.0 + '@types/json-schema': 7.0.11 + '@types/mdast': 3.0.11 + es2015-i18n-tag: 1.6.1 + ferrum: 1.9.4 + fs-extra: 11.0.0 + github-slugger: 2.0.0 + js-yaml: 4.1.0 + json-schema: 0.4.0 + mdast-builder: 1.1.1 + mdast-util-to-string: 3.1.0 + readdirp: 3.6.0 + remark-gfm: 3.0.1 + remark-parse: 10.0.1 + remark-stringify: 10.0.2 + unified: 10.1.2 + unist-util-inspect: 7.0.1 + yargs: 17.6.2 + transitivePeerDependencies: + - supports-color + dev: true + /@algolia/autocomplete-core@1.8.2: resolution: {integrity: sha512-mTeshsyFhAqw/ebqNsQpMtbnjr+qVOSKXArEj4K0d7sqc8It1XD0gkASwecm9mF/jlOQ4Z9RNg1HbdA8JPdRwQ==} dependencies: @@ -663,13 +715,13 @@ packages: resolution: {integrity: sha512-qe8Nmh9rYI/HIspLSTwtbMFPj6dISG6+dJnOguTlPNXtCvS2uezdxscVBb7/3DrmNbQK49TDqpkSQ1chbRGdpQ==} dev: true - /@apideck/better-ajv-errors@0.3.6(ajv@8.11.0): + /@apideck/better-ajv-errors@0.3.6(ajv@8.12.0): resolution: {integrity: sha512-P+ZygBLZtkp0qqOAJJVX4oX/sFo5JR3eBWwwuqHHhK0GIgQOKWrAfiAaWX0aArHkRWHMuggFEgAZNxVPwPZYaA==} engines: {node: '>=10'} peerDependencies: ajv: '>=8' dependencies: - ajv: 8.11.0 + ajv: 8.12.0 json-schema: 0.4.0 jsonpointer: 5.0.1 leven: 3.1.0 @@ -1026,6 +1078,11 @@ packages: engines: {node: '>=12.13.0'} dev: true + /@arr/every@1.0.1: + resolution: {integrity: sha512-UQFQ6SgyJ6LX42W8rHCs8KVc0JS0tzVL9ct4XYedJukskYVWTo49tNiMEK9C2HTyarbNiT/RVIRSY82vH+6sTg==} + engines: {node: '>=4'} + dev: true + /@babel/code-frame@7.18.6: resolution: {integrity: sha512-TDCmlK5eOvH+eH7cdAFlNXeVJqWIQ7gW9tY1GJIpUtFb6CmjVyq2VM3u71bOyR8CRihcCgMUYoDNyLXao3+70Q==} engines: {node: '>=6.9.0'} @@ -2207,6 +2264,15 @@ packages: '@babel/helper-validator-identifier': 7.19.1 to-fast-properties: 2.0.0 + /@bcherny/json-schema-ref-parser@9.0.9: + resolution: {integrity: sha512-vmEmnJCfpkLdas++9OYg6riIezTYqTHpqUTODJzHLzs5UnXujbOJW9VwcVCnyo1mVRt32FRr23iXBx/sX8YbeQ==} + dependencies: + '@jsdevtools/ono': 7.1.3 + '@types/json-schema': 7.0.11 + call-me-maybe: 1.0.2 + js-yaml: 4.1.0 + dev: true + /@bcoe/v8-coverage@0.2.3: resolution: {integrity: sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw==} dev: true @@ -2258,7 +2324,7 @@ packages: engines: {node: '>=v14'} dependencies: '@commitlint/types': 17.4.4 - ajv: 8.11.0 + ajv: 8.12.0 dev: true /@commitlint/ensure@17.4.4: @@ -3806,6 +3872,10 @@ packages: '@jridgewell/resolve-uri': 3.1.0 '@jridgewell/sourcemap-codec': 1.4.14 + /@jsdevtools/ono@7.1.3: + resolution: {integrity: sha512-4JQNk+3mVzK3xh2rqd6RB4J46qUR19azEHBneZyTZM+c456qOrbbM/5xcR8huNCCcbVt7+UmizG6GuUvPvKUYg==} + dev: true + /@leichtgewicht/ip-codec@2.0.4: resolution: {integrity: sha512-Hcv+nVC0kZnQ3tD9GVu5xSMR4VVYOteQIr/hwFPVEvPdlXqgGEuRjiheChHgdM+JyqdgNcmzZOX/tnl0JOiI7A==} dev: true @@ -3860,6 +3930,10 @@ packages: tslib: 2.5.0 dev: true + /@polka/url@0.5.0: + resolution: {integrity: sha512-oZLYFEAzUKyi3SKnXvj32ZCEGH6RDnao7COuCVhDydMS9NrCSVXhM79VaKyP5+Zc33m0QXEd2DN3UkU7OsHcfw==} + dev: true + /@polka/url@1.0.0-next.21: resolution: {integrity: sha512-a5Sab1C4/icpTZVzZc5Ghpz88yQtGOyNqYXcZgOssB2uuAr+wF/MvN6bgtW32q7HHrvBki+BsZ0OuNv6EV3K9g==} dev: true @@ -4382,6 +4456,13 @@ packages: resolution: {integrity: sha512-Nmh0K3iWQJzniTuPRcJn5hxXkfB1T1pgB89SBig5PlJQU5yocazeu4jATJlaA0GYFKWMqDdvYemoSnF2pXgLVA==} dev: true + /@types/glob@7.2.0: + resolution: {integrity: sha512-ZUxbzKl0IfJILTS6t7ip5fQQM/J3TJYubDm3nMbgubNNYS62eXeUpoLUC8/7fJNiFYHTrGPQn7hspDUzIHX3UA==} + dependencies: + '@types/minimatch': 5.1.2 + '@types/node': 18.16.0 + dev: true + /@types/graceful-fs@4.1.5: resolution: {integrity: sha512-anKkLmZZ+xm4p8JWBf4hElkM4XR+EZeA2M9BAkkTldmcyDY4mbdIJnRghDJH3Ov5ooY7/UAoENtmdMSkaAd7Cw==} dependencies: @@ -4482,6 +4563,10 @@ packages: resolution: {integrity: sha512-Y4XFY5VJAuw0FgAqPNd6NNoV44jbq9Bz2L7Rh/J6jLTiHBSBJa9fxqQIvkIld4GsoDOcCbvzOUAbLPsSKKg+uA==} dev: true + /@types/minimatch@5.1.2: + resolution: {integrity: sha512-K0VQKziLUWkVKiRVrx4a40iPaxTUefQmjtkQofBkYRcoaaL/8rhwDWww9qWbrgicNOgnpIsMxyNIUM4+n6dUIA==} + dev: true + /@types/minimist@1.2.2: resolution: {integrity: sha512-jhuKLIRrhvCPLqwPcx6INqmKeiA5EWrsCOPhrlFSrbrmU4ZMPjj5Ul/oLCMDO98XRUIwVm78xICz4EPCektzeQ==} dev: true @@ -5799,7 +5884,7 @@ packages: indent-string: 5.0.0 dev: true - /ajv-formats@2.1.1(ajv@8.11.0): + /ajv-formats@2.1.1(ajv@8.12.0): resolution: {integrity: sha512-Wx0Kx52hxE7C18hkMEggYlEifqWZtYaRgouJor+WMdPnQyEK13vgEWyVNup7SoeeoLMsr4kf5h6dOW11I15MUA==} peerDependencies: ajv: ^8.0.0 @@ -5807,7 +5892,7 @@ packages: ajv: optional: true dependencies: - ajv: 8.11.0 + ajv: 8.12.0 dev: true /ajv-keywords@3.5.2(ajv@6.12.6): @@ -5818,12 +5903,12 @@ packages: ajv: 6.12.6 dev: true - /ajv-keywords@5.1.0(ajv@8.11.0): + /ajv-keywords@5.1.0(ajv@8.12.0): resolution: {integrity: sha512-YCS/JNFAUyr5vAuhk1DWm1CBxRHW9LbJ2ozWeemrIqpbsqKjHVxYPyi5GC0rjZIT5JxJ3virVTS8wk4i/Z+krw==} peerDependencies: ajv: ^8.8.2 dependencies: - ajv: 8.11.0 + ajv: 8.12.0 fast-deep-equal: 3.1.3 dev: true @@ -5836,8 +5921,8 @@ packages: uri-js: 4.4.1 dev: true - /ajv@8.11.0: - resolution: {integrity: sha512-wGgprdCvMalC0BztXvitD2hC04YffAvtsUn93JbGXYLAtCUO4xd17mCCZQxUOItiBwZvJScWo8NIvQMQ71rdpg==} + /ajv@8.12.0: + resolution: {integrity: sha512-sRu1kpcO9yLtYxBKvqfTeh9KzZEwO3STyX1HT+4CaDzC6HpTGYhIhPIzj9XuKU7KYDwnaeh5hcOwjy1QuJzBPA==} dependencies: fast-deep-equal: 3.1.3 json-schema-traverse: 1.0.0 @@ -5949,7 +6034,6 @@ packages: /any-promise@1.3.0: resolution: {integrity: sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A==} - dev: false /anymatch@3.1.2: resolution: {integrity: sha512-P43ePfOAIupkguHUycrc4qJ9kz8ZiuOUijaETwX7THt0Y/GNK7v0aa8rY816xWjZ7rJdA5XdMcpVFTKMq+RvWg==} @@ -6247,6 +6331,10 @@ packages: tweetnacl: 0.14.5 dev: true + /big.js@6.2.1: + resolution: {integrity: sha512-bCtHMwL9LeDIozFn+oNhhFoq+yQ3BNdnsLSASUxLciOb1vgvpHsIO1dsENiGMgbb4SkP5TrzWzRiLddn8ahVOQ==} + dev: true + /binary-extensions@2.2.0: resolution: {integrity: sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==} engines: {node: '>=8'} @@ -6466,6 +6554,10 @@ packages: get-intrinsic: 1.2.0 dev: true + /call-me-maybe@1.0.2: + resolution: {integrity: sha512-HpX65o1Hnr9HH25ojC1YGs7HCQLq0GCOibSaWER0eNpgJ/Z1MZv2mTc7+xh6WOPxbRVcmgbv4hGU+uSQ/2xFZQ==} + dev: true + /callsites@3.1.0: resolution: {integrity: sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==} engines: {node: '>=6'} @@ -6521,6 +6613,10 @@ packages: resolution: {integrity: sha512-eyrF0jiFpY+3drT6383f1qhkbGsLSifNAjA61IUjZjmLCWjItY6LB9ft9YhoDgwfmclB2zhu51Lc7+95b8NRAg==} dev: true + /centra@2.6.0: + resolution: {integrity: sha512-dgh+YleemrT8u85QL11Z6tYhegAs3MMxsaWAq/oXeAmYJ7VxL3SI9TZtnfaEvNDMAPolj25FXIb3S+HCI4wQaQ==} + dev: true + /chai@4.3.7: resolution: {integrity: sha512-HLnAzZ2iupm25PlN0xFreAlBA5zaBSv3og0DdeGA4Ar6h6rJ3A0rolRUKJhSF2V10GZKDgWF/VmAEsNWjCRB+A==} engines: {node: '>=4'} @@ -6689,6 +6785,17 @@ packages: engines: {node: '>=6'} dev: true + /cli-color@2.0.3: + resolution: {integrity: sha512-OkoZnxyC4ERN3zLzZaY9Emb7f/MhBOIpePv0Ycok0fJYT+Ouo00UBEIwsVsr0yoow++n5YWlSUgST9GKhNHiRQ==} + engines: {node: '>=0.10'} + dependencies: + d: 1.0.1 + es5-ext: 0.10.62 + es6-iterator: 2.0.3 + memoizee: 0.4.15 + timers-ext: 0.1.7 + dev: true + /cli-cursor@3.1.0: resolution: {integrity: sha512-I/zHAwsKf9FqGoXM4WWRACob9+SNukZTd94DWF57E4toouRulbCxcUh6RKUEOQlYTHJnzkPMySvPNaaSLNfLZw==} engines: {node: '>=8'} @@ -7299,6 +7406,10 @@ packages: /csstype@3.1.2: resolution: {integrity: sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==} + /cuint@0.2.2: + resolution: {integrity: sha512-d4ZVpCW31eWwCMe1YT3ur7mUDnTXbgwyzaL320DrcRT45rfjYxkt5QWLrmOJ+/UEAI2+fQgKe/fCjR8l4TpRgw==} + dev: true + /cypress-image-snapshot@4.0.1(cypress@12.10.0)(jest@29.5.0): resolution: {integrity: sha512-PBpnhX/XItlx3/DAk5ozsXQHUi72exybBNH5Mpqj1DVmjq+S5Jd9WE5CRa4q5q0zuMZb2V2VpXHth6MjFpgj9Q==} engines: {node: '>=8'} @@ -7663,6 +7774,13 @@ packages: d3-zoom: 3.0.0 dev: false + /d@1.0.1: + resolution: {integrity: sha512-m62ShEObQ39CfralilEQRjH6oAMtNCV1xJyEx5LpRYUVN+EviphDgUc/F3hnYbADmkiNs67Y+3ylmlG7Lnu+FA==} + dependencies: + es5-ext: 0.10.62 + type: 1.2.0 + dev: true + /dagre-d3-es@7.0.10: resolution: {integrity: sha512-qTCQmEhcynucuaZgY5/+ti3X/rnszKZhEQH/ZdWdtP1tA/y3VoHJzcVrO9pjjJCNpigfscAtoUB5ONcd2wNn0A==} dependencies: @@ -8171,10 +8289,49 @@ packages: is-symbol: 1.0.4 dev: true + /es2015-i18n-tag@1.6.1: + resolution: {integrity: sha512-MYoh9p+JTkgnzBh0MEBON6xUyzdmwT6wzsmmFJvZujGSXiI2kM+3XvFl6+AcIO2eeL6VWgtX9szSiDTMwDxyYA==} + engines: {node: '>= 4.0.0'} + dev: true + + /es5-ext@0.10.62: + resolution: {integrity: sha512-BHLqn0klhEpnOKSrzn/Xsz2UIW8j+cGmo9JLzr8BiUapV8hPL9+FliFqjwr9ngW7jWdnxv6eO+/LqyhJVqgrjA==} + engines: {node: '>=0.10'} + requiresBuild: true + dependencies: + es6-iterator: 2.0.3 + es6-symbol: 3.1.3 + next-tick: 1.1.0 + dev: true + /es6-error@4.1.1: resolution: {integrity: sha512-Um/+FxMr9CISWh0bi5Zv0iOD+4cFh5qLeks1qhAopKVAJw3drgKbKySikp7wGhDL0HPeaja0P5ULZrxLkniUVg==} dev: true + /es6-iterator@2.0.3: + resolution: {integrity: sha512-zw4SRzoUkd+cl+ZoE15A9o1oQd920Bb0iOJMQkQhl3jNc03YqVjAhG7scf9C5KWRU/R13Orf588uCC6525o02g==} + dependencies: + d: 1.0.1 + es5-ext: 0.10.62 + es6-symbol: 3.1.3 + dev: true + + /es6-symbol@3.1.3: + resolution: {integrity: sha512-NJ6Yn3FuDinBaBRWl/q5X/s4koRHBrgKAu+yGI6JCBeiu3qrcbJhwT2GeR/EXVfylRk8dpQVJoLEFhK+Mu31NA==} + dependencies: + d: 1.0.1 + ext: 1.7.0 + dev: true + + /es6-weak-map@2.0.3: + resolution: {integrity: sha512-p5um32HOTO1kP+w7PRnB+5lQ43Z6muuMuIMffvDN8ZB4GcnjLBV6zGStpbASIMk4DCAvEaamhe2zhyCb/QXXsA==} + dependencies: + d: 1.0.1 + es5-ext: 0.10.62 + es6-iterator: 2.0.3 + es6-symbol: 3.1.3 + dev: true + /esbuild@0.17.18: resolution: {integrity: sha512-z1lix43jBs6UKjcZVKOw2xx69ffE2aG0PygLL5qJ9OS/gy0Ewd1gW/PUQIOIQGXBHWNywSc0floSKoMFF8aK2w==} engines: {node: '>=12'} @@ -8599,6 +8756,13 @@ packages: engines: {node: '>= 0.6'} dev: true + /event-emitter@0.3.5: + resolution: {integrity: sha512-D9rRn9y7kLPnJ+hMq7S/nhvoKwwvVJahBi2BPmx3bvbsEdK3W9ii8cBSGjP+72/LnM4n6fo3+dkCX5FeTQruXA==} + dependencies: + d: 1.0.1 + es5-ext: 0.10.62 + dev: true + /event-stream@3.3.4: resolution: {integrity: sha512-QHpkERcGsR0T7Qm3HNJSyXKEEj8AHNxkY3PK8TS2KJvQ7NiSHe3DDpwVKKtoYprL/AreyzFBeIkBIWChAqn60g==} dependencies: @@ -8747,6 +8911,12 @@ packages: - supports-color dev: true + /ext@1.7.0: + resolution: {integrity: sha512-6hxeJYaL110a9b5TEJSj0gojyHQAmA2ch5Os+ySCiA1QGdS697XWY1pzsrSjqA9LDEEgdB/KypIlR59RcLuHYw==} + dependencies: + type: 2.7.2 + dev: true + /extend@3.0.2: resolution: {integrity: sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g==} dev: true @@ -8831,6 +9001,10 @@ packages: engines: {node: '>= 4.9.1'} dev: true + /fastestsmallesttextencoderdecoder@1.0.22: + resolution: {integrity: sha512-Pb8d48e+oIuY4MaM64Cd7OW1gt4nxCHs7/ddPPZ/Ic3sg8yVGM7O9wDvZ7us6ScaUupzM+pfBolwtYhN1IxBIw==} + dev: true + /fastify-plugin@3.0.1: resolution: {integrity: sha512-qKcDXmuZadJqdTm6vlCqioEbyewF60b/0LOFCcYN1B6BIZGlYJumWWOYs70SFYLDAH4YqdE1cxH/RKMG7rFxgA==} dev: true @@ -8888,6 +9062,14 @@ packages: pend: 1.2.0 dev: true + /ferrum@1.9.4: + resolution: {integrity: sha512-ooNerLoIht/dK4CQJux93z/hnt9JysrXniJCI3r6YRgmHeXC57EJ8XaTCT1Gm8LfhIAeWxyJA0O7d/W3pqDYRg==} + dependencies: + fastestsmallesttextencoderdecoder: 1.0.22 + lodash.isplainobject: 4.0.6 + xxhashjs: 0.2.2 + dev: true + /fetch-blob@3.2.0: resolution: {integrity: sha512-7yAQpD2UMJzLi1Dqv7qFYnPbaPx7ZfFK6PiIxQ4PfkGPyNyl2Ugx+a/umUonmKqjhM4DnfbMvdX6otXq83soQQ==} engines: {node: ^12.20 || >= 14.13} @@ -9110,6 +9292,15 @@ packages: resolution: {integrity: sha512-cHEpEQHUg0f8XdtZCc2ZAhrHzKzT0MrFUTcvx+hfxYu7rGMDc5SKoXFh+n4YigxsHXRzc6OrCshdR1bWH6HHyg==} dev: true + /fs-extra@11.0.0: + resolution: {integrity: sha512-4YxRvMi4P5C3WQTvdRfrv5UVqbISpqjORFQAW5QPiKAauaxNCwrEdIi6pG3tDFhKKpMen+enEhHIzB/tvIO+/w==} + engines: {node: '>=14.14'} + dependencies: + graceful-fs: 4.2.10 + jsonfile: 6.1.0 + universalify: 2.0.0 + dev: true + /fs-extra@11.1.1: resolution: {integrity: sha512-MGIE4HOvQCeUCzmlHs0vXpih4ysz4wg9qiSAu6cd42lVwPbTM1TjV7RusoyQqMmk/95gdQZX72u+YW+c3eEpFQ==} engines: {node: '>=14.14'} @@ -9266,6 +9457,10 @@ packages: through2: 4.0.2 dev: true + /github-slugger@2.0.0: + resolution: {integrity: sha512-IaOQ9puYtjrkq7Y0Ygl9KDZnrf/aiUJYUpVf89y8kyaxbRG7Y1SrX/jaumrv81vc61+kiMempujsM3Yw7w5qcw==} + dev: true + /glob-parent@5.1.2: resolution: {integrity: sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==} engines: {node: '>= 6'} @@ -9278,6 +9473,16 @@ packages: dependencies: is-glob: 4.0.3 + /glob-promise@4.2.2(glob@7.2.3): + resolution: {integrity: sha512-xcUzJ8NWN5bktoTIX7eOclO1Npxd/dyVqUJxlLIDasT4C7KZyqlPIwkdJ0Ypiy3p2ZKahTjK4M9uC3sNSfNMzw==} + engines: {node: '>=12'} + peerDependencies: + glob: ^7.1.6 + dependencies: + '@types/glob': 7.2.0 + glob: 7.2.3 + dev: true + /glob-to-regexp@0.4.1: resolution: {integrity: sha512-lkX1HJXwyMcprw/5YUZc2s7DrpAiHB21/V+E1rHUrVNokkvB6bqMzT0VfV6/86ZNabt1k14YOIaT7nDvOX3Iiw==} dev: true @@ -10067,6 +10272,10 @@ packages: resolution: {integrity: sha512-bCYeRA2rVibKZd+s2625gGnGF/t7DSqDs4dP7CrLA1m7jKWz6pps0LpYLJN8Q64HtmPKJ1hrN3nzPNKFEKOUiQ==} dev: true + /is-promise@2.2.2: + resolution: {integrity: sha512-+lP4/6lKUBfQjZ2pdxThZvLUAafmZb8OAxFb8XXtiQmS35INgr85hdOGoEs124ez1FCnZJt6jau/T+alh58QFQ==} + dev: true + /is-regex@1.1.4: resolution: {integrity: sha512-kvRdxDsxZjhzUX07ZnLydzS1TU/TJlTUHHY4YLL87e37oUA49DfkLqgy+VjFocowy29cKvcSiu+kIv728jTTVg==} engines: {node: '>= 0.4'} @@ -10896,6 +11105,27 @@ packages: resolution: {integrity: sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==} dev: true + /json-schema-to-typescript@11.0.3: + resolution: {integrity: sha512-EaEE9Y4VZ8b9jW5zce5a9L3+p4C9AqgIRHbNVDJahfMnoKzcd4sDb98BLxLdQhJEuRAXyKLg4H66NKm80W8ilg==} + engines: {node: '>=12.0.0'} + hasBin: true + dependencies: + '@bcherny/json-schema-ref-parser': 9.0.9 + '@types/json-schema': 7.0.11 + '@types/lodash': 4.14.194 + '@types/prettier': 2.7.2 + cli-color: 2.0.3 + get-stdin: 8.0.0 + glob: 7.2.3 + glob-promise: 4.2.2(glob@7.2.3) + is-glob: 4.0.3 + lodash: 4.17.21 + minimist: 1.2.8 + mkdirp: 1.0.4 + mz: 2.7.0 + prettier: 2.8.8 + dev: true + /json-schema-traverse@0.4.1: resolution: {integrity: sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==} dev: true @@ -11063,7 +11293,7 @@ packages: /light-my-request@4.12.0: resolution: {integrity: sha512-0y+9VIfJEsPVzK5ArSIJ8Dkxp8QMP7/aCuxCUtG/tr9a2NoOf/snATE/OUc05XUplJCEnRh6gTkH7xh9POt1DQ==} dependencies: - ajv: 8.11.0 + ajv: 8.12.0 cookie: 0.5.0 process-warning: 1.0.0 set-cookie-parser: 2.6.0 @@ -11304,6 +11534,12 @@ packages: engines: {node: 14 || >=16.14} dev: true + /lru-queue@0.1.0: + resolution: {integrity: sha512-BpdYkt9EvGl8OfWHDQPISVpcl5xZthb+XPsbELj5AQXxIC8IriDZIQYjBJPEm5rS420sjZ0TLEzRcq5KdBhYrQ==} + dependencies: + es5-ext: 0.10.62 + dev: true + /lunr@2.3.9: resolution: {integrity: sha512-zTU3DaZaF3Rt9rhN3uBMGQD3dD2/vFQqnvZCDv4dl5iOzq2IZQqTxu90r4E5J+nP70J3ilqVCrbho2eWaeW8Ow==} dev: true @@ -11373,6 +11609,13 @@ packages: engines: {node: '>= 12'} hasBin: true + /matchit@1.1.0: + resolution: {integrity: sha512-+nGYoOlfHmxe5BW5tE0EMJppXEwdSf8uBA1GTZC7Q77kbT35+VKLYJMzVNWCHSsga1ps1tPYFtFyvxvKzWVmMA==} + engines: {node: '>=6'} + dependencies: + '@arr/every': 1.0.1 + dev: true + /md5-hex@3.0.1: resolution: {integrity: sha512-BUiRtTtV39LIJwinWBjqVsU9xhdnz7/i889V859IBFpuqGAj6LuOvHv5XLbgZ2R7ptJoJaEcxkv88/h25T7Ciw==} engines: {node: '>=8'} @@ -11380,6 +11623,12 @@ packages: blueimp-md5: 2.19.0 dev: true + /mdast-builder@1.1.1: + resolution: {integrity: sha512-a3KBk/LmYD6wKsWi8WJrGU/rXR4yuF4Men0JO0z6dSZCm5FrXXWTRDjqK0vGSqa+1M6p9edeuypZAZAzSehTUw==} + dependencies: + '@types/unist': 2.0.6 + dev: true + /mdast-util-find-and-replace@2.2.1: resolution: {integrity: sha512-SobxkQXFAdd4b5WmEakmkVoh18icjQRxGy5OWTCzgsLRm1Fu/KCtwD1HIQSsmq5ZRjVH0Ehwg6/Fn3xIUk+nKw==} dependencies: @@ -11488,7 +11737,7 @@ packages: longest-streak: 3.0.1 mdast-util-to-string: 3.1.0 micromark-util-decode-string: 1.0.2 - unist-util-visit: 4.1.1 + unist-util-visit: 4.1.2 zwitch: 2.0.2 dev: true @@ -11519,6 +11768,19 @@ packages: fs-monkey: 1.0.3 dev: true + /memoizee@0.4.15: + resolution: {integrity: sha512-UBWmJpLZd5STPm7PMUlOw/TSy972M+z8gcyQ5veOnSDRREz/0bmpyTfKt3/51DhEBqCZQn1udM/5flcSPYhkdQ==} + dependencies: + d: 1.0.1 + es5-ext: 0.10.62 + es6-weak-map: 2.0.3 + event-emitter: 0.3.5 + is-promise: 2.2.2 + lru-queue: 0.1.0 + next-tick: 1.1.0 + timers-ext: 0.1.7 + dev: true + /meow@10.1.5: resolution: {integrity: sha512-/d+PQ4GKmGvM9Bee/DPa8z3mXs/pkvJE2KEThngVNOqtmljC6K7NMPxtc2JeZYTmpWb9k/TmxjeL18ez3h7vCw==} engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0} @@ -11933,6 +12195,12 @@ packages: minimist: 1.2.8 dev: true + /mkdirp@1.0.4: + resolution: {integrity: sha512-vVqVZQyf3WLx2Shd0qJ9xuvqgAyKPLAiqITEtqW0oIUjzo3PePDd6fW9iFz30ef7Ysp/oiWqbhszeGWW2T6Gzw==} + engines: {node: '>=10'} + hasBin: true + dev: true + /mlly@1.2.0: resolution: {integrity: sha512-+c7A3CV0KGdKcylsI6khWyts/CYrGTrRVo4R/I7u/cUsy0Conxa6LUhiEzVKIw14lc2L5aiO4+SeVe4TeGRKww==} dependencies: @@ -11976,7 +12244,6 @@ packages: any-promise: 1.3.0 object-assign: 4.1.1 thenify-all: 1.6.0 - dev: false /nanoid@3.3.6: resolution: {integrity: sha512-BGcqMMJuToF7i1rt+2PWSNVnWIkGCU78jBG3RxO/bZlnZPK2Cmi2QaffxGO/2RvWi9sL+FAiRiXMgsyxQ1DIDA==} @@ -12004,6 +12271,10 @@ packages: resolution: {integrity: sha512-9iN1ka/9zmX1ZvLV9ewJYEk9h7RyRRtqdK0woXcqohu8EWIerfPUjYJPg0ULy0UqP7cslmdGc8xKDJcojlKiaw==} dev: true + /next-tick@1.1.0: + resolution: {integrity: sha512-CXdUiJembsNjuToQvxayPZF9Vqht7hewsvy2sOWafLvi2awflj9mOC6bHIg50orX8IJvWKY9wYQ/zB2kogPslQ==} + dev: true + /nice-try@1.0.5: resolution: {integrity: sha512-1nh45deeb5olNY7eX82BkPO7SSxR5SSYJiPTrTdFUVYwAl8CKMA5N9PjTYkHiRjisVcxcQ1HXdLhx2qxxJzLNQ==} dev: true @@ -12565,6 +12836,13 @@ packages: resolution: {integrity: sha512-7EAHlyLHI56VEIdK57uwHdHKIaAGbnXPiw0yWbarQZOKaKpvUIgW0jWRVLiatnM+XXlSwsanIBH/hzGMJulMow==} dev: true + /phin@3.7.0: + resolution: {integrity: sha512-DqnVNrpYhKGBZppNKprD+UJylMeEKOZxHgPB+ZP6mGzf3uA2uox4Ep9tUm+rUc8WLIdHT3HcAE4X8fhwQA9JKg==} + engines: {node: '>= 8'} + dependencies: + centra: 2.6.0 + dev: true + /picocolors@1.0.0: resolution: {integrity: sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==} @@ -12693,6 +12971,13 @@ packages: hasBin: true dev: true + /polka@0.5.2: + resolution: {integrity: sha512-FVg3vDmCqP80tOrs+OeNlgXYmFppTXdjD5E7I4ET1NjvtNmQrb1/mJibybKkb/d4NA7YWAr1ojxuhpL3FHqdlw==} + dependencies: + '@polka/url': 0.5.0 + trouter: 2.0.1 + dev: true + /postcss-import@15.1.0(postcss@8.4.24): resolution: {integrity: sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==} engines: {node: '>=14.0.0'} @@ -13514,9 +13799,9 @@ packages: engines: {node: '>= 12.13.0'} dependencies: '@types/json-schema': 7.0.11 - ajv: 8.11.0 - ajv-formats: 2.1.1(ajv@8.11.0) - ajv-keywords: 5.1.0(ajv@8.11.0) + ajv: 8.12.0 + ajv-formats: 2.1.1(ajv@8.12.0) + ajv-keywords: 5.1.0(ajv@8.12.0) dev: true /search-insights@2.6.0: @@ -14367,13 +14652,11 @@ packages: engines: {node: '>=0.8'} dependencies: thenify: 3.3.1 - dev: false /thenify@3.3.1: resolution: {integrity: sha512-RVZSIV5IG10Hk3enotrhvz0T9em6cyHBLkH/YAZuKqd8hRkKhSfCGIcP2KUY0EPxndzANBmNllzWPwak+bheSw==} dependencies: any-promise: 1.3.0 - dev: false /thread-stream@2.3.0: resolution: {integrity: sha512-kaDqm1DET9pp3NXwR8382WHbnpXnRkN9xGN9dQt3B2+dmXiW8X1SOwmFOxAErEQ47ObhZ96J6yhZNXuyCOL7KA==} @@ -14412,6 +14695,13 @@ packages: engines: {node: '>=4'} dev: true + /timers-ext@0.1.7: + resolution: {integrity: sha512-b85NUNzTSdodShTIbky6ZF02e8STtVVfD+fu4aXXShEELpozH+bCpJLYMPZbsABN2wDH7fJpqIoXxJpzbf0NqQ==} + dependencies: + es5-ext: 0.10.62 + next-tick: 1.1.0 + dev: true + /tiny-glob@0.2.9: resolution: {integrity: sha512-g/55ssRPUjShh+xkfx9UPDXqhckHEsHr4Vd9zX55oSdGZc/MD0m3sferOkwWtp98bv+kcVfEHtRJgBVJzelrzg==} dependencies: @@ -14534,6 +14824,13 @@ packages: resolution: {integrity: sha512-AqTiAOLcj85xS7vQ8QkAV41hPDIJ71XJB4RCUrzo/1GM2CQwhkJGaf9Hgr7BOugMRpgGUrqRg/DrBDl4H40+8g==} dev: true + /trouter@2.0.1: + resolution: {integrity: sha512-kr8SKKw94OI+xTGOkfsvwZQ8mWoikZDd2n8XZHjJVZUARZT+4/VV6cacRS6CLsH9bNm+HFIPU1Zx4CnNnb4qlQ==} + engines: {node: '>=6'} + dependencies: + matchit: 1.1.0 + dev: true + /ts-dedent@2.2.0: resolution: {integrity: sha512-q5W7tVM71e2xjHZTlgfTDoPF/SmqKG5hddq9SzR49CH2hayqRKJtQ4mtRlSxKaJlR/+9rEM+mnBHf7I2/BQcpQ==} engines: {node: '>=6.10'} @@ -14681,6 +14978,14 @@ packages: mime-types: 2.1.35 dev: true + /type@1.2.0: + resolution: {integrity: sha512-+5nt5AAniqsCnu2cEQQdpzCAh33kVx8n0VoFidKpB1dVVLAN/F+bgVOqOJqOnEnrhp222clB5p3vUlD+1QAnfg==} + dev: true + + /type@2.7.2: + resolution: {integrity: sha512-dzlvlNlt6AXU7EBSfpAscydQ7gXB+pPGsPnfJnZpiNJBDj7IaJzQlBZYGdEi4R9HmPdBv2XmWJ6YUtoTa7lmCw==} + dev: true + /typed-array-length@1.0.4: resolution: {integrity: sha512-KjZypGq+I/H7HI5HlOoGHkWUUGq+Q0TPhQurLbyrVrvnKTBgzLhIJ7j6J/XTQOi0d1RjyZ0wdas8bKs2p0x3Ng==} dependencies: @@ -14820,6 +15125,12 @@ packages: resolution: {integrity: sha512-IG32jcKJlhARCYT2LsYPJWdoXYkzz3ESAdl1aa2hn9Auh+cgUmU6wgkII4yCc/1GgeWibRdELdCZh/p3QKQ1dQ==} dev: true + /unist-util-inspect@7.0.1: + resolution: {integrity: sha512-gEPeSrsYXus8012VJ00p9uZC8D0iogtLLiHlBgvS61hU22KNKduQhMKezJm83viHlLf3TYS2y9SDEFglWPDMKw==} + dependencies: + '@types/unist': 2.0.6 + dev: true + /unist-util-is@5.1.1: resolution: {integrity: sha512-F5CZ68eYzuSvJjGhCLPL3cYx45IxkqXSetCcRgUXtbcm50X2L9oOWQlfUfDdAf+6Pd27YDblBfdtmsThXmwpbQ==} dev: true @@ -14842,8 +15153,8 @@ packages: unist-util-is: 5.1.1 dev: true - /unist-util-visit@4.1.1: - resolution: {integrity: sha512-n9KN3WV9k4h1DxYR1LoajgN93wpEi/7ZplVe02IoB4gH5ctI1AaF2670BLHQYbwj+pY83gFtyeySFiyMHJklrg==} + /unist-util-visit@4.1.2: + resolution: {integrity: sha512-MSd8OUGISqHdVvfY9TPhyK2VdUrPgxkUtWSuMHF6XAAFuL4LokseigBnZtPnJMu+FbynTkFNnFlyjxpVKujMRg==} dependencies: '@types/unist': 2.0.6 unist-util-is: 5.1.1 @@ -15924,7 +16235,7 @@ packages: resolution: {integrity: sha512-CttE7WCYW9sZC+nUYhQg3WzzGPr4IHmrPnjKiu3AMXsiNQKx+l4hHl63WTrnicLmKEKHScWDH8xsGBdrYgtBzg==} engines: {node: '>=16.0.0'} dependencies: - '@apideck/better-ajv-errors': 0.3.6(ajv@8.11.0) + '@apideck/better-ajv-errors': 0.3.6(ajv@8.12.0) '@babel/core': 7.12.3 '@babel/preset-env': 7.20.2(@babel/core@7.12.3) '@babel/runtime': 7.21.0 @@ -15932,7 +16243,7 @@ packages: '@rollup/plugin-node-resolve': 11.2.1(rollup@2.79.1) '@rollup/plugin-replace': 2.4.2(rollup@2.79.1) '@surma/rollup-plugin-off-main-thread': 2.2.3 - ajv: 8.11.0 + ajv: 8.12.0 common-tags: 1.8.2 fast-json-stable-stringify: 2.1.0 fs-extra: 9.1.0 @@ -16162,6 +16473,12 @@ packages: resolution: {integrity: sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==} dev: true + /xxhashjs@0.2.2: + resolution: {integrity: sha512-AkTuIuVTET12tpsVIQo+ZU6f/qDmKuRUcjaqR+OIvm+aCBsZ95i7UVY5WJ9TMsSaZ0DA2WxoZ4acu0sPH+OKAw==} + dependencies: + cuint: 0.2.2 + dev: true + /y18n@4.0.3: resolution: {integrity: sha512-JKhqTOwSrqNA1NY5lSztJ1GrBiUodLMmIZuLiDaMRJ+itFd+ABVE8XBjOvIWL+rSqNDC74LCSFmlb/U4UZ4hJQ==} dev: true diff --git a/run b/run index d9f669cab..cc169e209 100755 --- a/run +++ b/run @@ -27,7 +27,7 @@ $RUN --service-ports mermaid sh -c "npx pnpm run dev" ;; docs:dev) -$RUN --service-ports mermaid sh -c "cd packages/mermaid/src/docs && npx pnpm prefetch && npx vitepress --port 3333 --host" +$RUN --service-ports mermaid sh -c "npx pnpm run --filter mermaid docs:dev:docker" ;; cypress) diff --git a/vite.config.ts b/vite.config.ts index 36d08351e..080ff981f 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -1,4 +1,5 @@ import jison from './.vite/jisonPlugin.js'; +import jsonSchemaPlugin from './.vite/jsonSchemaPlugin.js'; import typescript from '@rollup/plugin-typescript'; import { defineConfig } from 'vitest/config'; @@ -8,6 +9,7 @@ export default defineConfig({ }, plugins: [ jison(), + jsonSchemaPlugin(), // handles .schema.yaml JSON Schema files // @ts-expect-error According to the type definitions, rollup plugins are incompatible with vite typescript({ compilerOptions: { declaration: false } }), ],