@blogmcp/mdx-render-vue 0.1.0

package/dist/render/callout/CalloutDefault.vue.js

@@ -0,0 +1,86 @@
+import { defineComponent, computed, createElementBlock, openBlock, normalizeClass, unref, createElementVNode, createCommentVNode, renderSlot } from "vue";
+import { calloutStyles } from "@blogmcp/mdx-schema/styles";
+const _hoisted_1 = { class: "flex items-start gap-3" };
+const _hoisted_2 = { class: "flex-shrink-0 mt-0.5" };
+const _hoisted_3 = { class: "flex-1 text-sm leading-relaxed" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "CalloutDefault",
+  props: {
+    type: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const effectiveType = computed(() => props.type || "info");
+    const colorClasses = computed(() => calloutStyles.default.type[effectiveType.value]);
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass([unref(calloutStyles).default.base, colorClasses.value.bg, colorClasses.value.border, colorClasses.value.text]),
+        "data-mdx-component": "Callout"
+      }, [
+        createElementVNode("div", _hoisted_1, [
+          createElementVNode("div", _hoisted_2, [
+            effectiveType.value === "info" ? (openBlock(), createElementBlock("svg", {
+              key: 0,
+              class: normalizeClass(["w-5 h-5", colorClasses.value.iconColor]),
+              fill: "none",
+              stroke: "currentColor",
+              viewBox: "0 0 24 24"
+            }, [..._cache[0] || (_cache[0] = [
+              createElementVNode("path", {
+                "stroke-linecap": "round",
+                "stroke-linejoin": "round",
+                "stroke-width": "2",
+                d: "M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
+              }, null, -1)
+            ])], 2)) : effectiveType.value === "warning" ? (openBlock(), createElementBlock("svg", {
+              key: 1,
+              class: normalizeClass(["w-5 h-5", colorClasses.value.iconColor]),
+              fill: "none",
+              stroke: "currentColor",
+              viewBox: "0 0 24 24"
+            }, [..._cache[1] || (_cache[1] = [
+              createElementVNode("path", {
+                "stroke-linecap": "round",
+                "stroke-linejoin": "round",
+                "stroke-width": "2",
+                d: "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"
+              }, null, -1)
+            ])], 2)) : effectiveType.value === "tip" ? (openBlock(), createElementBlock("svg", {
+              key: 2,
+              class: normalizeClass(["w-5 h-5", colorClasses.value.iconColor]),
+              fill: "none",
+              stroke: "currentColor",
+              viewBox: "0 0 24 24"
+            }, [..._cache[2] || (_cache[2] = [
+              createElementVNode("path", {
+                "stroke-linecap": "round",
+                "stroke-linejoin": "round",
+                "stroke-width": "2",
+                d: "M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z"
+              }, null, -1)
+            ])], 2)) : effectiveType.value === "danger" ? (openBlock(), createElementBlock("svg", {
+              key: 3,
+              class: normalizeClass(["w-5 h-5", colorClasses.value.iconColor]),
+              fill: "none",
+              stroke: "currentColor",
+              viewBox: "0 0 24 24"
+            }, [..._cache[3] || (_cache[3] = [
+              createElementVNode("path", {
+                "stroke-linecap": "round",
+                "stroke-linejoin": "round",
+                "stroke-width": "2",
+                d: "M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
+              }, null, -1)
+            ])], 2)) : createCommentVNode("", true)
+          ]),
+          createElementVNode("div", _hoisted_3, [
+            renderSlot(_ctx.$slots, "default")
+          ])
+        ])
+      ], 2);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/render/callout/CalloutDefault.vue2.js

@@ -0,0 +1,4 @@
+import _sfc_main from "./CalloutDefault.vue.js";
+export {
+  _sfc_main as default
+};

package/dist/render/callout/CalloutMinimal.vue.d.ts

