radiant-docs-validator 0.1.5 → 0.1.6

package/dist/index.d.ts

@@ -196,4 +196,17 @@ declare function resolveDocsHref(href: string): DocsHrefResolution;
 declare const resolveDocsPageHref: typeof resolveDocsHref;
 declare function validateMdxContent(): Promise<void>;
 
-export { type AssistantButtonConfig, type AssistantButtonSize, type AssistantConfig, type AssistantIcon, type AssistantNavbarButtonConfig, BASE_COLOR_OPTIONS, type BaseColorByMode, type BaseColorOption, type CardButtonTheme, type CardCoverTheme, type CardTheme, type CodeSyntaxThemeConfig, type CodeTheme, DEFAULT_THEME_COLOR_DARK, DEFAULT_THEME_COLOR_LIGHT, type DocsConfig, type DocsHrefResolution, type DocsTheme, type DocsValidatorOptions, type Footer, type FooterLink, type HiddenPageRoute, type Logo, type LogoVariant, type NavGroup, type NavMenu, type NavMenuItem, type NavOpenApi, type NavOpenApiPage, type NavOpenApiPageRef, type NavPage, type NavTag, type NavbarItem, type NavigationItem, PUBLISHABLE_STATIC_ASSET_EXTENSIONS, type SocialPlatform, type TagTheme, type ThemeColorByMode, configureDocsValidator, getConfig, isPublishableStaticAssetPath, loadOpenApiSpec, resolveDocsHref, resolveDocsPageHref, validateMdxContent };
+type MdxJsxElementNode = {
+    name?: string | null;
+    attributes?: unknown[];
+    children?: unknown[];
+};
+type RadiantComponentValidationOptions = {
+    sourceFile: string;
+    validateLinkHref?: (href: string) => void;
+    validateAssetHref?: (href: string) => void;
+};
+declare function validateRadiantComponentProps(componentName: string, props: Record<string, unknown>, options: RadiantComponentValidationOptions): void;
+declare function validateRadiantComponentNode(node: MdxJsxElementNode, options: RadiantComponentValidationOptions): void;
+
+export { type AssistantButtonConfig, type AssistantButtonSize, type AssistantConfig, type AssistantIcon, type AssistantNavbarButtonConfig, BASE_COLOR_OPTIONS, type BaseColorByMode, type BaseColorOption, type CardButtonTheme, type CardCoverTheme, type CardTheme, type CodeSyntaxThemeConfig, type CodeTheme, DEFAULT_THEME_COLOR_DARK, DEFAULT_THEME_COLOR_LIGHT, type DocsConfig, type DocsHrefResolution, type DocsTheme, type DocsValidatorOptions, type Footer, type FooterLink, type HiddenPageRoute, type Logo, type LogoVariant, type NavGroup, type NavMenu, type NavMenuItem, type NavOpenApi, type NavOpenApiPage, type NavOpenApiPageRef, type NavPage, type NavTag, type NavbarItem, type NavigationItem, PUBLISHABLE_STATIC_ASSET_EXTENSIONS, type RadiantComponentValidationOptions, type SocialPlatform, type TagTheme, type ThemeColorByMode, configureDocsValidator, getConfig, isPublishableStaticAssetPath, loadOpenApiSpec, resolveDocsHref, resolveDocsPageHref, validateMdxContent, validateRadiantComponentNode, validateRadiantComponentProps };

package/dist/index.js

@@ -16,6 +16,626 @@ import pkg from "@stoplight/spectral-core";
 import { oas } from "@stoplight/spectral-rulesets";
 import { compile } from "@mdx-js/mdx";
 import yaml from "yaml";
