@docubook/mdx 1.0.0

package/dist/adapters/next/index.js

@@ -0,0 +1,166 @@
+// src/adapters/next/index.tsx
+import NextLink from "next/link";
+import NextImage from "next/image";
+
+// src/core/components/Button.tsx
+import * as Icons from "lucide-react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function Button({
+  icon,
+  text,
+  href,
+  target,
+  size = "md",
+  variation = "primary",
+  LinkComponent
+}) {
+  const baseStyles = "inline-flex items-center justify-center rounded font-medium focus:outline-none transition no-underline";
+  const sizeStyles = {
+    sm: "px-3 py-1 my-6 text-sm",
+    md: "px-4 py-2 my-6 text-base",
+    lg: "px-5 py-3 my-6 text-lg"
+  };
+  const variationStyles = {
+    primary: "bg-primary text-white hover:bg-primary/90",
+    accent: "bg-accent text-white hover:bg-accent/90",
+    outline: "border border-accent text-accent hover:bg-accent/10"
+  };
+  const Icon = icon ? Icons[icon] : null;
+  const className = `${baseStyles} ${sizeStyles[size]} ${variationStyles[variation]}`;
+  const inner = /* @__PURE__ */ jsxs(Fragment, { children: [
+    text && /* @__PURE__ */ jsx("span", { children: text }),
+    Icon && /* @__PURE__ */ jsx(Icon, { className: "mr-2 h-5 w-5" })
+  ] });
+  if (LinkComponent) {
+    return /* @__PURE__ */ jsx(
+      LinkComponent,
+      {
+        href,
+        target,
+        rel: target === "_blank" ? "noopener noreferrer" : void 0,
+        className,
+        children: inner
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    "a",
+    {
+      href,
+      target,
+      rel: target === "_blank" ? "noopener noreferrer" : void 0,
+      className,
+      children: inner
+    }
+  );
+}
+
+// src/core/components/Card.tsx
+import * as Icons2 from "lucide-react";
+import clsx from "clsx";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function Card({
+  title,
+  icon,
+  href,
+  horizontal,
+  children,
+  className,
+  LinkComponent
+}) {
+  const Icon = icon ? Icons2[icon] : null;
+  const content = /* @__PURE__ */ jsxs2(
+    "div",
+    {
+      className: clsx(
+        "border rounded-lg shadow-sm p-4 transition-all duration-200",
+        "bg-card text-card-foreground border-border",
+        "hover:bg-accent/5 hover:border-accent/30",
+        "flex gap-2",
+        horizontal ? "flex-row items-start gap-1" : "flex-col space-y-1",
+        className
+      ),
+      children: [
+        Icon && /* @__PURE__ */ jsx2(Icon, { className: clsx("w-5 h-5 text-primary shrink-0", horizontal && "mt-0.5") }),
+        /* @__PURE__ */ jsxs2("div", { className: "flex-1 min-w-0", children: [
+          /* @__PURE__ */ jsx2("div", { className: "text-base font-semibold text-foreground leading-6", children: title }),
+          /* @__PURE__ */ jsx2("div", { className: "text-sm text-muted-foreground -mt-3", children })
+        ] })
+      ]
+    }
+  );
+  if (!href) return content;
+  if (LinkComponent) {
+    return /* @__PURE__ */ jsx2(LinkComponent, { href, className: "no-underline block", children: content });
+  }
+  return /* @__PURE__ */ jsx2("a", { className: "no-underline block", href, children: content });
+}
+
+// src/adapters/next/index.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+function isExternalHref(href) {
+  return /^(https?:|mailto:|tel:)/i.test(href);
+}
+function NextLinkMdx({ href, ...props }) {
+  if (!href) return null;
+  if (isExternalHref(href)) {
+    return /* @__PURE__ */ jsx3(
+      "a",
+      {
+        href,
+        ...props,
+        target: props.target ?? "_blank",
+        rel: props.rel ?? "noopener noreferrer"
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx3(NextLink, { href, ...props });
+}
+var NextLinkRenderer = ({ href, ...props }) => {
+  if (isExternalHref(href)) {
+    return /* @__PURE__ */ jsx3(
+      "a",
+      {
+        href,
+        ...props,
+        target: props.target ?? "_blank",
+        rel: props.rel ?? "noopener noreferrer"
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx3(NextLink, { href, ...props });
+};
+function NextButtonMdx(props) {
+  return /* @__PURE__ */ jsx3(Button, { ...props, LinkComponent: NextLinkRenderer });
+}
+function NextCardMdx(props) {
+  return /* @__PURE__ */ jsx3(Card, { ...props, LinkComponent: NextLinkRenderer });
+}
+function NextImageMdx({
+  src,
+  alt = "alt",
+  width = 800,
+  height = 350,
+  ...props
+}) {
+  if (!src) return null;
+  return /* @__PURE__ */ jsx3(
+    NextImage,
+    {
+      src,
+      alt,
+      width,
+      height,
+      quality: 85,
+      sizes: "(max-width: 768px) 100vw, (max-width: 1200px) 80vw, 800px",
+      className: "w-full h-auto rounded-lg transition-transform duration-300 group-hover:scale-[1.01]",
+      ...props
+    }
+  );
+}
+export {
+  NextButtonMdx,
+  NextCardMdx,
+  NextImageMdx,
+  NextLinkMdx
+};

package/dist/adapters/react-router/index.cjs

@@ -0,0 +1,290 @@
+"use strict";
+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 __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/adapters/react-router/index.tsx
+var react_router_exports = {};
+__export(react_router_exports, {
+  ReactRouterButtonMdx: () => ReactRouterButtonMdx,
+  ReactRouterCardMdx: () => ReactRouterCardMdx,
+  ReactRouterImageMdx: () => Image,
+  ReactRouterLinkMdx: () => ReactRouterLinkMdx
+});
+module.exports = __toCommonJS(react_router_exports);
+var import_react_router_dom = require("react-router-dom");
+
+// src/core/components/Button.tsx
+var Icons = __toESM(require("lucide-react"), 1);
+var import_jsx_runtime = require("react/jsx-runtime");
+function Button({
+  icon,
+  text,
+  href,
+  target,
+  size = "md",
+  variation = "primary",
+  LinkComponent
+}) {
+  const baseStyles = "inline-flex items-center justify-center rounded font-medium focus:outline-none transition no-underline";
+  const sizeStyles = {
+    sm: "px-3 py-1 my-6 text-sm",
+    md: "px-4 py-2 my-6 text-base",
+    lg: "px-5 py-3 my-6 text-lg"
+  };
+  const variationStyles = {
+    primary: "bg-primary text-white hover:bg-primary/90",
+    accent: "bg-accent text-white hover:bg-accent/90",
+    outline: "border border-accent text-accent hover:bg-accent/10"
+  };
+  const Icon = icon ? Icons[icon] : null;
+  const className = `${baseStyles} ${sizeStyles[size]} ${variationStyles[variation]}`;
+  const inner = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    text && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: text }),
+    Icon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, { className: "mr-2 h-5 w-5" })
+  ] });
+  if (LinkComponent) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      LinkComponent,
+      {
+        href,
+        target,
+        rel: target === "_blank" ? "noopener noreferrer" : void 0,
+        className,
+        children: inner
+      }
+    );
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "a",
+    {
+      href,
+      target,
+      rel: target === "_blank" ? "noopener noreferrer" : void 0,
+      className,
+      children: inner
+    }
+  );
+}
+
+// src/core/components/Card.tsx
+var Icons2 = __toESM(require("lucide-react"), 1);
+var import_clsx = __toESM(require("clsx"), 1);
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function Card({
+  title,
+  icon,
+  href,
+  horizontal,
+  children,
+  className,
+  LinkComponent
+}) {
+  const Icon = icon ? Icons2[icon] : null;
+  const content = /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+    "div",
+    {
+      className: (0, import_clsx.default)(
+        "border rounded-lg shadow-sm p-4 transition-all duration-200",
+        "bg-card text-card-foreground border-border",
+        "hover:bg-accent/5 hover:border-accent/30",
+        "flex gap-2",
+        horizontal ? "flex-row items-start gap-1" : "flex-col space-y-1",
+        className
+      ),
+      children: [
+        Icon && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Icon, { className: (0, import_clsx.default)("w-5 h-5 text-primary shrink-0", horizontal && "mt-0.5") }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex-1 min-w-0", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "text-base font-semibold text-foreground leading-6", children: title }),
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "text-sm text-muted-foreground -mt-3", children })
+        ] })
+      ]
+    }
+  );
+  if (!href) return content;
+  if (LinkComponent) {
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(LinkComponent, { href, className: "no-underline block", children: content });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("a", { className: "no-underline block", href, children: content });
+}
+
+// src/core/components/Image.tsx
+var import_react_dom = require("react-dom");
+var import_lucide_react = require("lucide-react");
+var import_react = require("react");
+var import_jsx_runtime3 = require("react/jsx-runtime");
+function Image({
+  src,
+  alt = "alt",
+  width = 800,
+  height = 350,
+  ...props
+}) {
+  const [isOpen, setIsOpen] = (0, import_react.useState)(false);
+  const scrollYRef = (0, import_react.useRef)(0);
+  (0, import_react.useEffect)(() => {
+    if (!isOpen) return;
+    scrollYRef.current = window.scrollY;
+    document.body.style.position = "fixed";
+    document.body.style.top = `-${scrollYRef.current}px`;
+    document.body.style.width = "100%";
+    const handleEsc = (e) => {
+      if (e.key === "Escape") setIsOpen(false);
+    };
+    window.addEventListener("keydown", handleEsc);
+    return () => {
+      document.body.style.position = "";
+      document.body.style.top = "";
+      document.body.style.width = "";
+      window.scrollTo(0, scrollYRef.current);
+      window.removeEventListener("keydown", handleEsc);
+    };
+  }, [isOpen]);
+  if (!src) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+      "button",
+      {
+        type: "button",
+        className: "relative group cursor-zoom-in my-6 w-full flex justify-center rounded-lg",
+        onClick: () => setIsOpen(true),
+        "aria-label": "Zoom image",
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "absolute inset-0 bg-black/0 group-hover:bg-black/5 transition-colors z-10 flex items-center justify-center opacity-0 group-hover:opacity-100 rounded-lg", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react.ZoomIn, { className: "w-8 h-8 text-white drop-shadow-md" }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+            "img",
+            {
+              src: typeof src === "string" ? src : "",
+              alt,
+              width,
+              height,
+              className: "w-full h-auto rounded-lg transition-transform duration-300 group-hover:scale-[1.01]",
+              ...props
+            }
+          )
+        ]
+      }
+    ),
+    isOpen && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+      "div",
+      {
+        className: "fixed inset-0 z-99999 flex items-center justify-center bg-black/90 backdrop-blur-md p-4 md:p-10 cursor-zoom-out",
+        onClick: () => setIsOpen(false),
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+            "button",
+            {
+              className: "absolute top-4 right-4 z-50 p-2 text-white/70 hover:text-white bg-black/20 hover:bg-white/10 rounded-full transition-colors",
+              onClick: (e) => {
+                e.stopPropagation();
+                setIsOpen(false);
+              },
+              children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react.X, { className: "w-6 h-6" })
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+            "div",
+            {
+              className: "relative max-w-7xl w-full h-full flex items-center justify-center",
+              onClick: (e) => e.stopPropagation(),
+              children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                "div",
+                {
+                  className: "relative w-full h-full flex items-center justify-center",
+                  onClick: () => setIsOpen(false),
+                  children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                    "img",
+                    {
+                      src: typeof src === "string" ? src : "",
+                      alt,
+                      width: 1920,
+                      height: 1080,
+                      className: "object-contain max-h-[90vh] w-auto h-auto rounded-md shadow-2xl"
+                    }
+                  )
+                }
+              )
+            }
+          ),
+          alt && alt !== "alt" && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "absolute bottom-6 left-1/2 -translate-x-1/2 bg-black/60 text-white px-4 py-2 rounded-full text-sm font-medium backdrop-blur-md border border-white/10", children: alt })
+        ]
+      }
+    ) })
+  ] });
+}
+function Portal({ children }) {
+  if (typeof window === "undefined") return null;
+  return (0, import_react_dom.createPortal)(children, document.body);
+}
+
+// src/adapters/react-router/index.tsx
+var import_jsx_runtime4 = require("react/jsx-runtime");
+function isExternalHref(href) {
+  return /^(https?:|mailto:|tel:)/i.test(href);
+}
+function ReactRouterLinkMdx({ href, ...props }) {
+  if (!href) return null;
+  if (isExternalHref(href)) {
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      "a",
+      {
+        href,
+        ...props,
+        target: props.target ?? "_blank",
+        rel: props.rel ?? "noopener noreferrer"
+      }
+    );
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_router_dom.Link, { to: href, ...props });
+}
+var RouterLinkRenderer = ({ href, ...props }) => {
+  if (isExternalHref(href)) {
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      "a",
+      {
+        href,
+        ...props,
+        target: props.target ?? "_blank",
+        rel: props.rel ?? "noopener noreferrer"
+      }
+    );
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_router_dom.Link, { to: href, ...props });
+};
+function ReactRouterButtonMdx(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Button, { ...props, LinkComponent: RouterLinkRenderer });
+}
+function ReactRouterCardMdx(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Card, { ...props, LinkComponent: RouterLinkRenderer });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ReactRouterButtonMdx,
+  ReactRouterCardMdx,
+  ReactRouterImageMdx,
+  ReactRouterLinkMdx
+});

