no-namespace

Rule category

Correctness.

What it does

Enforces the absence of a namespace in React elements.

Why is this bad?

Namespaces, such as with svg:circle are not supported in React.

Examples

Failing

import React from "react";
 
function Example() {
  return (
    <svg:circle
      cx="50"
      cy="50"
      r="40"
      stroke="black"
      stroke-width="3"
      fill="red"
    />
  );
}

Passing

import React from "react";
 
function function Example(): React.JSX.ElementExample() {
  return (
    <JSX.IntrinsicElements.circle: React.SVGProps<SVGCircleElement>circle React.SVGAttributes<SVGCircleElement>.cx?: string | number | undefinedcx="50" React.SVGAttributes<SVGCircleElement>.cy?: string | number | undefinedcy="50" React.SVGAttributes<SVGCircleElement>.r?: string | number | undefinedr="40" React.SVGAttributes<SVGCircleElement>.stroke?: string | undefinedstroke="black" stroke-width: stringstroke-width="3" React.SVGAttributes<SVGCircleElement>.fill?: string | undefinedfill="red" />
  );
}

dom/no-missing-iframe-sandbox dom/no-render-return-value