+
+// src/component-validation.ts
+import { compileSync } from "@mdx-js/mdx";
+function componentError(componentName, message, sourceFile) {
+  throw new Error(`<${componentName}>: ${message} (in ${sourceFile})`);
+}
+function readStaticEstreeValue(node, componentName, propName, sourceFile) {
+  if (!node) {
+    componentError(
+      componentName,
+      `Invalid prop "${propName}": expected a static literal value`,
+      sourceFile
+    );
+  }
+  if (node.type === "Literal") {
+    return node.value;
+  }
+  if (node.type === "TemplateLiteral") {
+    const expressions = node.expressions;
+    const quasis = node.quasis;
+    if (Array.isArray(expressions) && expressions.length === 0 && Array.isArray(quasis) && quasis.length === 1) {
+      const value = quasis[0];
+      if (typeof value.value?.cooked === "string") {
+        return value.value.cooked;
+      }
+    }
+  }
+  if (node.type === "UnaryExpression") {
+    const operator = node.operator;
+    const argument = readStaticEstreeValue(
+      node.argument,
+      componentName,
+      propName,
+      sourceFile
+    );
+    if ((operator === "+" || operator === "-") && typeof argument === "number") {
+      return operator === "-" ? -argument : argument;
+    }
+  }
+  if (node.type === "ArrayExpression") {
+    const elements = node.elements;
+    if (Array.isArray(elements)) {
+      return elements.map((element) => {
+        if (!element || element.type === "SpreadElement") {
+          componentError(
+            componentName,
+            `Invalid prop "${propName}": arrays cannot contain empty items or spreads`,
+            sourceFile
+          );
+        }
+        return readStaticEstreeValue(
+          element,
+          componentName,
+          propName,
+          sourceFile
+        );
+      });
+    }
+  }
+  if (node.type === "ObjectExpression") {
+    const properties = node.properties;
+    if (Array.isArray(properties)) {
+      const value = {};
+      for (const propertyValue of properties) {
+        const property = propertyValue;
+        if (property.type !== "Property" || property.kind !== "init" || property.computed === true || property.method === true || property.shorthand === true) {
+          componentError(
+            componentName,
+            `Invalid prop "${propName}": objects cannot contain spreads, methods, computed keys, or shorthand values`,
+            sourceFile
+          );
+        }
+        const keyNode = property.key;
+        const key = keyNode.type === "Identifier" ? keyNode.name : keyNode.type === "Literal" ? keyNode.value : void 0;
+        if (typeof key !== "string") {
+          componentError(
+            componentName,
+            `Invalid prop "${propName}": object keys must be static strings`,
+            sourceFile
+          );
+        }
+        value[key] = readStaticEstreeValue(
+          property.value,
+          componentName,
+          propName,
+          sourceFile
+        );
+      }
+      return value;
+    }
+  }
+  componentError(
+    componentName,
+    `Invalid prop "${propName}": expected a static literal value`,
+    sourceFile
+  );
+}
+function readStaticExpression(value, componentName, propName, sourceFile) {
+  const program = value?.data?.estree;
+  const body = program?.body;
+  if (!Array.isArray(body) || body.length !== 1) {
+    componentError(
+      componentName,
+      `Invalid prop "${propName}": expected a static literal value`,
+      sourceFile
+    );
+  }
+  const statement = body[0];
+  if (statement.type !== "ExpressionStatement") {
+    componentError(
+      componentName,
+      `Invalid prop "${propName}": expected a static literal value`,
+      sourceFile
+    );
+  }
+  return readStaticEstreeValue(
+    statement.expression,
+    componentName,
+    propName,
+    sourceFile
+  );
+}
+function readStaticProps(node, componentName, sourceFile) {
+  const props = {};
+  for (const rawAttribute of node.attributes ?? []) {
+    const attribute = rawAttribute;
+    if (attribute.type !== "mdxJsxAttribute" || typeof attribute.name !== "string") {
+      componentError(
+        componentName,
+        "Component prop spreads are not supported. Use explicit static props.",
+        sourceFile
+      );
+    }
+    if (attribute.value === null) {
+      props[attribute.name] = true;
+    } else if (typeof attribute.value === "string") {
+      props[attribute.name] = attribute.value;
+    } else {
+      props[attribute.name] = readStaticExpression(
+        attribute.value,
+        componentName,
+        attribute.name,
+        sourceFile
+      );
+    }
+  }
+  return props;
+}
+function assertNoUnknownProps(componentName, props, allowedProps, sourceFile) {
+  const allowed = new Set(allowedProps);
+  const unknownProps = Object.keys(props).filter((key) => !allowed.has(key));
+  if (unknownProps.length === 0) return;
+  const propLabel = unknownProps.length === 1 ? "prop" : "props";
+  const unknownLabel = unknownProps.map((name) => `"${name}"`).join(", ");
+  const allowedLabel = allowedProps.map((name) => `"${name}"`).join(", ");
+  componentError(
+    componentName,
+    `Unsupported ${propLabel}: ${unknownLabel}. Allowed props: ${allowedLabel}`,
+    sourceFile
+  );
+}
+function assertRequired(componentName, propName, value, sourceFile) {
+  if (value === void 0 || value === null || value === "") {
+    componentError(
+      componentName,
+      `Missing required prop "${propName}"`,
+      sourceFile
+    );
+  }
+}
+function getValueType(value) {
+  if (value === null) return "null";
+  if (value === void 0) return "undefined";
+  if (Array.isArray(value)) return "array";
+  return typeof value;
+}
+function assertType(componentName, propName, value, expectedTypes, sourceFile) {
+  if (value === void 0) return;
+  const actualType = getValueType(value);
+  if (!expectedTypes.includes(actualType)) {
+    componentError(
+      componentName,
+      `Invalid prop "${propName}": expected ${expectedTypes.join(" or ")}, got ${actualType}`,
+      sourceFile
+    );
+  }
+}
+function assertEnum(componentName, propName, value, allowedValues, sourceFile) {
+  if (value === void 0) return;
+  if (typeof value !== "string" || !allowedValues.includes(value)) {
+    componentError(
+      componentName,
+      `Invalid prop "${propName}"="${String(value)}". Expected one of: ${allowedValues.join(", ")}`,
+      sourceFile
+    );
+  }
+}
+function assertPlainObject(componentName, propName, value, sourceFile) {
+  if (typeof value !== "object" || value === null || Array.isArray(value)) {
+    componentError(
+      componentName,
+      `Invalid prop "${propName}": expected object`,
+      sourceFile
+    );
+  }
+}
+function assertHexColor(componentName, propName, value, sourceFile) {
+  if (typeof value !== "string") {
+    componentError(
+      componentName,
+      `Invalid prop "${propName}": expected string`,
+      sourceFile
+    );
+  }
+  const normalized = value.trim().startsWith("#") ? value.trim() : `#${value.trim()}`;
+  if (!/^#(?:[A-Fa-f0-9]{3}|[A-Fa-f0-9]{4}|[A-Fa-f0-9]{6}|[A-Fa-f0-9]{8})$/.test(normalized)) {
+    componentError(
+      componentName,
+      `Invalid prop "${propName}": expected a hex color like "#3b82f6"`,
+      sourceFile
+    );
+  }
+}
+function validateCard(props, options) {
+  const componentName = "Card";
+  assertNoUnknownProps(
+    componentName,
+    props,
+    ["title", "href", "icon", "cover", "button"],
+    options.sourceFile
+  );
+  assertRequired(componentName, "title", props.title, options.sourceFile);
+  assertType(componentName, "title", props.title, ["string"], options.sourceFile);
+  assertType(componentName, "href", props.href, ["string"], options.sourceFile);
+  assertType(componentName, "icon", props.icon, ["string"], options.sourceFile);
+  if (typeof props.href === "string") {
+    options.validateLinkHref?.(props.href);
+  }
+  if (props.cover !== void 0) {
+    assertPlainObject(componentName, "cover", props.cover, options.sourceFile);
+    assertNoUnknownProps(
+      "Card.cover",
+      props.cover,
+      ["icon", "text", "glass", "colors", "patternSeed", "colorSeed"],
+      options.sourceFile
+    );
+    assertType("Card.cover", "icon", props.cover.icon, ["string"], options.sourceFile);
+    assertType("Card.cover", "text", props.cover.text, ["string"], options.sourceFile);
+    assertType("Card.cover", "glass", props.cover.glass, ["boolean"], options.sourceFile);
+    assertType("Card.cover", "colors", props.cover.colors, ["array"], options.sourceFile);
+    assertType("Card.cover", "patternSeed", props.cover.patternSeed, ["string"], options.sourceFile);
+    assertType("Card.cover", "colorSeed", props.cover.colorSeed, ["string"], options.sourceFile);
+    if (Array.isArray(props.cover.colors)) {
+      if (props.cover.colors.length < 1 || props.cover.colors.length > 4) {
+        componentError(
+          componentName,
+          'Invalid prop "cover.colors": expected 1 to 4 colors',
+          options.sourceFile
+        );
+      }
+      props.cover.colors.forEach((color, index) => {
+        assertHexColor(componentName, `cover.colors.${index}`, color, options.sourceFile);
+      });
+    }
+    for (const seed of ["patternSeed", "colorSeed"]) {
+      const value = props.cover[seed];
+      if (typeof value === "string" && value.trim().length === 0) {
+        componentError(
+          componentName,
+          `Invalid prop "cover.${seed}": expected a non-empty string`,
+          options.sourceFile
+        );
+      }
+    }
+  }
+  if (props.button !== void 0) {
+    assertPlainObject(componentName, "button", props.button, options.sourceFile);
+    assertNoUnknownProps(
+      "Card.button",
+      props.button,
+      ["text", "href", "color"],
+      options.sourceFile
+    );
+    assertRequired("Card.button", "text", props.button.text, options.sourceFile);
+    assertRequired("Card.button", "href", props.button.href, options.sourceFile);
+    assertType("Card.button", "text", props.button.text, ["string"], options.sourceFile);
+    assertType("Card.button", "href", props.button.href, ["string"], options.sourceFile);
+    for (const propName of ["text", "href"]) {
+      const value = props.button[propName];
+      if (typeof value === "string" && value.trim().length === 0) {
+        componentError(
+          componentName,
+          `Invalid prop "button.${propName}": expected a non-empty string`,
+          options.sourceFile
+        );
+      }
+    }
+    if (typeof props.button.href === "string") {
+      options.validateLinkHref?.(props.button.href);
+    }
+    const color = props.button.color;
+    if (color !== void 0) {
+      if (typeof color === "string") {
+        assertHexColor(componentName, "button.color", color, options.sourceFile);
+      } else {
+        assertPlainObject(componentName, "button.color", color, options.sourceFile);
+        assertNoUnknownProps(
+          "Card.button.color",
+          color,
+          ["light", "dark"],
+          options.sourceFile
+        );
+        if (color.light === void 0 && color.dark === void 0) {
+          componentError(
+            componentName,
+            'Invalid prop "button.color": expected at least one of "light" or "dark"',
+            options.sourceFile
+          );
+        }
+        if (color.light !== void 0) {
+          assertHexColor(componentName, "button.color.light", color.light, options.sourceFile);
+        }
+        if (color.dark !== void 0) {
+          assertHexColor(componentName, "button.color.dark", color.dark, options.sourceFile);
+        }
+      }
+    }
+  }
+}
+function validateImage(props, options) {
+  assertNoUnknownProps(
+    "Image",
+    props,
+    ["src", "alt", "title", "width", "zoom"],
+    options.sourceFile
+  );
+  assertRequired("Image", "src", props.src, options.sourceFile);
+  assertType("Image", "src", props.src, ["string", "object"], options.sourceFile);
+  assertType("Image", "alt", props.alt, ["string"], options.sourceFile);
+  assertType("Image", "title", props.title, ["string"], options.sourceFile);
+  assertType("Image", "width", props.width, ["number", "string"], options.sourceFile);
+  assertType("Image", "zoom", props.zoom, ["boolean"], options.sourceFile);
+  if (typeof props.src === "string") {
+    options.validateAssetHref?.(props.src);
+  } else if (typeof props.src === "object") {
+    assertPlainObject("Image", "src", props.src, options.sourceFile);
+    const light = props.src.light;
+    const dark = props.src.dark;
+    if (typeof light !== "string" || light.trim().length === 0) {
+      componentError(
+        "Image",
+        'Invalid prop "src": object form requires a non-empty "light" string',
+        options.sourceFile
+      );
+    }
+    if (dark !== void 0 && typeof dark !== "string") {
+      componentError(
+        "Image",
+        'Invalid prop "src.dark": expected string',
+        options.sourceFile
+      );
+    }
+    options.validateAssetHref?.(light);
+    if (typeof dark === "string" && dark.trim().length > 0) {
+      options.validateAssetHref?.(dark);
+    }
+  }
+}
+function validateRadiantComponentProps(componentName, props, options) {
+  if (![
+    "Step",
+    "Tab",
+    "Accordion",
+    "Callout",
+    "Card",
+    "Image",
+    "Columns",
+    "Column",
+    "CodeGroup",
+    "ComponentPreview"
+  ].includes(componentName)) {
+    return;
+  }
+  if (componentName === "Step") {
+    assertRequired("Step", "title", props.title, options.sourceFile);
+    assertType("Step", "title", props.title, ["string"], options.sourceFile);
+    return;
+  }
+  if (componentName === "Tab") {
+    assertRequired("Tab", "label", props.label, options.sourceFile);
+    assertType("Tab", "label", props.label, ["string"], options.sourceFile);
+    assertType("Tab", "icon", props.icon, ["string"], options.sourceFile);
+    return;
+  }
+  if (componentName === "Accordion") {
+    assertRequired("Accordion", "title", props.title, options.sourceFile);
+    assertType("Accordion", "title", props.title, ["string"], options.sourceFile);
+    assertType("Accordion", "icon", props.icon, ["string"], options.sourceFile);
+    assertType("Accordion", "defaultOpen", props.defaultOpen, ["boolean"], options.sourceFile);
+    assertEnum(
+      "Accordion",
+      "titleSize",
+      props.titleSize,
+      ["xs", "sm", "md", "lg", "xl", "2xl"],
+      options.sourceFile
+    );
+    return;
+  }
+  if (componentName === "Callout") {
+    assertEnum(
+      "Callout",
+      "type",
+      props.type,
+      ["warning", "info", "tip", "danger", "success"],
+      options.sourceFile
+    );
+    assertType("Callout", "title", props.title, ["string", "boolean"], options.sourceFile);
+    assertType("Callout", "icon", props.icon, ["string", "boolean"], options.sourceFile);
+    assertType("Callout", "accent", props.accent, ["boolean"], options.sourceFile);
+    assertType("Callout", "color", props.color, ["string"], options.sourceFile);
+    if (props.title === true) {
+      componentError("Callout", 'Invalid prop "title": expected string or false, got true', options.sourceFile);
+    }
+    if (props.icon === true) {
+      componentError("Callout", 'Invalid prop "icon": expected string or false, got true', options.sourceFile);
+    }
+    return;
+  }
+  if (componentName === "Card") {
+    validateCard(props, options);
+    return;
+  }
+  if (componentName === "Image") {
+    validateImage(props, options);
+    return;
+  }
+  if (componentName === "Columns") {
+    assertNoUnknownProps("Columns", props, ["columns"], options.sourceFile);
+    assertType("Columns", "columns", props.columns, ["number", "string"], options.sourceFile);
+    if (props.columns !== void 0 && Number(
+      typeof props.columns === "string" ? props.columns.trim() : props.columns
+    ) !== 2 && Number(
+      typeof props.columns === "string" ? props.columns.trim() : props.columns
+    ) !== 3) {
+      componentError("Columns", 'Invalid prop "columns": expected 2 or 3', options.sourceFile);
+    }
+    return;
+  }
+  if (componentName === "Column") {
+    assertNoUnknownProps("Column", props, [], options.sourceFile);
+    return;
+  }
+  if (componentName === "CodeGroup") {
+    assertNoUnknownProps("CodeGroup", props, [], options.sourceFile);
+    return;
+  }
+  assertNoUnknownProps(
+    "ComponentPreview",
+    props,
+    ["showAllCode"],
+    options.sourceFile
+  );
+  assertType(
+    "ComponentPreview",
+    "showAllCode",
+    props.showAllCode,
+    ["boolean"],
+    options.sourceFile
+  );
+}
+function validateRadiantComponentNode(node, options) {
+  if (typeof node.name !== "string") return;
+  const props = readStaticProps(node, node.name, options.sourceFile);
+  validateRadiantComponentProps(node.name, props, options);
+  validateRadiantComponentChildStructure(node, props, options.sourceFile);
+}
+function isIgnorableWhitespaceNode(node) {
+  if (!node || typeof node !== "object") return false;
+  const typedNode = node;
+  return typedNode.type === "text" && typeof typedNode.value === "string" ? typedNode.value.trim().length === 0 : false;
+}
+function isNamedMdxJsxElement(node, name) {
+  if (!node || typeof node !== "object") return false;
+  const typedNode = node;
+  return (typedNode.type === "mdxJsxFlowElement" || typedNode.type === "mdxJsxTextElement") && typedNode.name === name;
+}
+function validateRadiantComponentChildStructure(node, props, sourceFile) {
+  const children = (node.children ?? []).filter(
+    (child) => !isIgnorableWhitespaceNode(child)
+  );
+  if (node.name === "Columns") {
+    const expectedColumns = props.columns === void 0 ? 2 : Number(props.columns);
+    const hasOnlyColumns = children.every(
+      (child) => isNamedMdxJsxElement(child, "Column")
+    );
+    if (!hasOnlyColumns) {
+      componentError(
+        "Columns",
+        "Only direct <Column> children are allowed. Wrap each column's content in <Column>.",
+        sourceFile
+      );
+    }
+    if (children.length !== expectedColumns) {
+      componentError(
+        "Columns",
+        `Expected exactly ${expectedColumns} <Column> children for columns={${expectedColumns}}, but found ${children.length}. Render another <Columns> block for a new row.`,
+        sourceFile
+      );
+    }
+  }
+  if (node.name === "Tabs") {
+    const hasOnlyTabs = children.every(
+      (child) => isNamedMdxJsxElement(child, "Tab")
+    );
+    if (!hasOnlyTabs) {
+      componentError(
+        "Tabs",
+        "Only direct <Tab> children are allowed. Wrap each tab's content in <Tab>.",
+        sourceFile
+      );
+    }
+    if (children.length < 2) {
+      componentError(
+        "Tabs",
+        `Must contain at least two direct <Tab> children, but found ${children.length}.`,
+        sourceFile
+      );
+    }
+  }
+  if (node.name === "Steps") {
+    const hasOnlySteps = children.every(
+      (child) => isNamedMdxJsxElement(child, "Step")
+    );
+    if (!hasOnlySteps) {
+      componentError(
+        "Steps",
+        "Only direct <Step> children are allowed. Wrap each procedure step in <Step>.",
+        sourceFile
+      );
+    }
+    if (children.length === 0) {
+      componentError(
+        "Steps",
+        "Must contain at least one direct <Step> child.",
+        sourceFile
+      );
+    }
+  }
+  if (node.name === "AccordionGroup") {
+    const hasOnlyAccordions = children.every(
+      (child) => isNamedMdxJsxElement(child, "Accordion")
+    );
+    if (!hasOnlyAccordions) {
+      componentError(
+        "AccordionGroup",
+        "Only direct <Accordion> children are allowed. Wrap each section in <Accordion>.",
+        sourceFile
+      );
+    }
+    if (children.length === 0) {
+      componentError(
+        "AccordionGroup",
+        "Must contain at least one direct <Accordion> child.",
+        sourceFile
+      );
+    }
+  }
+  if (node.name === "CodeGroup") {
+    const hasOnlyCodeBlocks = children.every(
+      (child) => child?.type === "code"
+    );
+    if (!hasOnlyCodeBlocks) {
+      componentError(
+        "CodeGroup",
+        "Only direct fenced code blocks are allowed.",
+        sourceFile
+      );
+    }
+    if (children.length < 2) {
+      componentError(
+        "CodeGroup",
+        `Must contain at least two direct fenced code blocks, but found ${children.length}.`,
+        sourceFile
+      );
+    }
+  }
+  if (node.name === "ComponentPreview") {
+    const hasExactlyOneCodeBlock = children.length === 1 && children[0]?.type === "code";
+    if (!hasExactlyOneCodeBlock) {
+      componentError(
+        "ComponentPreview",
+        "Must contain exactly one direct fenced code block.",
+        sourceFile
+      );
+    }
+    const codeNode = children[0];
+    const language = typeof codeNode.lang === "string" && codeNode.lang.trim().length > 0 ? codeNode.lang.trim().toLowerCase() : "plaintext";
+    if (!["jsx", "tsx", "mdx"].includes(language)) {
+      componentError(
+        "ComponentPreview",
+        `Fenced code block must use jsx, tsx, or mdx language (received "${language}")`,
+        sourceFile
+      );
+    }
+    try {
+      compileSync(typeof codeNode.value === "string" ? codeNode.value : "", {
+        jsx: true
+      });
+    } catch (error) {
+      const reason = error instanceof Error && error.message.trim().length > 0 ? ` -> ${error.message}` : "";
+      componentError(
+        "ComponentPreview",
+        `Failed to parse fenced code block as MDX content${reason}`,
+        sourceFile
+      );
+    }
+  }
+}
+
+// src/validator.ts
 var { Spectral } = pkg;
 var DOCS_DIR = "";
 var CONFIG_PATH = "";
