title: Creating a Const of Two Values
body: <p>I'm implementing Stripe in my project and in the <a href="https://stripe.com/docs/stripe-js/react" rel="nofollow noreferrer">official docs</a>, one of the snippets of code advised to include in the component is:</p>
  <pre><code>const options = {
      clientSecret,
      appearance
  };
  </code></pre>
  <p>I'm not too familiar with such declarations. It almost looks like a dictionary but it doesn't consist of a key value pair. I've heard of a concept of tuple but looking at how those are declared, this doesn't seem to match.</p>
  <p>Nevertheless, I used that code in my implementation and it worked... until I decoupled this code into a child component. Now I need to pass the <code>clientSecret</code> value as a prop.</p>
  <p>Hence, I run:</p>
  <pre><code>export default function myComponent(props) {
      const apearance = ...
  
      const options = {
          props.clientSecret,
          appearance
      };
  
      return(
          &lt;Elements options={options} ...&gt;
          &lt;/Elements&gt;
      )
  }
  </code></pre>
  <p>However, now I get an error at time of compilation on <code>props.clientSecret</code> (specifically the dot) where the error message says:</p>
  <pre><code>Unexpected token, expected &quot;,&quot;
  </code></pre>
  <p>Why am I unable to create the <code>options</code> variable from props value, whereas it's possible if not invoking props? Is there a way around it?</p>