title: Is it possible to pass a Svelte store as a property on a component?
body: <p>I’ve got a simple <a href="https://svelte.dev/repl/668bf0f0e8e341be9ce81c9d731a112c?version=3.16.4" rel="nofollow noreferrer">REPL example</a> for a simple list-detail editor. It’s made up of three components:</p>
  
  <ol>
  <li><code>Annotation</code> is the detail</li>
  <li><code>Annotations</code> loops through the data and creates <code>Annotation</code> instances</li>
  <li><code>App</code> is the top-level that creates the <code>Annotations</code></li>
  </ol>
  
  <p>I’ve figured out how to wire up a custom Svelte store to manage the <code>Array</code> of instance data for the <code>Annotations</code>. I can use this by importing the store directly into the <code>Annotations</code> component and calling it without any props from the top-level <code>App</code> component. However, I’d like to be able to pass the store in as a property on the <code>Annotations</code> component from the <code>App</code> parent, i.e. <code>&lt;Annotations items={store}/&gt;</code>, not <code>&lt;Annotations/&gt;</code>. </p>
  
  <p>Is this possible? I would think that injecting the store from a parent component would be more flexible/testable than importing it from the component itself. Have I done too much dependency injection with Spring in Java and I’m thinking about the Svelte model incorrectly?</p>