Functions defined as namespaces with multiple declarations not resolved correctly

[michaldudak]

Search terms

prop-types, namespace, react

Expected Behavior

Function (React component in this case) parameter types should be documented when the function is also a namespace with multiple definitions.

Actual Behavior

I have a React component defined as a plain function with its props defined in a namespace:

// This works

export function MyComponent(props: MyComponent.Props) {
  const { children } = props;

  return (
    <div>{children}</div>
  );
}

export namespace MyComponent {
  export interface Props {
    children?: React.ReactNode;
  }
}

This is processed as expected. However, as soon as I add prop-types declaration to the function, Typedoc throws a warning: [warning] MyComponent.Props, defined in ./src/index.tsx, is referenced by MyComponent.props but not included in the documentation.

// This doesn't

import PropTypes from 'prop-types';

export function MyComponent(props: MyComponent.Props) {
  const { children } = props;

  return (
    <div>{children}</div>
  );
}

export namespace MyComponent {
  export interface Props {
    children?: React.ReactNode;
  }
}

MyComponent.propTypes = {
  children: PropTypes.node,
};

I suspect it may be caused by something failing to merge namespace definitions, as the resulting .d.ts looks like this:

import PropTypes from 'prop-types';
export declare function MyComponent(props: MyComponent.Props): import("react/jsx-runtime").JSX.Element;
export declare namespace MyComponent {
    var propTypes: {
        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
    };
}
export declare namespace MyComponent {
    interface Props {
        children?: React.ReactNode;
    }
}

This actually also fails if another namespace (non-type-only) is declared with the same name (so it's not specific to prop-types):

export function MyComponent(props: MyComponent.Props) {
  const { children } = props;

  return (
    <div>{children}</div>
  );
}

export namespace MyComponent {
  export interface Props {
    children?: React.ReactNode;
  }
}

export namespace MyComponent {
  export var extraData: string;
}

Steps to reproduce the bug

TypeStrong/typedoc-repros#50

Environment

• Typedoc version: 0.27.9
• TypeScript version: 5.7.3
• Node.js version: 22.13.1
• OS: Windows 11

[Gerrit0]

Declaration merging with namespaces is bad enough... mixing namespaces and expando properties hurts me.

Workaround:

export function MyComponent(props: MyComponent.Props) {
    return;
}

export namespace MyComponent {
    export interface Props {
        children?: {};
    }
    export const propTypes = { children: {} };
}