Reference for Search-a-licious Web Components#
This page documents web Components provided by Search-a-licious to quickly build your interfaces.
See the tutorial for an introduction
Customization#
Styling#
We added a lot of part
attributes to the components, to allow you to customize the look and feel of the components. See ::part() attribute documentation on MDN
Translations#
We only translated basic messages and most labels can generally be overridden using slots inside web component, where your own translation framework might be use (be it in javascript, or through your template engine or any technique).
If you however needs to override current translations, you might clone this project, change translations in xliff files and regenerate the bundle.
Main components#
Those are the components you will certainly use to build your interface. Of course none are mandatory and you can pick and choose the components you need.
Bare attention to the search-name
attribute
which must correspond to the name
attribute of the search bar.
If you do not specify it, it will be the default one.
You'll need it if you mix multiple search bars in the same page.
searchalicious-bar#
searchalicious-results#
searchalicious-pages#
searchalicious-facets#
searchalicious-button#
searchalicious-count#
Sorting#
searchalicious-sort#
searchalicious-sort-field#
searchalicious-sort-script#
Charts components#
Charts components are based on vega.
searchalicious-distribution-chart#
searchalicious-scatter-chart#
Layout components#
Layout widgets are used to layout the page, they are not mandatory but can be useful. It must not create dependencies with other components.
searchalicious-panel-manager#
searchalicious-layout-page#
Internal components#
Those are components that are not intended to be used directly by the user, but are used internally by the other components.