A library for processing a stack of images that can flex in both color and style according to the digital product they are embedded in.
You can find a working example of a project using this library here
To install into your project:
- yarn install @stylablez/core
- See the Example for usage guidance.
A Palette is a simple object containing Color definitions to be used within some context. A Color definition contains a color hex value and a class that indicates when it should be used. When a palette class is selected, the color for that class will be used.
Creating a Composite from a list of files is easy. Just create a new LayerTool and call buildStylizableLayers providing a list of image files. An example of how to do this is provided in the demo in this repository.
The only state a consumer of this library should need to manage within components is the Palette object and a list of Layer objects. The Composite JSX element takes each of these as attributes. All style extraction is done within the Layer so developers are free from having to manage any styling related to the layers.