@@ -0,0 +1,13 @@
+import type { CalloutProps } from '@blogmcp/mdx-schema';
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<CalloutProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<CalloutProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/render/callout/CalloutMinimal.vue.js

@@ -0,0 +1,27 @@
+import { defineComponent, computed, createElementBlock, openBlock, normalizeClass, unref, createElementVNode, renderSlot } from "vue";
+import { calloutStyles } from "@blogmcp/mdx-schema/styles";
+const _hoisted_1 = { class: "text-sm leading-relaxed" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "CalloutMinimal",
+  props: {
+    type: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const effectiveType = computed(() => props.type || "info");
+    const colorClasses = computed(() => calloutStyles.minimal.type[effectiveType.value]);
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass([unref(calloutStyles).minimal.base, colorClasses.value.bg, colorClasses.value.border, colorClasses.value.text]),
+        "data-mdx-component": "Callout"
+      }, [
+        createElementVNode("div", _hoisted_1, [
+          renderSlot(_ctx.$slots, "default")
+        ])
+      ], 2);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/render/callout/CalloutMinimal.vue2.js

@@ -0,0 +1,4 @@
+import _sfc_main from "./CalloutMinimal.vue.js";
+export {
+  _sfc_main as default
+};

package/dist/render/callout/index.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Callout Render Component Variants
+ */
+export { default as CalloutDefault } from './CalloutDefault.vue';
+export { default as CalloutMinimal } from './CalloutMinimal.vue';
+export { default } from './CalloutDefault.vue';

package/dist/render/callout/index.js

@@ -0,0 +1,7 @@
+import { default as default2, default as default3 } from "./CalloutDefault.vue.js";
+import { default as default4 } from "./CalloutMinimal.vue.js";
+export {
+  default2 as CalloutDefault,
+  default4 as CalloutMinimal,
+  default3 as default
+};

package/dist/render/card/Card.vue.d.ts

@@ -0,0 +1,15 @@
+interface Props {
+    title?: string;
+}
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/render/card/Card.vue.js

@@ -0,0 +1,4 @@
+import _sfc_main from "./Card.vue2.js";
+export {
+  _sfc_main as default
+};

package/dist/render/card/Card.vue2.js

