Function FuncDocTable

docs/components/DocTable.tsx:31–99

(props: { func: FunctionSymbolDocumentation })

);

async function FuncDocTable(props: { func: FunctionSymbolDocumentation }) {
  const { func } = props;

  const scriptKey = useId();
  const params = func.jsdocTags
    .filter((tag) => tag.name === 'param')
    .map((tag) => tag.text)
    .map((text) => ({
      name: text[0].text,
      description: text
        .slice(2)
        .map((t) => t.text)
        .join(' '),
    }));

  return (
    <>
      <Heading as="h3">
        Function <code>{func.name}</code>
      </Heading>
      <p>{func.description}</p>

      <h4>Signature</h4>
      <DynamicCodeBlock lang="ts" code={func.signature} options={{}} />

      {/*<h4>Description</h4>*/}

      <h4>Parameters</h4>
      <table className="whitespace-nowrap text-sm text-fd-muted-foreground">
        <thead>
          <tr>
            <th className="w-[20%]">Name</th>
            <th className="w-[30%]">Type</th>
            <th className="w-[40%]">Description</th>
            <th className="w-1/4">Default</th>
          </tr>
        </thead>
        <tbody>
          {params.map(({ name, description }, i) => (
            <tr key={name}>
              <td>
                <div className={field()}>
                  <code className={cn(code({ color: 'primary' }))}>{name}</code>
                </div>
              </td>
              <td>
                <div className={field()}>
                  {func.parameterTypes[i]}
                  {/*<PrerenderScript scriptKey={scriptKey} code={func.parameterTypes[i]}/>*/}
                  {/*{codeToHtml(func.parameterTypes[i], { lang: 'ts', theme: 'default' })}*/}
                </div>
              </td>
              <td>
                <div className={field()}>{description}</div>
              </td>
              <td>
                {/*{value.default ? (
                <code className={code()}>{value.default}</code>