fail to show line number

[jingyuhhh]

here is my code. I'm confused where goes wrong.

import CodeEditor from "@uiw/react-textarea-code-editor";
import rehypePrism from "rehype-prism-plus";

export const Sparql = () => {
  return (
    <CodeEditor
      value={`  SELECT ?x ?name
  {
    ?x  foaf:mbox <mailto:alice@example> .
    ?x  foaf:knows ?a1 .
    ?a1 foaf:knows ?a2 .
    ?a2 foaf:name ?name .
  }`}
      language="sparql"
      data-color-mode="light"
      rehypePlugins={[
        [rehypePrism, { ignoreMissing: true, showLineNumbers: true }],
      ]}
      style={{
        fontFamily:
          'ui-monospace, SFMono-Regular, "SF Mono", Consolas, "Liberation Mono", Menlo, monospace',
      }}
    />
  );
};