Components

How components work

Eighteen components, and two rules that explain nearly everything that goes wrong the first time.

They arrive finished

There is no assembling. A browser is the filter bar, the tags and the list in one; a player bar is the whole player. You place it, set a handful of controls, and it draws a working result.

Several do have optional slots — a card design of your own, a custom link component — but they stay hidden in the panel until you have something to connect, so you can ignore them until you want them.

The two rules

1. Soundee Setup goes on every page. It draws the cart, the licence picker, the sign-in dialog and the share and download dialogs — none of which are visible until something opens them. It also publishes your brand: colours, fonts, button radius and height.

Most other components quietly do nothing, or come out unstyled, on a page without it. Rather than placing it by hand everywhere, put it in a layout template.

2. On a detail page, bind CMS JSON. Drag the Raw JSON field from your synced collection onto a component’s CMS JSON control and it knows which track it is looking at. Nothing else on the page has to prepare it first.

Styling

You almost never style a Soundee component directly. Set your colours, fonts, button radius and height once in Soundee Setup and every component follows. A control on an individual component overrides the brand for that one instance, which is the escape hatch rather than the method.

Keeping them current

When Soundee improves a component, an Update badge appears next to it in your project’s component list. Click it and your instances move to the new version, keeping every setting you made. Nothing updates behind your back, and an update you have not taken never blocks a publish.

Start with the components that go on every page