Order of intersection types leads to non-deterministic results

[leepowelldev]

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?