@holochain-syn/elements

Collection of custom elements to easily build syn applications.

This package is using the modular pattern described in https://holochain-open-dev.github.io.

These elements depend on having a syn store and a profiles store defined.

Installing

Install the necessary dependencies:

npm install @holochain-open-dev/profiles @holochain-syn/elements

Usage

First, you need to have instantiated a SynStore from @holochain-syn/store and a ProfilesStore from @holochain-open-dev/profiles.

Defining the Context Providers

// Define the <profiles-context> element
import '@holochain-open-dev/profiles/profiles-context';

// Define the <syn-context> element
import { SynContext } from '@holochain-syn/elements';
customElements.define('syn-context', SynContext);

Now define the and the element and add it to your html wrapping the whole section of your page in which you are going to be placing the elements from @holochain-syn/elements:

<profiles-context id="profiles-context"> 
  <syn-context>
    <syn-sessions> </syn-sessions>
  </syn-context>
</profiles-context>

Connect the Store to the Context Providers

Go to this page, select the framework you are using, and follow its example in order to:

• Connect the ProfilesStore to the with id="profiles-context".
• Connect the SynStore to the .