Unexpected “export default” compiled code
<p>The following code is not compiled into <code>export default</code> as I expected. I need to rename <code>onClick</code> to something else, or assign the function to a variable and export the variable. Can anyone give some hint about this behavior? Thanks</p>

<pre class="lang-js prettyprint-override"><code>export default ({onClick}) =&gt; (
  &lt;span 
    onClick={
      e =&gt; {
        e.preventDefault();
        onClick()}
    }&gt;123&lt;/span&gt;
)
</code></pre>

<p>The compiled result (using <a href="https://babeljs.io/repl/" rel="nofollow">https://babeljs.io/repl/</a> ):</p>

<pre class="lang-js prettyprint-override"><code>"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});

(function (_ref) {
  var _onClick = _ref.onClick;
  return React.createElement(
    "span",
    {
      onClick: function onClick(e) {
        e.preventDefault();
        _onClick();
      } },
    "123"
  );
});
</code></pre>

<p>while I am expecting:</p>

<pre class="lang-js prettyprint-override"><code>exports.default = function (_ref) {
  var _onClick = _ref.onClick;
  return React.createElement(
    "span",
    {
      onClick: function onClick(e) {
        e.preventDefault();
        _onClick();
      } },
    "123"
  );
};
</code></pre>