Merge pull request #4889 from dreathed/bug/4345_bundle_current_config_consitently_in_one_file

making consitent config imports from diagramAPI
2025-11-06 13:54:09 +01:00 · 2023-10-15 22:54:10 +00:00
parent df068dbde8 497ffde9fe
commit d04f4c27fc
46 changed files with 114 additions and 113 deletions
--- a/packages/mermaid/src/dagre-wrapper/clusters.js
+++ b/packages/mermaid/src/dagre-wrapper/clusters.js
@@ -3,7 +3,7 @@ import { log } from '../logger.js';
 import createLabel from './createLabel.js';
 import { createText } from '../rendering-util/createText.js';
 import { select } from 'd3';
-import { getConfig } from '../config.js';
+import { getConfig } from '../diagram-api/diagramAPI.js';
 import { evaluate } from '../diagrams/common/common.js';

 const rect = (parent, node) => {
--- a/packages/mermaid/src/dagre-wrapper/createLabel.js
+++ b/packages/mermaid/src/dagre-wrapper/createLabel.js
@@ -1,6 +1,6 @@
 import { select } from 'd3';
 import { log } from '../logger.js';
-import { getConfig } from '../config.js';
+import { getConfig } from '../diagram-api/diagramAPI.js';
 import { evaluate } from '../diagrams/common/common.js';
 import { decodeEntities } from '../mermaidAPI.js';

--- a/packages/mermaid/src/dagre-wrapper/edges.js
+++ b/packages/mermaid/src/dagre-wrapper/edges.js
@@ -2,7 +2,7 @@ import { log } from '../logger.js';
 import createLabel from './createLabel.js';
 import { createText } from '../rendering-util/createText.js';
 import { line, curveBasis, select } from 'd3';
-import { getConfig } from '../config.js';
+import { getConfig } from '../diagram-api/diagramAPI.js';
 import utils from '../utils.js';
 import { evaluate } from '../diagrams/common/common.js';
 import { getLineFunctionsWithOffset } from '../utils/lineWithOffset.js';
--- a/packages/mermaid/src/dagre-wrapper/nodes.js
+++ b/packages/mermaid/src/dagre-wrapper/nodes.js
@@ -1,7 +1,7 @@
 import { select } from 'd3';
 import { log } from '../logger.js';
 import { labelHelper, updateNodeBounds, insertPolygonShape } from './shapes/util.js';
-import { getConfig } from '../config.js';
+import { getConfig } from '../diagram-api/diagramAPI.js';
 import intersect from './intersect/index.js';
 import createLabel from './createLabel.js';
 import note from './shapes/note.js';
--- a/packages/mermaid/src/dagre-wrapper/shapes/note.js
+++ b/packages/mermaid/src/dagre-wrapper/shapes/note.js
@@ -1,6 +1,6 @@
 import { updateNodeBounds, labelHelper } from './util.js';
 import { log } from '../../logger.js';
-import { getConfig } from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import intersect from '../intersect/index.js';

 const note = async (parent, node) => {
--- a/packages/mermaid/src/dagre-wrapper/shapes/util.js
+++ b/packages/mermaid/src/dagre-wrapper/shapes/util.js
@@ -1,6 +1,6 @@
 import createLabel from '../createLabel.js';
 import { createText } from '../../rendering-util/createText.js';
-import { getConfig } from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import { decodeEntities } from '../../mermaidAPI.js';
 import { select } from 'd3';
 import { evaluate, sanitizeText } from '../../diagrams/common/common.js';
--- a/packages/mermaid/src/diagram-api/diagramAPI.ts
+++ b/packages/mermaid/src/diagram-api/diagramAPI.ts
@@ -1,6 +1,11 @@
 import { addDetector } from './detectType.js';
 import { log as _log, setLogLevel as _setLogLevel } from '../logger.js';
-import { getConfig as _getConfig } from '../config.js';
+import {
+  getConfig as _getConfig,
+  setConfig as _setConfig,
+  defaultConfig as _defaultConfig,
+  setSiteConfig as _setSiteConfig,
+} from '../config.js';
 import { sanitizeText as _sanitizeText } from '../diagrams/common/common.js';
 import { setupGraphViewbox as _setupGraphViewbox } from '../setupGraphViewbox.js';
 import { addStylesForDiagram } from '../styles.js';
@@ -15,6 +20,9 @@ import * as _commonDb from '../diagrams/common/commonDb.js';
 export const log = _log;
 export const setLogLevel = _setLogLevel;
 export const getConfig = _getConfig;
+export const setConfig = _setConfig;
+export const defaultConfig = _defaultConfig;
+export const setSiteConfig = _setSiteConfig;
 export const sanitizeText = (text: string) => _sanitizeText(text, getConfig());
 export const setupGraphViewbox = _setupGraphViewbox;
 export const getCommonDb = () => {
--- a/packages/mermaid/src/diagrams/c4/c4Db.js
+++ b/packages/mermaid/src/diagrams/c4/c4Db.js
@@ -1,4 +1,4 @@
-import * as configApi from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import { sanitizeText } from '../common/common.js';
 import {
  setAccTitle,
@@ -33,7 +33,7 @@ export const getC4Type = function () {
 };

 export const setC4Type = function (c4TypeParam) {
-  let sanitizedText = sanitizeText(c4TypeParam, configApi.getConfig());
+  let sanitizedText = sanitizeText(c4TypeParam, getConfig());
  c4Type = sanitizedText;
 };

@@ -783,7 +783,7 @@ export const PLACEMENT = {
 };

 export const setTitle = function (txt) {
-  let sanitizedText = sanitizeText(txt, configApi.getConfig());
+  let sanitizedText = sanitizeText(txt, getConfig());
  title = sanitizedText;
 };

@@ -816,7 +816,7 @@ export default {
  getAccTitle,
  getAccDescription,
  setAccDescription,
-  getConfig: () => configApi.getConfig().c4,
+  getConfig: () => getConfig().c4,
  clear,
  LINETYPE,
  ARROWTYPE,
--- a/packages/mermaid/src/diagrams/c4/c4Renderer.js
+++ b/packages/mermaid/src/diagrams/c4/c4Renderer.js
@@ -4,7 +4,7 @@ import { log } from '../../logger.js';
 import { parser } from './parser/c4Diagram.jison';
 import common from '../common/common.js';
 import c4Db from './c4Db.js';
-import * as configApi from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import assignWithDepth from '../../assignWithDepth.js';
 import { wrapLabel, calculateTextWidth, calculateTextHeight } from '../../utils.js';
 import { configureSvgSize } from '../../setupGraphViewbox.js';
@@ -580,8 +580,8 @@ function drawInsideBoundary(
 * @param diagObj
 */
 export const draw = function (_text, id, _version, diagObj) {
-  conf = configApi.getConfig().c4;
-  const securityLevel = configApi.getConfig().securityLevel;
+  conf = getConfig().c4;
+  const securityLevel = getConfig().securityLevel;
  // Handle root and Document for when rendering in sandbox mode
  let sandboxElement;
  if (securityLevel === 'sandbox') {
--- a/packages/mermaid/src/diagrams/class/classDb.ts
+++ b/packages/mermaid/src/diagrams/class/classDb.ts
@@ -1,7 +1,7 @@
 import type { Selection } from 'd3';
 import { select } from 'd3';
 import { log } from '../../logger.js';
-import * as configApi from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import common from '../common/common.js';
 import utils from '../../utils.js';
 import {
@@ -34,10 +34,10 @@ let namespaceCounter = 0;

 let functions: any[] = [];

-const sanitizeText = (txt: string) => common.sanitizeText(txt, configApi.getConfig());
+const sanitizeText = (txt: string) => common.sanitizeText(txt, getConfig());

 const splitClassNameAndType = function (_id: string) {
-  const id = common.sanitizeText(_id, configApi.getConfig());
+  const id = common.sanitizeText(_id, getConfig());
  let genericType = '';
  let className = id;

@@ -51,7 +51,7 @@ const splitClassNameAndType = function (_id: string) {
 };

 export const setClassLabel = function (_id: string, label: string) {
-  const id = common.sanitizeText(_id, configApi.getConfig());
+  const id = common.sanitizeText(_id, getConfig());
  if (label) {
    label = sanitizeText(label);
  }
@@ -67,14 +67,14 @@ export const setClassLabel = function (_id: string, label: string) {
 * @public
 */
 export const addClass = function (_id: string) {
-  const id = common.sanitizeText(_id, configApi.getConfig());
+  const id = common.sanitizeText(_id, getConfig());
  const { className, type } = splitClassNameAndType(id);
  // Only add class if not exists
  if (Object.hasOwn(classes, className)) {
    return;
  }
  // alert('Adding class: ' + className);
-  const name = common.sanitizeText(className, configApi.getConfig());
+  const name = common.sanitizeText(className, getConfig());
  // alert('Adding class after: ' + name);
  classes[name] = {
    id: name,
@@ -97,7 +97,7 @@ export const addClass = function (_id: string) {
 * @public
 */
 export const lookUpDomId = function (_id: string): string {
-  const id = common.sanitizeText(_id, configApi.getConfig());
+  const id = common.sanitizeText(_id, getConfig());
  if (id in classes) {
    return classes[id].domId;
  }
@@ -139,15 +139,9 @@ export const addRelation = function (relation: ClassRelation) {
  relation.id1 = splitClassNameAndType(relation.id1).className;
  relation.id2 = splitClassNameAndType(relation.id2).className;

-  relation.relationTitle1 = common.sanitizeText(
-    relation.relationTitle1.trim(),
-    configApi.getConfig()
-  );
+  relation.relationTitle1 = common.sanitizeText(relation.relationTitle1.trim(), getConfig());

-  relation.relationTitle2 = common.sanitizeText(
-    relation.relationTitle2.trim(),
-    configApi.getConfig()
-  );
+  relation.relationTitle2 = common.sanitizeText(relation.relationTitle2.trim(), getConfig());

  relations.push(relation);
 };
@@ -267,7 +261,7 @@ export const getTooltip = function (id: string, namespace?: string) {
 * @param target - Target of the link, _blank by default as originally defined in the svgDraw.js file
 */
 export const setLink = function (ids: string, linkStr: string, target: string) {
-  const config = configApi.getConfig();
+  const config = getConfig();
  ids.split(',').forEach(function (_id) {
    let id = _id;
    if (_id[0].match(/\d/)) {
@@ -303,8 +297,8 @@ export const setClickEvent = function (ids: string, functionName: string, functi
 };

 const setClickFunc = function (_domId: string, functionName: string, functionArgs: string) {
-  const domId = common.sanitizeText(_domId, configApi.getConfig());
-  const config = configApi.getConfig();
+  const domId = common.sanitizeText(_domId, getConfig());
+  const config = getConfig();
  if (config.securityLevel !== 'loose') {
    return;
  }
@@ -465,7 +459,7 @@ export default {
  getAccTitle,
  getAccDescription,
  setAccDescription,
-  getConfig: () => configApi.getConfig().class,
+  getConfig: () => getConfig().class,
  addClass,
  bindFunctions,
  clear,
--- a/packages/mermaid/src/diagrams/class/classRenderer-v2.ts
+++ b/packages/mermaid/src/diagrams/class/classRenderer-v2.ts
@@ -2,7 +2,7 @@
 import { select, curveLinear } from 'd3';
 import * as graphlib from 'dagre-d3-es/src/graphlib/index.js';
 import { log } from '../../logger.js';
-import { getConfig } from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import { render } from '../../dagre-wrapper/index.js';
 import utils from '../../utils.js';
 import { interpolateToCurve, getStylesFromArray } from '../../utils.js';
--- a/packages/mermaid/src/diagrams/class/classRenderer.js
+++ b/packages/mermaid/src/diagrams/class/classRenderer.js
@@ -4,7 +4,7 @@ import * as graphlib from 'dagre-d3-es/src/graphlib/index.js';
 import { log } from '../../logger.js';
 import svgDraw from './svgDraw.js';
 import { configureSvgSize } from '../../setupGraphViewbox.js';
-import { getConfig } from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';

 let idCache = {};
 const padding = 20;
--- a/packages/mermaid/src/diagrams/class/classTypes.ts
+++ b/packages/mermaid/src/diagrams/class/classTypes.ts
@@ -1,4 +1,4 @@
-import { getConfig } from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import { parseGenericTypes, sanitizeText } from '../common/common.js';

 export interface ClassNode {
--- a/packages/mermaid/src/diagrams/er/erDb.js
+++ b/packages/mermaid/src/diagrams/er/erDb.js
@@ -1,5 +1,5 @@
 import { log } from '../../logger.js';
-import * as configApi from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';

 import {
  setAccTitle,
@@ -83,7 +83,7 @@ const clear = function () {
 export default {
  Cardinality,
  Identification,
-  getConfig: () => configApi.getConfig().er,
+  getConfig: () => getConfig().er,
  addEntity,
  addAttributes,
  getEntities,
--- a/packages/mermaid/src/diagrams/er/erRenderer.js
+++ b/packages/mermaid/src/diagrams/er/erRenderer.js
@@ -1,7 +1,7 @@
 import * as graphlib from 'dagre-d3-es/src/graphlib/index.js';
 import { line, curveBasis, select } from 'd3';
 import { layout as dagreLayout } from 'dagre-d3-es/src/dagre/index.js';
-import { getConfig } from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import { log } from '../../logger.js';
 import utils from '../../utils.js';
 import erMarkers from './erMarkers.js';
--- a/packages/mermaid/src/diagrams/flowchart/flowDb.js
+++ b/packages/mermaid/src/diagrams/flowchart/flowDb.js
@@ -1,6 +1,6 @@
 import { select } from 'd3';
 import utils from '../../utils.js';
-import * as configApi from '../../config.js';
+import { getConfig, defaultConfig } from '../../diagram-api/diagramAPI.js';
 import common from '../common/common.js';
 import { log } from '../../logger.js';
 import {
@@ -15,7 +15,7 @@ import {

 const MERMAID_DOM_ID_PREFIX = 'flowchart-';
 let vertexCounter = 0;
-let config = configApi.getConfig();
+let config = getConfig();
 let vertices = {};
 let edges = [];
 let classes = {};
@@ -84,7 +84,7 @@ export const addVertex = function (_id, textObj, type, style, classes, dir, prop
  }
  vertexCounter++;
  if (textObj !== undefined) {
-    config = configApi.getConfig();
+    config = getConfig();
    txt = sanitizeText(textObj.text.trim());
    vertices[id].labelType = textObj.type;
    // strip quotes if string starts and ends with a quote
@@ -277,7 +277,7 @@ const setTooltip = function (ids, tooltip) {
 const setClickFun = function (id, functionName, functionArgs) {
  let domId = lookUpDomId(id);
  // if (_id[0].match(/\d/)) id = MERMAID_DOM_ID_PREFIX + id;
-  if (configApi.getConfig().securityLevel !== 'loose') {
+  if (getConfig().securityLevel !== 'loose') {
    return;
  }
  if (functionName === undefined) {
@@ -766,7 +766,7 @@ export const lex = {
  firstGraph,
 };
 export default {
-  defaultConfig: () => configApi.defaultConfig.flowchart,
+  defaultConfig: () => defaultConfig.flowchart,
  setAccTitle,
  getAccTitle,
  getAccDescription,
--- a/packages/mermaid/src/diagrams/flowchart/flowDiagram-v2.ts
+++ b/packages/mermaid/src/diagrams/flowchart/flowDiagram-v2.ts
@@ -4,7 +4,7 @@ import flowDb from './flowDb.js';
 import flowRendererV2 from './flowRenderer-v2.js';
 import flowStyles from './styles.js';
 import type { MermaidConfig } from '../../config.type.js';
-import { setConfig } from '../../config.js';
+import { setConfig } from '../../diagram-api/diagramAPI.js';

 export const diagram = {
  parser: flowParser,
--- a/packages/mermaid/src/diagrams/flowchart/flowRenderer-v2.js
+++ b/packages/mermaid/src/diagrams/flowchart/flowRenderer-v2.js
@@ -1,6 +1,6 @@
 import * as graphlib from 'dagre-d3-es/src/graphlib/index.js';
 import { select, curveLinear, selectAll } from 'd3';
-import { getConfig } from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import utils from '../../utils.js';
 import { render } from '../../dagre-wrapper/index.js';
 import { addHtmlLabel } from 'dagre-d3-es/src/dagre-js/label/add-html-label.js';
--- a/packages/mermaid/src/diagrams/flowchart/flowRenderer.js
+++ b/packages/mermaid/src/diagrams/flowchart/flowRenderer.js
@@ -1,6 +1,6 @@
 import * as graphlib from 'dagre-d3-es/src/graphlib/index.js';
 import { select, curveLinear, selectAll } from 'd3';
-import { getConfig } from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import { render as Render } from 'dagre-d3-es';
 import { applyStyle } from 'dagre-d3-es/src/dagre-js/util.js';
 import { addHtmlLabel } from 'dagre-d3-es/src/dagre-js/label/add-html-label.js';
--- a/packages/mermaid/src/diagrams/flowchart/flowRenderer.spec.js
+++ b/packages/mermaid/src/diagrams/flowchart/flowRenderer.spec.js
@@ -1,5 +1,5 @@
 import { addVertices, addEdges } from './flowRenderer.js';
-import { setConfig } from '../../config.js';
+import { setConfig } from '../../diagram-api/diagramAPI.js';

 setConfig({
  flowchart: {
--- a/packages/mermaid/src/diagrams/gantt/ganttDb.js
+++ b/packages/mermaid/src/diagrams/gantt/ganttDb.js
@@ -4,7 +4,7 @@ import dayjsIsoWeek from 'dayjs/plugin/isoWeek.js';
 import dayjsCustomParseFormat from 'dayjs/plugin/customParseFormat.js';
 import dayjsAdvancedFormat from 'dayjs/plugin/advancedFormat.js';
 import { log } from '../../logger.js';
-import * as configApi from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import utils from '../../utils.js';

 import {
@@ -603,7 +603,7 @@ const compileTasks = function () {
 */
 export const setLink = function (ids, _linkStr) {
  let linkStr = _linkStr;
-  if (configApi.getConfig().securityLevel !== 'loose') {
+  if (getConfig().securityLevel !== 'loose') {
    linkStr = sanitizeUrl(_linkStr);
  }
  ids.split(',').forEach(function (id) {
@@ -634,7 +634,7 @@ export const setClass = function (ids, className) {
 };

 const setClickFun = function (id, functionName, functionArgs) {
-  if (configApi.getConfig().securityLevel !== 'loose') {
+  if (getConfig().securityLevel !== 'loose') {
    return;
  }
  if (functionName === undefined) {
@@ -725,7 +725,7 @@ export const bindFunctions = function (element) {
 };

 export default {
-  getConfig: () => configApi.getConfig().gantt,
+  getConfig: () => getConfig().gantt,
  clear,
  setDateFormat,
  getDateFormat,
--- a/packages/mermaid/src/diagrams/gantt/ganttRenderer.js
+++ b/packages/mermaid/src/diagrams/gantt/ganttRenderer.js
@@ -25,7 +25,7 @@ import {
  timeMonth,
 } from 'd3';
 import common from '../common/common.js';
-import { getConfig } from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import { configureSvgSize } from '../../setupGraphViewbox.js';

 export const setConf = function () {
--- a/packages/mermaid/src/diagrams/git/gitGraphAst.js
+++ b/packages/mermaid/src/diagrams/git/gitGraphAst.js
@@ -1,7 +1,6 @@
 import { log } from '../../logger.js';
 import { random } from '../../utils.js';
-import * as configApi from '../../config.js';
-import { getConfig } from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import common from '../common/common.js';
 import {
  setAccTitle,
@@ -106,9 +105,9 @@ export const getOptions = function () {

 export const commit = function (msg, id, type, tag) {
  log.debug('Entering commit:', msg, id, type, tag);
-  id = common.sanitizeText(id, configApi.getConfig());
-  msg = common.sanitizeText(msg, configApi.getConfig());
-  tag = common.sanitizeText(tag, configApi.getConfig());
+  id = common.sanitizeText(id, getConfig());
+  msg = common.sanitizeText(msg, getConfig());
+  tag = common.sanitizeText(tag, getConfig());
  const commit = {
    id: id ? id : seq + '-' + getId(),
    message: msg,
@@ -125,7 +124,7 @@ export const commit = function (msg, id, type, tag) {
 };

 export const branch = function (name, order) {
-  name = common.sanitizeText(name, configApi.getConfig());
+  name = common.sanitizeText(name, getConfig());
  if (branches[name] === undefined) {
    branches[name] = head != null ? head.id : null;
    branchesConfig[name] = { name, order: order ? parseInt(order, 10) : null };
@@ -149,8 +148,8 @@ export const branch = function (name, order) {
 };

 export const merge = function (otherBranch, custom_id, override_type, custom_tag) {
-  otherBranch = common.sanitizeText(otherBranch, configApi.getConfig());
-  custom_id = common.sanitizeText(custom_id, configApi.getConfig());
+  otherBranch = common.sanitizeText(otherBranch, getConfig());
+  custom_id = common.sanitizeText(custom_id, getConfig());

  const currentCommit = commits[branches[curBranch]];
  const otherCommit = commits[branches[otherBranch]];
@@ -258,9 +257,9 @@ export const merge = function (otherBranch, custom_id, override_type, custom_tag

 export const cherryPick = function (sourceId, targetId, tag) {
  log.debug('Entering cherryPick:', sourceId, targetId, tag);
-  sourceId = common.sanitizeText(sourceId, configApi.getConfig());
-  targetId = common.sanitizeText(targetId, configApi.getConfig());
-  tag = common.sanitizeText(tag, configApi.getConfig());
+  sourceId = common.sanitizeText(sourceId, getConfig());
+  targetId = common.sanitizeText(targetId, getConfig());
+  tag = common.sanitizeText(tag, getConfig());

  if (!sourceId || commits[sourceId] === undefined) {
    let error = new Error(
@@ -338,7 +337,7 @@ export const cherryPick = function (sourceId, targetId, tag) {
  }
 };
 export const checkout = function (branch) {
-  branch = common.sanitizeText(branch, configApi.getConfig());
+  branch = common.sanitizeText(branch, getConfig());
  if (branches[branch] === undefined) {
    let error = new Error(
      'Trying to checkout branch which is not yet created. (Help try using "branch ' + branch + '")'
@@ -502,7 +501,7 @@ export const commitType = {
 };

 export default {
-  getConfig: () => configApi.getConfig().gitGraph,
+  getConfig: () => getConfig().gitGraph,
  setDirection,
  setOptions,
  getOptions,
--- a/packages/mermaid/src/diagrams/git/layout.js
+++ b/packages/mermaid/src/diagrams/git/layout.js
@@ -1,4 +1,4 @@
-import { getConfig } from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';

 export default (dir, _branches) => {
  const config = getConfig().gitGraph;
--- a/packages/mermaid/src/diagrams/mindmap/mindmapDb.js
+++ b/packages/mermaid/src/diagrams/mindmap/mindmapDb.js
@@ -1,4 +1,4 @@
-import { getConfig } from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import { sanitizeText as _sanitizeText } from '../../diagrams/common/common.js';
 import { log } from '../../logger.js';

--- a/packages/mermaid/src/diagrams/mindmap/mindmapRenderer.js
+++ b/packages/mermaid/src/diagrams/mindmap/mindmapRenderer.js
@@ -1,7 +1,7 @@
 /** Created by knut on 14-12-11. */
 import { select } from 'd3';
 import { log } from '../../logger.js';
-import { getConfig } from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import { setupGraphViewbox } from '../../setupGraphViewbox.js';
 import svgDraw from './svgDraw.js';
 import cytoscape from 'cytoscape/dist/cytoscape.umd.js';
--- a/packages/mermaid/src/diagrams/pie/pie.spec.ts
+++ b/packages/mermaid/src/diagrams/pie/pie.spec.ts
@@ -1,7 +1,7 @@
 // @ts-ignore: JISON doesn't support types
 import { parser } from './parser/pie.jison';
 import { DEFAULT_PIE_DB, db } from './pieDb.js';
-import { setConfig } from '../../config.js';
+import { setConfig } from '../../diagram-api/diagramAPI.js';

 setConfig({
  securityLevel: 'strict',
--- a/packages/mermaid/src/diagrams/pie/pieDb.ts
+++ b/packages/mermaid/src/diagrams/pie/pieDb.ts
@@ -1,5 +1,5 @@
 import { log } from '../../logger.js';
-import { getConfig as commonGetConfig } from '../../config.js';
+import { getConfig as commonGetConfig } from '../../diagram-api/diagramAPI.js';
 import { sanitizeText } from '../common/common.js';
 import {
  setAccTitle,
--- a/packages/mermaid/src/diagrams/pie/pieRenderer.ts
+++ b/packages/mermaid/src/diagrams/pie/pieRenderer.ts
@@ -3,7 +3,7 @@ import { scaleOrdinal, pie as d3pie, arc } from 'd3';

 import { log } from '../../logger.js';
 import { configureSvgSize } from '../../setupGraphViewbox.js';
-import { getConfig } from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import { cleanAndMerge, parseFontSize } from '../../utils.js';
 import type { DrawDefinition, Group, SVG } from '../../diagram-api/types.js';
 import type { D3Sections, PieDB, Sections } from './pieTypes.js';
--- a/packages/mermaid/src/diagrams/quadrant-chart/quadrantDb.ts
+++ b/packages/mermaid/src/diagrams/quadrant-chart/quadrantDb.ts
@@ -1,4 +1,4 @@
-import * as configApi from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import { sanitizeText } from '../common/common.js';
 import {
  setAccTitle,
@@ -11,7 +11,7 @@ import {
 } from '../common/commonDb.js';
 import { QuadrantBuilder } from './quadrantBuilder.js';

-const config = configApi.getConfig();
+const config = getConfig();

 function textSanitizer(text: string) {
  return sanitizeText(text.trim(), config);
@@ -66,7 +66,7 @@ function setHeight(height: number) {
 }

 function getQuadrantData() {
-  const config = configApi.getConfig();
+  const config = getConfig();
  const { themeVariables, quadrantChart: quadrantChartConfig } = config;
  if (quadrantChartConfig) {
    quadrantBuilder.setConfig(quadrantChartConfig);
--- a/packages/mermaid/src/diagrams/quadrant-chart/quadrantRenderer.ts
+++ b/packages/mermaid/src/diagrams/quadrant-chart/quadrantRenderer.ts
@@ -1,6 +1,6 @@
 // @ts-nocheck - don't check until handle it
 import { select } from 'd3';
-import * as configApi from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import { log } from '../../logger.js';
 import { configureSvgSize } from '../../setupGraphViewbox.js';
 import type { Diagram } from '../../Diagram.js';
@@ -27,7 +27,7 @@ export const draw = (txt: string, id: string, _version: string, diagObj: Diagram
    return `translate(${data.x}, ${data.y}) rotate(${data.rotation || 0})`;
  }

-  const conf = configApi.getConfig();
+  const conf = getConfig();

  log.debug('Rendering quadrant chart\n' + txt);

--- a/packages/mermaid/src/diagrams/requirement/requirementDb.js
+++ b/packages/mermaid/src/diagrams/requirement/requirementDb.js
@@ -1,4 +1,4 @@
-import * as configApi from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import { log } from '../../logger.js';

 import {
@@ -144,7 +144,7 @@ export default {
  VerifyType,
  Relationships,

-  getConfig: () => configApi.getConfig().req,
+  getConfig: () => getConfig().req,

  addRequirement,
  getRequirements,
--- a/packages/mermaid/src/diagrams/requirement/requirementRenderer.js
+++ b/packages/mermaid/src/diagrams/requirement/requirementRenderer.js
@@ -5,7 +5,7 @@ import { log } from '../../logger.js';
 import { configureSvgSize } from '../../setupGraphViewbox.js';
 import common from '../common/common.js';
 import markers from './requirementMarkers.js';
-import { getConfig } from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';

 let conf = {};
 let relCnt = 0;
--- a/packages/mermaid/src/diagrams/sankey/sankeyDB.ts
+++ b/packages/mermaid/src/diagrams/sankey/sankeyDB.ts
@@ -1,4 +1,4 @@
-import * as configApi from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import common from '../common/common.js';
 import {
  setAccTitle,
@@ -42,7 +42,7 @@ class SankeyNode {
 }

 const findOrCreateNode = (ID: string): SankeyNode => {
-  ID = common.sanitizeText(ID, configApi.getConfig());
+  ID = common.sanitizeText(ID, getConfig());

  if (!nodesMap[ID]) {
    nodesMap[ID] = new SankeyNode(ID);
@@ -65,7 +65,7 @@ const getGraph = () => ({

 export default {
  nodesMap,
-  getConfig: () => configApi.getConfig().sankey,
+  getConfig: () => getConfig().sankey,
  getNodes,
  getLinks,
  getGraph,
--- a/packages/mermaid/src/diagrams/sankey/sankeyRenderer.ts
+++ b/packages/mermaid/src/diagrams/sankey/sankeyRenderer.ts
@@ -1,5 +1,5 @@
 import type { Diagram } from '../../Diagram.js';
-import * as configApi from '../../config.js';
+import { getConfig, defaultConfig } from '../../diagram-api/diagramAPI.js';

 import {
  select as d3select,
@@ -41,8 +41,8 @@ const alignmentsMap: Record<
 */
 export const draw = function (text: string, id: string, _version: string, diagObj: Diagram): void {
  // Get Sankey config
-  const { securityLevel, sankey: conf } = configApi.getConfig();
-  const defaultSankeyConfig = configApi!.defaultConfig!.sankey!;
+  const { securityLevel, sankey: conf } = getConfig();
+  const defaultSankeyConfig = defaultConfig!.sankey!;

  // TODO:
  // This code repeats for every diagram
--- a/packages/mermaid/src/diagrams/sequence/sequenceDb.js
+++ b/packages/mermaid/src/diagrams/sequence/sequenceDb.js
@@ -1,4 +1,4 @@
-import * as configApi from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import { log } from '../../logger.js';
 import { sanitizeText } from '../common/common.js';
 import {
@@ -196,7 +196,7 @@ export const autoWrap = () => {
  if (wrapEnabled !== undefined) {
    return wrapEnabled;
  }
-  return configApi.getConfig().sequence.wrap;
+  return getConfig().sequence.wrap;
 };

 export const clear = function () {
@@ -251,7 +251,7 @@ export const parseBoxData = function (str) {
    color: color,
    text:
      title !== undefined
-        ? sanitizeText(title.replace(/^:?(?:no)?wrap:/, ''), configApi.getConfig())
+        ? sanitizeText(title.replace(/^:?(?:no)?wrap:/, ''), getConfig())
        : undefined,
    wrap:
      title !== undefined
@@ -337,7 +337,7 @@ export const addLinks = function (actorId, text) {
  const actor = getActor(actorId);
  // JSON.parse the text
  try {
-    let sanitizedText = sanitizeText(text.text, configApi.getConfig());
+    let sanitizedText = sanitizeText(text.text, getConfig());
    sanitizedText = sanitizedText.replace(/&amp;/g, '&');
    sanitizedText = sanitizedText.replace(/&equals;/g, '=');
    const links = JSON.parse(sanitizedText);
@@ -353,7 +353,7 @@ export const addALink = function (actorId, text) {
  const actor = getActor(actorId);
  try {
    const links = {};
-    let sanitizedText = sanitizeText(text.text, configApi.getConfig());
+    let sanitizedText = sanitizeText(text.text, getConfig());
    var sep = sanitizedText.indexOf('@');
    sanitizedText = sanitizedText.replace(/&amp;/g, '&');
    sanitizedText = sanitizedText.replace(/&equals;/g, '=');
@@ -387,7 +387,7 @@ export const addProperties = function (actorId, text) {
  const actor = getActor(actorId);
  // JSON.parse the text
  try {
-    let sanitizedText = sanitizeText(text.text, configApi.getConfig());
+    let sanitizedText = sanitizeText(text.text, getConfig());
    const properties = JSON.parse(sanitizedText);
    // add the deserialized text to the actor's property field.
    insertProperties(actor, properties);
@@ -629,7 +629,7 @@ export default {
  getBoxes,
  getDiagramTitle,
  setDiagramTitle,
-  getConfig: () => configApi.getConfig().sequence,
+  getConfig: () => getConfig().sequence,
  clear,
  parseMessage,
  parseBoxData,
--- a/packages/mermaid/src/diagrams/sequence/sequenceDiagram.spec.js
+++ b/packages/mermaid/src/diagrams/sequence/sequenceDiagram.spec.js
@@ -1,5 +1,5 @@
 import { vi } from 'vitest';
-import * as configApi from '../../config.js';
+import { setSiteConfig } from '../../diagram-api/diagramAPI.js';
 import mermaidAPI from '../../mermaidAPI.js';
 import { Diagram, getDiagramFromText } from '../../Diagram.js';
 import { addDiagrams } from '../../diagram-api/diagram-orchestration.js';
@@ -1610,7 +1610,7 @@ describe('when rendering a sequenceDiagram APA', function () {
      wrap: false,
      mirrorActors: false,
    };
-    configApi.setSiteConfig({ logLevel: 5, sequence: conf });
+    setSiteConfig({ logLevel: 5, sequence: conf });
  });
  let conf;
  beforeEach(function () {
@@ -1631,7 +1631,7 @@ describe('when rendering a sequenceDiagram APA', function () {
      wrap: false,
      mirrorActors: false,
    };
-    configApi.setSiteConfig({ logLevel: 5, sequence: conf });
+    setSiteConfig({ logLevel: 5, sequence: conf });
    diagram = new Diagram(`
 sequenceDiagram
 Alice->Bob:Hello Bob, how are you?
--- a/packages/mermaid/src/diagrams/sequence/sequenceRenderer.ts
+++ b/packages/mermaid/src/diagrams/sequence/sequenceRenderer.ts
@@ -4,7 +4,7 @@ import svgDraw, { ACTOR_TYPE_WIDTH, drawText, fixLifeLineHeights } from './svgDr
 import { log } from '../../logger.js';
 import common from '../common/common.js';
 import * as svgDrawCommon from '../common/svgDrawCommon.js';
-import * as configApi from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import assignWithDepth from '../../assignWithDepth.js';
 import utils from '../../utils.js';
 import { configureSvgSize } from '../../setupGraphViewbox.js';
@@ -91,7 +91,7 @@ export const bounds = {
      stopy: undefined,
    };
    this.verticalPos = 0;
-    setConf(configApi.getConfig());
+    setConf(getConfig());
  },
  updateVal: function (obj, key, val, fun) {
    if (obj[key] === undefined) {
@@ -747,7 +747,7 @@ function adjustCreatedDestroyedData(
 * @param diagObj - A standard diagram containing the db and the text and type etc of the diagram
 */
 export const draw = function (_text: string, id: string, _version: string, diagObj: Diagram) {
-  const { securityLevel, sequence } = configApi.getConfig();
+  const { securityLevel, sequence } = getConfig();
  conf = sequence;
  // Handle root and Document for when rendering in sandbox mode
  let sandboxElement;
--- a/packages/mermaid/src/diagrams/state/shapes.js
+++ b/packages/mermaid/src/diagrams/state/shapes.js
@@ -3,7 +3,7 @@ import idCache from './id-cache.js';
 import stateDb from './stateDb.js';
 import utils from '../../utils.js';
 import common from '../common/common.js';
-import { getConfig } from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import { log } from '../../logger.js';

 /**
--- a/packages/mermaid/src/diagrams/state/stateDb.js
+++ b/packages/mermaid/src/diagrams/state/stateDb.js
@@ -1,7 +1,7 @@
 import { log } from '../../logger.js';
 import { generateId } from '../../utils.js';
 import common from '../common/common.js';
-import * as configApi from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import {
  setAccTitle,
  getAccTitle,
@@ -253,7 +253,7 @@ export const addState = function (
    currentDocument.states[trimmedId].note = note;
    currentDocument.states[trimmedId].note.text = common.sanitizeText(
      currentDocument.states[trimmedId].note.text,
-      configApi.getConfig()
+      getConfig()
    );
  }

@@ -398,7 +398,7 @@ export function addRelationObjs(item1, item2, relationTitle) {
  currentDocument.relations.push({
    id1,
    id2,
-    relationTitle: common.sanitizeText(relationTitle, configApi.getConfig()),
+    relationTitle: common.sanitizeText(relationTitle, getConfig()),
  });
 }

@@ -423,7 +423,7 @@ export const addRelation = function (item1, item2, title) {
    currentDocument.relations.push({
      id1,
      id2,
-      title: common.sanitizeText(title, configApi.getConfig()),
+      title: common.sanitizeText(title, getConfig()),
    });
  }
 };
@@ -431,7 +431,7 @@ export const addRelation = function (item1, item2, title) {
 export const addDescription = function (id, descr) {
  const theState = currentDocument.states[id];
  const _descr = descr.startsWith(':') ? descr.replace(':', '').trim() : descr;
-  theState.descriptions.push(common.sanitizeText(_descr, configApi.getConfig()));
+  theState.descriptions.push(common.sanitizeText(_descr, getConfig()));
 };

 export const cleanupLabel = function (label) {
@@ -542,7 +542,7 @@ const setDirection = (dir) => {
 const trimColon = (str) => (str && str[0] === ':' ? str.substr(1).trim() : str.trim());

 export default {
-  getConfig: () => configApi.getConfig().state,
+  getConfig: () => getConfig().state,
  addState,
  clear,
  getState,
--- a/packages/mermaid/src/diagrams/state/stateRenderer-v2.js
+++ b/packages/mermaid/src/diagrams/state/stateRenderer-v2.js
@@ -1,6 +1,6 @@
 import * as graphlib from 'dagre-d3-es/src/graphlib/index.js';
 import { select } from 'd3';
-import { getConfig } from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import { render } from '../../dagre-wrapper/index.js';
 import { log } from '../../logger.js';
 import { configureSvgSize } from '../../setupGraphViewbox.js';
--- a/packages/mermaid/src/diagrams/state/stateRenderer.js
+++ b/packages/mermaid/src/diagrams/state/stateRenderer.js
@@ -4,7 +4,7 @@ import * as graphlib from 'dagre-d3-es/src/graphlib/index.js';
 import { log } from '../../logger.js';
 import common from '../common/common.js';
 import { drawState, addTitleAndBox, drawEdge } from './shapes.js';
-import { getConfig } from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import { configureSvgSize } from '../../setupGraphViewbox.js';

 // TODO Move conf object to main conf in mermaidAPI
--- a/packages/mermaid/src/diagrams/timeline/timelineRenderer.ts
+++ b/packages/mermaid/src/diagrams/timeline/timelineRenderer.ts
@@ -3,7 +3,7 @@ import type { Selection } from 'd3';
 import { select } from 'd3';
 import svgDraw from './svgDraw.js';
 import { log } from '../../logger.js';
-import { getConfig } from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import { setupGraphViewbox } from '../../setupGraphViewbox.js';
 import type { Diagram } from '../../Diagram.js';
 import type { MermaidConfig } from '../../config.type.js';
--- a/packages/mermaid/src/diagrams/user-journey/journeyDb.js
+++ b/packages/mermaid/src/diagrams/user-journey/journeyDb.js
@@ -1,4 +1,4 @@
-import * as configApi from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import {
  setAccTitle,
  getAccTitle,
@@ -113,7 +113,7 @@ const getActors = function () {
 };

 export default {
-  getConfig: () => configApi.getConfig().journey,
+  getConfig: () => getConfig().journey,
  clear,
  setDiagramTitle,
  getDiagramTitle,
--- a/packages/mermaid/src/diagrams/user-journey/journeyRenderer.ts
+++ b/packages/mermaid/src/diagrams/user-journey/journeyRenderer.ts
@@ -1,7 +1,7 @@
 // @ts-nocheck TODO: fix file
 import { select } from 'd3';
 import svgDraw from './svgDraw.js';
-import { getConfig } from '../../config.js';
+import { getConfig } from '../../diagram-api/diagramAPI.js';
 import { configureSvgSize } from '../../setupGraphViewbox.js';

 export const setConf = function (cnf) {
--- a/packages/mermaid/src/rendering-util/selectSvgElement.ts
+++ b/packages/mermaid/src/rendering-util/selectSvgElement.ts
@@ -1,5 +1,5 @@
 import { select } from 'd3';
-import { getConfig } from '../config.js';
+import { getConfig } from '../diagram-api/diagramAPI.js';
 import type { HTML, SVG } from '../diagram-api/types.js';

 /**