Simple and tiny preact bindings for fela
Why not use preact-fela official bindings?
First of all official bindings are about 2.5KB while this package is about 300B.
At the same time I think it has a simpler and more straight-forward API.
The API has two parts:
Provider to put fela's renderer and your custom theme on the context
style higher-order component (HOC) to style Preact components.
Wrap your root component in a
Provider to put fela's
renderer on the context.
You can also give it a
theme property to make it available for the components styled with the
const htmlRenderer = Preactrenderconst styleRenderer =const theme =mainColor: 'peachpuff'fontFamily: 'Comic Sans MS'
style is a HOC that is used to add styling to Preact components.
It takes either a styles object or a function that returns a styles object given the current component's
What that means is that if the rules don't need
theme, you don't have to bother creating them as functions.
const Button =<button className=stylesbutton>Hello world</button>button:padding: '10px'color: 'red'Button
const Button =<button className=stylesbutton>Hello world</button>button:padding: '10px'color: thememainColorButton
const Button =<button className=stylesbutton>Hello world</button>button:fontSize: primary ? '15px' : '12px'padding: '10px'color: 'cornsilk'Button