@@ -2244,6 +2864,11 @@ function createInternalLinkValidationPlugin(args) {
         if (hrefAttribute.name !== "href" && hrefAttribute.name !== "src") {
           continue;
         }
+        if (hrefAttribute.name === "href" && typeof hrefAttribute.value !== "string") {
+          throw new Error(
+            `Invalid JSX href in ${args.sourceFile}. Direct JSX href props must use quoted strings, such as href="/guides/quickstart", not JSX expressions.`
+          );
+        }
         if (typeof hrefAttribute.value !== "string") continue;
         validateDocsRootAbsoluteHref({
           href: hrefAttribute.value,
@@ -2255,6 +2880,34 @@ function createInternalLinkValidationPlugin(args) {
     });
   };
 }
+function createComponentValidationPlugin(args) {
+  return () => (tree) => {
+    visitMdxTree(tree, (node) => {
+      if (node.type !== "mdxJsxFlowElement" && node.type !== "mdxJsxTextElement") {
+        return;
+      }
+      validateRadiantComponentNode(node, {
+        sourceFile: args.sourceFile,
+        validateLinkHref: (href) => {
+          validateDocsRootAbsoluteHref({
+            href,
+            sourceFile: args.sourceFile,
+            linkIndex: args.linkIndex,
+            expectedTarget: "link"
+          });
+        },
+        validateAssetHref: (href) => {
+          validateDocsRootAbsoluteHref({
+            href,
+            sourceFile: args.sourceFile,
+            linkIndex: args.linkIndex,
+            expectedTarget: "asset"
+          });
+        }
+      });
+    });
+  };
+}
 function getMdxFiles(dir) {
   let results = [];
   const list = fs.readdirSync(dir);
@@ -2297,6 +2950,10 @@ async function validateMdxContent() {
           createInternalLinkValidationPlugin({
             sourceFile: relativePath,
             linkIndex
+          }),
+          createComponentValidationPlugin({
+            sourceFile: relativePath,
+            linkIndex
           })
         ]
       });
@@ -2325,5 +2982,7 @@ export {
   loadOpenApiSpec,
   resolveDocsHref,
   resolveDocsPageHref,
-  validateMdxContent
+  validateMdxContent,
+  validateRadiantComponentNode,
+  validateRadiantComponentProps
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "radiant-docs-validator",
-  "version": "0.1.5",
+  "version": "0.1.6",
   "description": "Shared validation for Radiant documentation repositories",
   "type": "module",
   "scripts": {