package/dist/adapters/react-router/index.d.cts

@@ -0,0 +1,11 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ComponentProps } from 'react';
+import { B as Button, C as Card } from '../../Card-L5O7G4xG.cjs';
+export { I as ReactRouterImageMdx } from '../../Image-DZPezRHi.cjs';
+import 'lucide-react';
+
+declare function ReactRouterLinkMdx({ href, ...props }: ComponentProps<"a">): react_jsx_runtime.JSX.Element | null;
+declare function ReactRouterButtonMdx(props: ComponentProps<typeof Button>): react_jsx_runtime.JSX.Element;
+declare function ReactRouterCardMdx(props: ComponentProps<typeof Card>): react_jsx_runtime.JSX.Element;
+
+export { ReactRouterButtonMdx, ReactRouterCardMdx, ReactRouterLinkMdx };

package/dist/adapters/react-router/index.d.ts

@@ -0,0 +1,11 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ComponentProps } from 'react';
+import { B as Button, C as Card } from '../../Card-L5O7G4xG.js';
+export { I as ReactRouterImageMdx } from '../../Image-DZPezRHi.js';
+import 'lucide-react';
+
+declare function ReactRouterLinkMdx({ href, ...props }: ComponentProps<"a">): react_jsx_runtime.JSX.Element | null;
+declare function ReactRouterButtonMdx(props: ComponentProps<typeof Button>): react_jsx_runtime.JSX.Element;
+declare function ReactRouterCardMdx(props: ComponentProps<typeof Card>): react_jsx_runtime.JSX.Element;
+
+export { ReactRouterButtonMdx, ReactRouterCardMdx, ReactRouterLinkMdx };