@multiplatform.one/markdown 6.0.0

package/dist/cjs/mdx.spec.cjs

@@ -0,0 +1,400 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+// If the importer is in node compatibility mode or this is not an ESM
+// file that has been converted to a CommonJS file using a Babel-
+// compatible transform (i.e. "__esModule" has not been set), then set
+// "default" to the CommonJS "module.exports" for node compatibility.
+isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+  value: mod,
+  enumerable: true
+}) : target, mod));
+var import_react = require("@testing-library/react");
+var import_test_utils = require("@multiplatform.one/test-utils");
+var import_tamagui = require("tamagui");
+var import_vitest = require("vitest");
+var import_ExternalIcon = require("./ExternalIcon/index.cjs");
+var import_Hr = require("./Hr/index.cjs");
+var import_Li = require("./Li/index.cjs");
+var import_Mdx = require("./Mdx/index.cjs");
+var import_MdxCodeBlock = require("./MdxCodeBlock/index.cjs");
+var import_mdxComponents = require("./mdxComponents.cjs");
+var import_Ul = require("./Ul/index.cjs");
+var IndexExports = __toESM(require("./index.cjs"));
+var import_jsx_runtime = require("react/jsx-runtime");
+import_vitest.vi.mock("multiplatform.one", () => ({
+  isWeb: false
+}));
+import_mdxComponents.mdxComponents.H1 = import_mdxComponents.mdxComponents.h1 || (props => /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.H1, {
+  ...props
+}));
+import_mdxComponents.mdxComponents.H2 = import_mdxComponents.mdxComponents.h2 || (props => /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.H2, {
+  ...props
+}));
+import_mdxComponents.mdxComponents.H3 = import_mdxComponents.mdxComponents.h3 || (props => /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.H3, {
+  ...props
+}));
+import_mdxComponents.mdxComponents.YStack = import_mdxComponents.mdxComponents.ystack || (props => /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.YStack, {
+  ...props
+}));
+if (typeof import_mdxComponents.mdxComponents.Text !== "function") {
+  import_mdxComponents.mdxComponents.Text = props => /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
+    ...props
+  });
+}
+if (typeof import_mdxComponents.mdxComponents.a !== "function") {
+  import_mdxComponents.mdxComponents.a = function Link({
+    href,
+    children,
+    ...props
+  }) {
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Anchor, {
+      href,
+      ...props,
+      children
+    });
+  };
+}
+import_vitest.vi.mock("tamagui", async importOriginal => {
+  const actual = await importOriginal();
+  const React = require("react");
+  const FakeH1 = ({
+    children,
+    ...props
+  }) => React.createElement("h1", props, children);
+  FakeH1.displayName = "H1";
+  const FakeH2 = ({
+    children,
+    ...props
+  }) => React.createElement("h2", props, children);
+  FakeH2.displayName = "H2";
+  const FakeH3 = ({
+    children,
+    ...props
+  }) => React.createElement("h3", props, children);
+  FakeH3.displayName = "H3";
+  const FakeParagraph = ({
+    children,
+    ...props
+  }) => React.createElement("p", props, children);
+  FakeParagraph.displayName = "Paragraph";
+  const FakeYStack = ({
+    children,
+    ...props
+  }) => React.createElement("Text", props, children);
+  FakeYStack.displayName = "YStack";
+  const FakeXStack = ({
+    children,
+    ...props
+  }) => React.createElement("Text", props, children);
+  FakeXStack.displayName = "XStack";
+  const FakeText = ({
+    children,
+    ...props
+  }) => React.createElement("Text", props, children);
+  FakeText.displayName = "Text";
+  return {
+    ...actual,
+    H1: FakeH1,
+    H2: FakeH2,
+    H3: FakeH3,
+    Paragraph: FakeParagraph,
+    YStack: FakeYStack,
+    XStack: FakeXStack,
+    Text: FakeText
+  };
+});
+import_vitest.vi.mock("../code/code", () => ({
+  CodeInline: ({
+    children
+  }) => /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
+    "data-testid": "code-inline",
+    children
+  })
+}));
+import_vitest.vi.mock("./mdxCodeBlock", () => ({
+  MDXCodeBlock: ({
+    children,
+    className: _className,
+    isHighlightingLines: _isHighlightingLines,
+    showLineNumbers: _showLineNumbers,
+    ...props
+  }) => /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.YStack, {
+    "data-testid": "mdx-code-block",
+    ...props,
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.YStack, {
+      children
+    })
+  })
+}));
+import_vitest.vi.mock("@multiplatform.one/router", async importOriginal => {
+  const actual = await importOriginal();
+  return {
+    ...actual,
+    Link: ({
+      children,
+      ...props
+    }) => /* @__PURE__ */(0, import_jsx_runtime.jsx)("a", {
+      ...props,
+      children
+    })
+  };
+});
+import_vitest.vi.mock("@tamagui/react-native-svg", () => ({
+  Svg: ({
+    children,
+    ...props
+  }) => /* @__PURE__ */(0, import_jsx_runtime.jsx)("svg", {
+    ...props,
+    children
+  }),
+  Path: props => /* @__PURE__ */(0, import_jsx_runtime.jsx)("path", {
+    ...props
+  }),
+  Circle: props => /* @__PURE__ */(0, import_jsx_runtime.jsx)("circle", {
+    ...props
+  }),
+  Line: props => /* @__PURE__ */(0, import_jsx_runtime.jsx)("line", {
+    ...props
+  }),
+  Rect: props => /* @__PURE__ */(0, import_jsx_runtime.jsx)("rect", {
+    ...props
+  }),
+  Polyline: props => /* @__PURE__ */(0, import_jsx_runtime.jsx)("polyline", {
+    ...props
+  })
+}));
+(0, import_vitest.describe)("MDX Components", () => {
+  (0, import_vitest.afterEach)(() => {
+    import_vitest.vi.clearAllMocks();
+  });
+  (0, import_vitest.describe)("Heading Components", () => {
+    import_vitest.it.skip("renders H1 with correct props", () => {
+      (0, import_test_utils.renderWithProviders)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {
+        children: import_mdxComponents.mdxComponents.H1({
+          children: "Test Heading"
+        })
+      }));
+      const heading = import_react.screen.getByRole("heading", {
+        level: 1
+      });
+      (0, import_vitest.expect)(heading).toBeTruthy();
+      (0, import_vitest.expect)(heading.textContent).toBe("Test Heading");
+    });
+    import_vitest.it.skip("renders H2 with data-heading attribute", () => {
+      (0, import_test_utils.renderWithProviders)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {
+        children: import_mdxComponents.mdxComponents.H2({
+          children: "Test Heading",
+          "data-heading": true
+        })
+      }));
+      const heading = import_react.screen.getByRole("heading", {
+        level: 2
+      });
+      (0, import_vitest.expect)(heading).toBeTruthy();
+      (0, import_vitest.expect)(heading.textContent).toBe("Test Heading");
+    });
+    import_vitest.it.skip("renders H3 with link heading", () => {
+      (0, import_test_utils.renderWithProviders)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {
+        children: import_mdxComponents.mdxComponents.H3({
+          children: "Test Heading",
+          id: "test-id"
+        })
+      }));
+      const heading = import_react.screen.getByRole("heading", {
+        level: 3
+      });
+      (0, import_vitest.expect)(heading).toBeTruthy();
+      (0, import_vitest.expect)(heading.getAttribute("id") || heading.getAttribute("nativeID")).toBe("test-id");
+    });
+  });
+  (0, import_vitest.describe)("Link Component", () => {
+    import_vitest.it.skip("renders link with href using only Tamagui components", () => {
+      (0, import_test_utils.renderWithProviders)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {
+        children: import_mdxComponents.mdxComponents.a({
+          href: "/test",
+          children: "Test Link"
+        })
+      }));
+      const link = import_react.screen.getByRole("link");
+      (0, import_vitest.expect)(link).toBeTruthy();
+      (0, import_vitest.expect)(link.getAttribute("href")).toBe("/test");
+    });
+  });
+  (0, import_vitest.describe)("Code Component", () => {
+    import_vitest.it.skip("renders inline code when no className provided", () => {
+      (0, import_test_utils.renderWithProviders)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {
+        children: import_mdxComponents.mdxComponents.code({
+          children: "test code",
+          hero: false,
+          line: void 0,
+          scrollable: false,
+          className: void 0,
+          id: void 0,
+          showLineNumbers: void 0,
+          collapsible: false
+        })
+      }));
+      const inlineCode = import_react.screen.getByTestId("code-inline");
+      (0, import_vitest.expect)(inlineCode).toBeTruthy();
+      (0, import_vitest.expect)(inlineCode.textContent).toBe("test code");
+    });
+    import_vitest.it.skip("renders code block when a className is provided", () => {
+      (0, import_test_utils.renderWithProviders)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {
+        children: import_mdxComponents.mdxComponents.code({
+          children: "test code block",
+          className: "language-javascript",
+          hero: false,
+          line: void 0,
+          scrollable: false,
+          id: void 0,
+          showLineNumbers: void 0,
+          collapsible: false
+        })
+      }));
+      const codeBlock = import_react.screen.getByTestId("mdx-code-block");
+      (0, import_vitest.expect)(codeBlock).toBeTruthy();
+      (0, import_vitest.expect)(codeBlock.textContent).toBe("test code block");
+    });
+  });
+  (0, import_vitest.describe)("List Components", () => {
+    import_vitest.it.skip("renders list item", () => {
+      (0, import_test_utils.renderWithProviders)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {
+        children: import_mdxComponents.mdxComponents.li({
+          children: "List Item"
+        })
+      }));
+      (0, import_vitest.expect)(import_react.screen.getByText("List Item")).toBeTruthy();
+    });
+  });
+  (0, import_vitest.describe)("Blockquote Component", () => {
+    import_vitest.it.skip("renders blockquote with correct styling", () => {
+      (0, import_test_utils.renderWithProviders)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {
+        children: import_mdxComponents.mdxComponents.blockquote({
+          children: "Quote text"
+        })
+      }));
+      (0, import_vitest.expect)(import_react.screen.getByText("Quote text")).toBeTruthy();
+    });
+  });
+  (0, import_vitest.describe)("Custom Text Mappings for YStack and Text", () => {
+    import_vitest.it.skip("renders mdxComponents.YStack mapping as Text without additional styling", () => {
+      (0, import_test_utils.renderWithProviders)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {
+        children: import_mdxComponents.mdxComponents.YStack({
+          children: "Hello YStack"
+        })
+      }));
+      const textEl = import_react.screen.getByText("Hello YStack");
+      (0, import_vitest.expect)(textEl.tagName).toBe("TEXT");
+      (0, import_vitest.expect)(textEl.getAttribute("color")).toBeNull();
+    });
+  });
+  (0, import_vitest.describe)("Non-web MDX Mappings", () => {
+    import_vitest.it.skip("renders the div mapping as a Tamagui Text", () => {
+      (0, import_test_utils.renderWithProviders)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {
+        children: import_mdxComponents.mdxComponents.div({
+          "data-testid": "mdx-div",
+          children: "Div Content"
+        })
+      }));
+      const divElem = import_react.screen.getByTestId("mdx-div");
+      (0, import_vitest.expect)(divElem).toBeTruthy();
+      (0, import_vitest.expect)(divElem.textContent).toBe("Div Content");
+    });
+    import_vitest.it.skip("renders the span mapping with 'token punctuation' class setting color to '$red10'", () => {
+      (0, import_test_utils.renderWithProviders)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {
+        children: import_mdxComponents.mdxComponents.span({
+          className: "token punctuation extra",
+          "data-testid": "mdx-span",
+          children: "Span Content"
+        })
+      }));
+      const spanElem = import_react.screen.getByTestId("mdx-span");
+      (0, import_vitest.expect)(spanElem).toBeTruthy();
+      (0, import_vitest.expect)(spanElem.textContent).toBe("Span Content");
+      (0, import_vitest.expect)(spanElem.getAttribute("color")).toBe("$red10");
+    });
+    import_vitest.it.skip("renders the span mapping with an unrelated class without setting color", () => {
+      (0, import_test_utils.renderWithProviders)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {
+        children: import_mdxComponents.mdxComponents.span({
+          className: "other-class",
+          "data-testid": "mdx-span-normal",
+          children: "Normal Span"
+        })
+      }));
+      const spanElem = import_react.screen.getByTestId("mdx-span-normal");
+      (0, import_vitest.expect)(spanElem).toBeTruthy();
+      (0, import_vitest.expect)(spanElem.textContent).toBe("Normal Span");
+      (0, import_vitest.expect)(spanElem.getAttribute("color")).toBeNull();
+    });
+  });
+  (0, import_vitest.describe)("Other MDX Mappings", () => {
+    import_vitest.it.skip("renders the p mapping as a Paragraph with correct text", () => {
+      (0, import_test_utils.renderWithProviders)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {
+        children: import_mdxComponents.mdxComponents.p({
+          "data-testid": "p-test",
+          children: "Paragraph Content"
+        })
+      }));
+      const pElem = import_react.screen.getByTestId("p-test");
+      (0, import_vitest.expect)(pElem).toBeDefined();
+      (0, import_vitest.expect)(pElem.textContent).toBe("Paragraph Content");
+    });
+    import_vitest.it.skip("renders the h3 mapping and verifies getNonTextChildren functionality", () => {
+      (0, import_test_utils.renderWithProviders)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {
+        children: import_mdxComponents.mdxComponents.h3({
+          id: "heading-test",
+          "data-testid": "h3-test",
+          children: ["This is heading", /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
+            "data-testid": "child-h3",
+            children: "Subheading"
+          }, "sub")]
+        })
+      }));
+      const h3Elem = import_react.screen.getByTestId("h3-test");
+      (0, import_vitest.expect)(h3Elem).toBeDefined();
+      (0, import_vitest.expect)(h3Elem.textContent).toContain("This is heading");
+      const subheadingInstances = import_react.screen.getAllByText("Subheading");
+      (0, import_vitest.expect)(subheadingInstances.length).toBe(2);
+    });
+  });
+});
+(0, import_vitest.describe)("MDX Index Exports", () => {
+  import_vitest.it.skip("should export ExternalIcon", () => {
+    (0, import_vitest.expect)(IndexExports.ExternalIcon).toBeDefined();
+    (0, import_vitest.expect)(IndexExports.ExternalIcon).toBe(import_ExternalIcon.ExternalIcon);
+  });
+  import_vitest.it.skip("should export HR", () => {
+    (0, import_vitest.expect)(IndexExports.HR).toBeDefined();
+    (0, import_vitest.expect)(IndexExports.HR).toBe(import_Hr.HR);
+  });
+  import_vitest.it.skip("should export LI", () => {
+    (0, import_vitest.expect)(IndexExports.LI).toBeDefined();
+    (0, import_vitest.expect)(IndexExports.LI).toBe(import_Li.LI);
+  });
+  import_vitest.it.skip("should export MDX", () => {
+    (0, import_vitest.expect)(IndexExports.MDX).toBeDefined();
+    (0, import_vitest.expect)(IndexExports.MDX).toBe(import_Mdx.MDX);
+  });
+  import_vitest.it.skip("should export MDXCodeBlock", () => {
+    (0, import_vitest.expect)(IndexExports.MDXCodeBlock).toBeDefined();
+    (0, import_vitest.expect)(IndexExports.MDXCodeBlock).toBe(import_MdxCodeBlock.MDXCodeBlock);
+  });
+  import_vitest.it.skip("should export UL", () => {
+    (0, import_vitest.expect)(IndexExports.UL).toBeDefined();
+    (0, import_vitest.expect)(IndexExports.UL).toBe(import_Ul.UL);
+  });
+});