React(JS) how to get file name of the file imported current module?

Question

I'm writing a react library (react-xarrows.tsx), and when the user provides wrong properties to my Component an error is thrown (that I wrote), but it shows the lines I wrote in 'react-arrows.tsx'.

On error the user will see:

/src/Xarrow.tsx:184:12
    if (!("current" in props.start))
      throw Error(
        `'start' property is not of type reference.
        maybe you set 'start' to other object and not to React reference?.\n`
      );

I want to point out to the user exactly where he was mistaken - and I can do it by providing 'filename' to Error - Error([message[, fileName[, lineNumber]]]) - the file name of the file that imported that current module, the user's file that used my lib - let's call that file '/src/Example5.tsx'. (on 'name' I of course mean relative path)

For now, I need to figure out how to get this file name (and later hopefully the line numbers).

(I did try to get it from 'moudle.parents' object as answers to other similar questions, but don't have any parent property to module object. This was the closest to helping me.)

there must be a way to do it because react itself point's out to the user where he was mistaken. I left an error example for now here at Example5 (just click Example5). You are free to play with it, and if you come up with a solution please share it.

simplified Example5:

import React, { useState, useRef} from "react";
import Xarrows from "../src/Xarrow";

const canvasStyle: React.CSSProperties = { /*style things */};
const boxStyle = { /*style things */};

const Box: React.FC = props => {
  return (
    <div
      ref={props.box.ref}
      style={boxStyle}
    >
      {props.box.id}
    </div>
  );
};

const Example5: React.FC = () => {
  const [box, setBox] = useState<box>({ id: "box1", ref: useRef(null) });
  const [box2, setBox2] = useState<box>({ id: "box2", ref: useRef(null) });

  return (
    <React.Fragment>
      <div style={canvasStyle} id="canvas" />
      <div>
        <Box box={box} />
        <Box box={box2} />
      </div>
      {lines.map((line, i) => (
        <Xarrows key={i} start={box} end={box2.ref} />   // I want to the error to point here on 'start={box}' because 'box' is not a referance
      ))}
    </React.Fragment>
  );
};

export default Example5;