Is there a way to access children props?

import { render, Dynamic } from "solid-js/web";
import { children, type ParentProps, For, createEffect } from "solid-js";

function App() {
  return (
    <Editor>
      <Line>First line</Line>
      <Line onClick={() => console.log("hey!")}>Second line</Line>
    </Editor>
  );
}

function Editor(props: ParentProps) {
  const lines = children(() => props.children);

  return (
    <ol>
      <For each={lines.toArray()}>
        {(child, index) => <Dynamic component={Line} number={index() + 1} />}
      </For>
    </ol>
  );
}

function Line(props: ParentProps<{ number?: number; onClick?: () => void }>) {
  return (
    <div onClick={() => props.onClick}>
      {props.number} - {props.children}
    </div>
  );
}

render(() => <App />, document.getElementById("app")!);

import { render, Dynamic } from "solid-js/web";
import { children, type ParentProps, For, createEffect } from "solid-js";

function App() {
  return (
    <Editor>
      <Line>First line</Line>
      <Line onClick={() => console.log("hey!")}>Second line</Line>
    </Editor>
  );
}

function Editor(props: ParentProps) {
  const lines = children(() => props.children);

  return (
    <ol>
      <For each={lines.toArray()}>
        {(child, index) => <Dynamic component={Line} number={index() + 1} />}
      </For>
    </ol>
  );
}

function Line(props: ParentProps<{ number?: number; onClick?: () => void }>) {
  return (
    <div onClick={() => props.onClick}>
      {props.number} - {props.children}
    </div>
  );
}

render(() => <App />, document.getElementById("app")!);