@@ -0,0 +1,29 @@
+import { defineComponent, createElementBlock, openBlock, createCommentVNode, createElementVNode, toDisplayString, renderSlot } from "vue";
+const _hoisted_1 = {
+  class: "mdx-card rounded-lg border border-gray-200 bg-white p-5 shadow-sm",
+  "data-mdx-component": "Card"
+};
+const _hoisted_2 = {
+  key: 0,
+  class: "mb-3 text-lg font-semibold text-gray-900"
+};
+const _hoisted_3 = { class: "text-gray-700" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "Card",
+  props: {
+    title: {}
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("section", _hoisted_1, [
+        __props.title ? (openBlock(), createElementBlock("h3", _hoisted_2, toDisplayString(__props.title), 1)) : createCommentVNode("", true),
+        createElementVNode("div", _hoisted_3, [
+          renderSlot(_ctx.$slots, "default")
+        ])
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/render/card/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Card } from './Card.vue';
+export { default } from './Card.vue';

package/dist/render/codeblock/CodeBlockDefault.vue.d.ts

@@ -0,0 +1,12 @@
+import type { CodeBlockProps } from '@blogmcp/mdx-schema';
+type __VLS_Slots = {
+    default(): unknown;
+};
+declare const __VLS_component: import("vue").DefineComponent<CodeBlockProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<CodeBlockProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/render/codeblock/CodeBlockDefault.vue.js

@@ -0,0 +1,7 @@
+import _sfc_main from "./CodeBlockDefault.vue2.js";
+/* empty css                      */
+import _export_sfc from "../../_virtual/_plugin-vue_export-helper.js";
+const CodeBlockDefault = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-17b5008f"]]);
+export {
+  CodeBlockDefault as default
+};

package/dist/render/codeblock/CodeBlockDefault.vue2.js

@@ -0,0 +1,92 @@
+import { defineComponent, ref, createElementBlock, openBlock, createElementVNode, createCommentVNode, toDisplayString, unref, normalizeClass, createTextVNode, renderSlot } from "vue";
+import { useCodeBlock } from "../../composables/useCodeBlock.js";
+const _hoisted_1 = {
+  class: "code-block my-6 rounded-lg overflow-hidden border border-gray-200 bg-gray-50",
+  "data-mdx-component": "CodeBlock"
+};
+const _hoisted_2 = { class: "flex items-center justify-between px-4 py-2 bg-gray-100 border-b border-gray-200" };
+const _hoisted_3 = { class: "flex items-center gap-2" };
+const _hoisted_4 = { class: "text-xs text-gray-600 font-medium" };
+const _hoisted_5 = {
+  key: 0,
+  class: "text-xs text-gray-500"
+};
+const _hoisted_6 = {
+  key: 0,
+  class: "w-3.5 h-3.5",
+  fill: "none",
+  stroke: "currentColor",
+  viewBox: "0 0 24 24"
+};
+const _hoisted_7 = {
+  key: 1,
+  class: "w-3.5 h-3.5",
+  fill: "none",
+  stroke: "currentColor",
+  viewBox: "0 0 24 24"
+};
+const _hoisted_8 = { class: "code-block-content p-4 overflow-x-auto" };
+const _hoisted_9 = { class: "m-0" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "CodeBlockDefault",
+  props: {
+    language: {},
+    title: {},
+    showLineNumbers: { type: Boolean }
+  },
+  setup(__props) {
+    const props = __props;
+    const { copied, languageLabel, languageClass, copyCode } = useCodeBlock(props);
+    const codeRef = ref(null);
+    async function handleCopy() {
+      if (codeRef.value) {
+        await copyCode(codeRef.value.textContent || "");
+      }
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createElementVNode("div", _hoisted_2, [
+          createElementVNode("div", _hoisted_3, [
+            createElementVNode("span", _hoisted_4, toDisplayString(unref(languageLabel)), 1),
+            __props.title ? (openBlock(), createElementBlock("span", _hoisted_5, toDisplayString(__props.title), 1)) : createCommentVNode("", true)
+          ]),
+          createElementVNode("button", {
+            class: normalizeClass(["flex items-center gap-1 px-2 py-1 text-xs rounded transition-colors", unref(copied) ? "bg-green-500 text-white" : "hover:bg-gray-200 text-gray-500 hover:text-gray-700"]),
+            onClick: handleCopy
+          }, [
+            !unref(copied) ? (openBlock(), createElementBlock("svg", _hoisted_6, [..._cache[0] || (_cache[0] = [
+              createElementVNode("path", {
+                "stroke-linecap": "round",
+                "stroke-linejoin": "round",
+                "stroke-width": "2",
+                d: "M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"
+              }, null, -1)
+            ])])) : (openBlock(), createElementBlock("svg", _hoisted_7, [..._cache[1] || (_cache[1] = [
+              createElementVNode("path", {
+                "stroke-linecap": "round",
+                "stroke-linejoin": "round",
+                "stroke-width": "2",
+                d: "M5 13l4 4L19 7"
+              }, null, -1)
+            ])])),
+            createTextVNode(" " + toDisplayString(unref(copied) ? "Copied!" : "Copy"), 1)
+          ], 2)
+        ]),
+        createElementVNode("div", _hoisted_8, [
+          createElementVNode("pre", _hoisted_9, [
+            createElementVNode("code", {
+              ref_key: "codeRef",
+              ref: codeRef,
+              class: normalizeClass(unref(languageClass))
+            }, [
+              renderSlot(_ctx.$slots, "default", {}, void 0, true)
+            ], 2)
+          ])
+        ])
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/render/codeblock/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * CodeBlock Render Component Variants
+ */
+export { default as CodeBlockDefault } from './CodeBlockDefault.vue';
+export { default } from './CodeBlockDefault.vue';

package/dist/render/codeblock/index.js

@@ -0,0 +1,5 @@
+import { default as default2, default as default3 } from "./CodeBlockDefault.vue.js";
+export {
+  default2 as CodeBlockDefault,
+  default3 as default
+};

package/dist/render/gallery/GalleryGrid.vue.d.ts

@@ -0,0 +1,3 @@
+import type { GalleryProps } from '@blogmcp/mdx-schema';
+declare const _default: import("vue").DefineComponent<GalleryProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<GalleryProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/render/gallery/GalleryGrid.vue.js

@@ -0,0 +1,125 @@
+import { defineComponent, ref, computed, watch, onUnmounted, createElementBlock, openBlock, Fragment, createCommentVNode, createVNode, unref, normalizeClass, renderList, createElementVNode, normalizeStyle, createBlock, createStaticVNode, resolveDynamicComponent, toDisplayString } from "vue";
+import { useGallery } from "../../composables/useGallery.js";
+import { useOptimizedImg } from "../../composables/useMedia.js";
+import GalleryLightbox from "./GalleryLightbox.vue.js";
+const _hoisted_1 = ["onClick"];
+const _hoisted_2 = ["src"];
+const _hoisted_3 = {
+  key: 0,
+  class: "gallery-description text-center text-sm text-gray-500 mt-2"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "GalleryGrid",
+  props: {
+    images: {},
+    columns: {},
+    gap: {},
+    aspectRatio: {},
+    fit: {},
+    position: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const { gridColsClass, gapClass, tileLayout, getImageSrc, getImageAlt, getImageDescription, getImageCaption, isVideo, hasImages } = useGallery(props);
+    const ImgTag = useOptimizedImg();
+    const lightboxOpen = ref(false);
+    const lightboxIndex = ref(0);
+    const imageOnlyIndices = computed(() => {
+      const indices = [];
+      for (let i = 0; i < props.images.length; i++) {
+        if (!isVideo(i)) indices.push(i);
+      }
+      return indices;
+    });
+    const imageOnlyCount = computed(() => imageOnlyIndices.value.length);
+    function openLightbox(fullIndex) {
+      if (isVideo(fullIndex)) return;
+      const lightboxIdx = imageOnlyIndices.value.indexOf(fullIndex);
+      if (lightboxIdx === -1) return;
+      lightboxIndex.value = lightboxIdx;
+      lightboxOpen.value = true;
+    }
+    function closeLightbox() {
+      lightboxOpen.value = false;
+    }
+    function navigateLightbox(newIndex) {
+      lightboxIndex.value = newIndex;
+    }
+    function lightboxGetSrc(idx) {
+      return getImageSrc(imageOnlyIndices.value[idx]);
+    }
+    function lightboxGetAlt(idx) {
+      return getImageAlt(imageOnlyIndices.value[idx]);
+    }
+    function lightboxGetDescription(idx) {
+      return getImageDescription(imageOnlyIndices.value[idx]);
+    }
+    watch(lightboxOpen, (open) => {
+      if (open) {
+        document.body.style.overflow = "hidden";
+      } else {
+        document.body.style.overflow = "";
+      }
+    });
+    onUnmounted(() => {
+      document.body.style.overflow = "";
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock(Fragment, null, [
+        unref(hasImages) ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          class: normalizeClass(["gallery not-prose my-6", [unref(gridColsClass), unref(gapClass)]]),
+          style: { "display": "grid" },
+          "data-mdx-component": "Gallery"
+        }, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(__props.images, (_, index) => {
+            return openBlock(), createElementBlock("div", {
+              key: index,
+              class: "gallery-item"
+            }, [
+              createElementVNode("div", {
+                class: normalizeClass(["gallery-media group relative overflow-hidden rounded", unref(isVideo)(index) ? "bg-gray-900" : "bg-gray-100 cursor-pointer"]),
+                style: normalizeStyle(unref(tileLayout).tileStyle),
+                onClick: ($event) => openLightbox(index)
+              }, [
+                unref(isVideo)(index) ? (openBlock(), createElementBlock("video", {
+                  key: 0,
+                  src: `${unref(getImageSrc)(index)}#t=0.1`,
+                  controls: "",
+                  preload: "metadata",
+                  playsinline: "",
+                  class: normalizeClass(unref(tileLayout).mediaSizeClass),
+                  style: normalizeStyle(unref(tileLayout).mediaStyle)
+                }, null, 14, _hoisted_2)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+                  (openBlock(), createBlock(resolveDynamicComponent(unref(ImgTag)), {
+                    src: unref(getImageSrc)(index),
+                    alt: unref(getImageAlt)(index),
+                    sizes: "100vw sm:50vw md:33vw lg:299px",
+                    class: normalizeClass([unref(tileLayout).mediaSizeClass, "transition-transform duration-200 group-hover:scale-[1.03]"]),
+                    style: normalizeStyle(unref(tileLayout).mediaStyle),
+                    loading: "lazy"
+                  }, null, 8, ["src", "alt", "class", "style"])),
+                  _cache[0] || (_cache[0] = createStaticVNode('<div class="absolute inset-0 bg-black/0 group-hover:bg-black/10 transition-colors duration-200 pointer-events-none"></div><svg class="gallery-expand-icon absolute top-2 right-2 text-white opacity-50 [@media(hover:hover)]:opacity-0 [@media(hover:hover)]:group-hover:opacity-80 transition-opacity duration-200 drop-shadow-md pointer-events-none" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="15 3 21 3 21 9"></polyline><polyline points="9 21 3 21 3 15"></polyline><line x1="21" y1="3" x2="14" y2="10"></line><line x1="3" y1="21" x2="10" y2="14"></line></svg>', 2))
+                ], 64))
+              ], 14, _hoisted_1),
+              unref(getImageCaption)(index) ? (openBlock(), createElementBlock("p", _hoisted_3, toDisplayString(unref(getImageCaption)(index)), 1)) : createCommentVNode("", true)
+            ]);
+          }), 128))
+        ], 2)) : createCommentVNode("", true),
+        createVNode(GalleryLightbox, {
+          "is-open": lightboxOpen.value,
+          "current-index": lightboxIndex.value,
+          "image-count": imageOnlyCount.value,
+          "get-image-src": lightboxGetSrc,
+          "get-image-alt": lightboxGetAlt,
+          "get-image-description": lightboxGetDescription,
+          onClose: closeLightbox,
+          onNavigate: navigateLightbox
+        }, null, 8, ["is-open", "current-index", "image-count"])
+      ], 64);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/render/gallery/GalleryGrid.vue2.js

@@ -0,0 +1,4 @@
+import _sfc_main from "./GalleryGrid.vue.js";
+export {
+  _sfc_main as default
+};

package/dist/render/gallery/GalleryLightbox.vue.d.ts

@@ -0,0 +1,16 @@
+type __VLS_Props = {
+    isOpen: boolean;
+    currentIndex: number;
+    imageCount: number;
+    getImageSrc: (index: number) => string;
+    getImageAlt: (index: number) => string;
+    getImageDescription: (index: number) => string | undefined;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    close: () => any;
+    navigate: (index: number) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onClose?: (() => any) | undefined;
+    onNavigate?: ((index: number) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/render/gallery/GalleryLightbox.vue.js

@@ -0,0 +1,7 @@
+import _sfc_main from "./GalleryLightbox.vue2.js";
+/* empty css                     */
+import _export_sfc from "../../_virtual/_plugin-vue_export-helper.js";
+const GalleryLightbox = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-f28ad12c"]]);
+export {
+  GalleryLightbox as default
+};