Order of intersection types leads to non-deterministic results

The following:

import React from 'react';

type Props = { children: React.ReactNode; } & { children?: React.ReactNode; }

const Component = ({ children }: Props) => {
  return <div>{children}</div>
}

export default Component;

Gives these results:

{
  "description": "",
  "displayName": "Component",
  "methods": [],
  "props": {
    "children": {
      "required": false,
      "tsType": {
        "name": "ReactReactNode",
        "raw": "React.ReactNode"
      },
      "description": ""
    }
  }
}

As you can see, children are NOT required, however, if I switch the order of the intersection type:

import React from 'react';

type Props = { children?: React.ReactNode; } & { children: React.ReactNode; }

const Component = ({ children }: Props) => {
  return <div>{children}</div>
}

export default Component;

Then the result is different, with children now being required...

{
  "description": "",
  "displayName": "Component",
  "methods": [],
  "props": {
    "children": {
      "required": true,
      "tsType": {
        "name": "ReactReactNode",
        "raw": "React.ReactNode"
      },
      "description": ""
    }
  }
}

Is this expected behaviour?

Bắt đầu bằng cách tái hiện vấn đề với hai ví dụ intersection TypeScript trong báo cáo và so sánh metadata props được tạo ra. Theo dõi cách output của tài liệu xác định liệu children có bắt buộc hay không đối với từng thứ tự intersection. Được xem là hoàn tất khi cả hai thứ tự đều tạo ra cùng một kết quả chính xác về tính bắt buộc.