remark-sandpack/dist/index.js

Use sandpack in MDX

var __defProp = Object.defineProperty;
var __defProps = Object.defineProperties;
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __propIsEnum = Object.prototype.propertyIsEnumerable;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __spreadValues = (a, b) => {
  for (var prop in b || (b = {}))
    if (__hasOwnProp.call(b, prop))
      __defNormalProp(a, prop, b[prop]);
  if (__getOwnPropSymbols)
    for (var prop of __getOwnPropSymbols(b)) {
      if (__propIsEnum.call(b, prop))
        __defNormalProp(a, prop, b[prop]);
    }
  return a;
};
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));

// src/node.ts
import { assert } from "console";
import { existsSync, readFileSync } from "fs";
import readDirRecursive from "fs-readdir-recursive";
import { basename, join } from "path";

// src/utils.ts
var isFilename = (str) => {
  return /[\w]+\.[\w]+/.test(str);
};

// src/node.ts
var transformCode = async (jsxNode, file) => {
  const files = {};
  const visit = await import("unist-util-visit").then((module) => module.visit);
  visit(jsxNode, "code", (codeNode) => {
    var _a;
    const meta = resolveCodeMeta(codeNode);
    let code = codeNode.value;
    if (meta.dir) {
      const dir = join(process.cwd(), meta.dir);
      assert(existsSync(dir));
      const dirFiles = readDirRecursive(dir);
      dirFiles.forEach((path) => {
        const file2 = files[path] || {};
        files[path] = __spreadProps(__spreadValues({}, file2), { code: readFileSync(join(dir, path), "utf8") });
      });
    } else if (meta.file) {
      const filePath = join(file.cwd, meta.file);
      if (existsSync(filePath)) {
        code = readFileSync(filePath, "utf8");
        meta.name || (meta.name = basename(filePath));
      }
    }
    if (meta.name) {
      let rawCode = "";
      rawCode = (_a = files[meta.name]) == null ? void 0 : _a.code;
      files[meta.name] = {
        code: code || rawCode || "",
        active: meta.active,
        hidden: meta.hidden,
        readOnly: meta.readOnly
      };
    }
  });
  await appendProp(jsxNode, "files", files);
};
var resolveCodeMeta = (codeNode) => {
  const joinedMeta = codeNode.lang + " " + (codeNode.meta || "");
  return joinedMeta.split(" ").filter((meta) => meta.length).reduce((meta, expression) => {
    const [key, value] = expression.split("=");
    if (!value && isFilename(key)) {
      meta.name = key;
    } else {
      meta[key] = value || true;
    }
    return meta;
  }, {});
};
var appendProp = async (node, propName, propValue) => {
  const valueToEstree = await import("estree-util-value-to-estree").then((module) => module.valueToEstree);
  node.attributes.push({
    type: "mdxJsxAttribute",
    name: propName,
    value: {
      type: "mdxJsxAttributeValueExpression",
      value: JSON.stringify(propValue),
      data: {
        estree: {
          type: "Program",
          body: [
            {
              type: "ExpressionStatement",
              expression: valueToEstree(propValue)
            }
          ],
          sourceType: "module"
        }
      }
    }
  });
};

// src/transform.ts
var transform = (options) => {
  const componentName = Array.isArray(options == null ? void 0 : options.componentName) ? options == null ? void 0 : options.componentName : [(options == null ? void 0 : options.componentName) || "Sandpack"];
  return async (tree, file) => {
    const visit = await import("unist-util-visit").then((module) => module.visit);
    const promises = [];
    visit(tree, "mdxJsxFlowElement", (jsxNode) => {
      if (!componentName.includes(jsxNode.name)) return;
      promises.push(async () => transformCode(jsxNode, file));
    });
    await Promise.all(promises.map((p) => p()));
  };
};
export {
  transform as remarkSandpack
};