markdown-it-infographic 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 William Engelmann
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,40 @@
+# markdown-it-infographic
+
+## Install
+```bash
+npm install @antv/infographic markdown-it-infographic
+```
+
+## Usage
+```ts
+const md = require('markdown-it')()
+const infographic = require('markdown-it-infographic')
+
+md.use(infographic)
+// md.use(infographic, {
+//  padding: 4
+// })
+```
+
+Input:
+````markdown
+```infographic
+infographic list-row-simple-horizontal-arrow
+data
+  items
+    - label 步骤 1
+      desc 开始
+    - label 步骤 2
+      desc 进行中
+    - label 步骤 3
+      desc 完成
+```
+````
+
+Output:
+```html
+<div data-infographic="true"><svg>...</svg></div>
+```
+
+## Options
+[Infographic](https://github.com/antvis/infographic) options.

package/dist/cjs/index.js

@@ -0,0 +1,58 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+
+module.exports = infographic;
+var infographic_1 = require("@antv/infographic");
+// Define interface to await readiness of import
+function infographic(md, baseOptions) {
+    function getLangName(info) {
+        return info.split(/\s+/g)[0];
+    }
+    // Store reference to original renderer.
+    var defaultFenceRenderer = md.renderer.rules.fence;
+    // Render custom code types as SVGs, letting the fence parser do all the heavy lifting.
+    function customFenceRenderer(tokens, idx, options, env, slf) {
+        var token = tokens[idx];
+        var info = token.info.trim();
+        var langName = info ? getLangName(info) : "";
+        if (["infographic", "{infographic}"].indexOf(langName) === -1) {
+            if (defaultFenceRenderer !== undefined) {
+                return defaultFenceRenderer(tokens, idx, options, env, slf);
+            }
+            // Missing fence renderer!
+            return "";
+        }
+        var element = document.createElement('div');
+        element.dataset.infographic = "true";
+        document.body.appendChild(element);
+        // Render with Mermaid
+        try {
+            var instance = new infographic_1.Infographic(__assign({ container: element }, baseOptions));
+            instance.render(token.content);
+            var svg = element.children[0];
+            // Infographic handles the visibility of svg internally through MutationObserver, we may output directly
+            // to the nodejs here, so we process the style to make it display by default
+            if (svg instanceof SVGElement) {
+                svg.style.visibility = '';
+            }
+        }
+        catch (e) {
+            return "<div class=\"alert alert-danger\">".concat(e, "</div>");
+        }
+        finally {
+            element.remove();
+        }
+        return element.outerHTML;
+    }
+    md.renderer.rules.fence = customFenceRenderer;
+}

package/dist/cjs/package.json

@@ -0,0 +1,3 @@
+{
+  "type": "commonjs"
+}

package/dist/cjs/tsconfig.cjs.tsbuildinfo

@@ -0,0 +1 @@
+{"root":["../../src/index.ts"],"version":"5.9.3"}

package/dist/esm/index.js

@@ -0,0 +1,47 @@
+import { Infographic } from "@antv/infographic";
+// Define interface to await readiness of import
+export default function infographic(md, baseOptions) {
+    function getLangName(info) {
+        return info.split(/\s+/g)[0];
+    }
+    // Store reference to original renderer.
+    let defaultFenceRenderer = md.renderer.rules.fence;
+    // Render custom code types as SVGs, letting the fence parser do all the heavy lifting.
+    function customFenceRenderer(tokens, idx, options, env, slf) {
+        let token = tokens[idx];
+        let info = token.info.trim();
+        let langName = info ? getLangName(info) : "";
+        if (["infographic", "{infographic}"].indexOf(langName) === -1) {
+            if (defaultFenceRenderer !== undefined) {
+                return defaultFenceRenderer(tokens, idx, options, env, slf);
+            }
+            // Missing fence renderer!
+            return "";
+        }
+        const element = document.createElement('div');
+        element.dataset.infographic = "true";
+        document.body.appendChild(element);
+        // Render with Mermaid
+        try {
+            const instance = new Infographic({
+                container: element,
+                ...baseOptions
+            });
+            instance.render(token.content);
+            const svg = element.children[0];
+            // Infographic handles the visibility of svg internally through MutationObserver, we may output directly
+            // to the nodejs here, so we process the style to make it display by default
+            if (svg instanceof SVGElement) {
+                svg.style.visibility = '';
+            }
+        }
+        catch (e) {
+            return `<div class="alert alert-danger">${e}</div>`;
+        }
+        finally {
+            element.remove();
+        }
+        return element.outerHTML;
+    }
+    md.renderer.rules.fence = customFenceRenderer;
+}

package/dist/esm/package.json

@@ -0,0 +1,3 @@
+{
+  "type": "module"
+}

package/dist/esm/tsconfig.esm.tsbuildinfo

@@ -0,0 +1 @@
+{"root":["../../src/index.ts"],"version":"5.9.3"}

package/dist/types/index.d.ts

@@ -0,0 +1,3 @@
+import MarkdownIt from "markdown-it";
+import { type InfographicOptions } from "@antv/infographic";
+export default function infographic(md: MarkdownIt, baseOptions?: Partial<Omit<InfographicOptions, 'container'>>): void;

package/dist/types/tsconfig.types.tsbuildinfo

@@ -0,0 +1 @@
+{"root":["../../src/index.ts"],"version":"5.9.3"}

package/package.json

@@ -0,0 +1,69 @@
+{
+  "name": "markdown-it-infographic",
+  "version": "1.0.0",
+  "description": "markdown-it plugin for @antv/Infographic",
+  "type": "module",
+  "exports": {
+    ".": {
+      "types": "./dist/types/index.d.ts",
+      "require": "./dist/cjs/index.js",
+      "import": "./dist/esm/index.js",
+      "default": "./dist/esm/index.js"
+    },
+    "./*": {
+      "types": "./dist/types/*.d.ts",
+      "require": "./dist/cjs/*.js",
+      "import": "./dist/esm/*.js",
+      "default": "./dist/esm/*.js"
+    }
+  },
+  "types": "./dist/types/index.d.ts",
+  "main": "./dist/cjs/index.js",
+  "scripts": {
+    "dev": "vitest",
+    "build": "tsc -b ./tsconfig.cjs.json ./tsconfig.esm.json ./tsconfig.types.json && node after-build.js",
+    "test": "vitest run",
+    "coverage": "vitest run --coverage"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/hcg1023/markdown-it-infographic"
+  },
+  "author": "hcg1023",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/hcg1023/markdown-it-infographic/issues"
+  },
+  "homepage": "https://github.com/hcg1023/markdown-it-infographic",
+  "keywords": [
+    "markdown",
+    "markdown-it",
+    "markdown-it-plugin",
+    "@antv/infographic"
+  ],
+  "files": [
+    "dist",
+    "docs",
+    "!**/*.spec.*",
+    "!test",
+    "LICENSE",
+    "README.md"
+  ],
+  "devDependencies": {
+    "@antv/infographic": "^0.2.6",
+    "@types/js-beautify": "^1.14.3",
+    "@types/markdown-it": "latest",
+    "eventemitter3": "^5.0.1",
+    "happy-dom": "^20.0.11",
+    "js-beautify": "^1.15.1",
+    "jsdom": "^27.4.0",
+    "markdown-it": "latest",
+    "typescript": "^5.0.3",
+    "vite": "^5.1.6",
+    "vite-plugin-dts": "^4.2.2",
+    "vitest": "^2.1.1"
+  },
+  "peerDependencies": {
+    "@antv/infographic": ">=0.2"
+  }
+}