@orama/searchbox-legacy
v1.0.0-beta.13Orama Searchbox
This webcomponent follows the open-wc recommendation.
Installation
npm i @orama/searchbox
Usage
<script type="module">
import '@orama/searchbox/orama-searchbox-component.js';
</script>
<orama-searchbox-component
colorScheme='light'
apiEndpointConfig='https://cloud.orama.foo/searchbox/{your-searchbox-name}/'
apiKeyConfig='xxx'
>
some placeholder
</orama-searchbox-component>
Properties/Attributes
Property | Type | Description |
---|---|---|
colorScheme |
String |
It can be one among light , dark , auto . Choose auto if you want the color scheme to depend to the color system preferences |
apiEndpointConfig |
String |
This is the endpoint that you can use to fetch the configuration object for your searchbox component |
apiKeyConfig |
String |
This is the api key that will be used to authenticate your request to the `apiEndpointConfig`` |
showFullscreenOnMobile |
String |
This will set the mobile version to fullscreen mode |
Events
Name | Description |
---|---|
orama-wc-searchbox:see-all |
Triggered when clicking the See all link |
orama-wc-searchbox:see-item |
Triggered when clicking each search result item |
Linting and formatting
To scan the project for linting and formatting errors, run
npm run lint
To automatically fix linting and formatting errors, run
npm run format
Tooling configs
For most of the tools, the configuration is in the package.json
to reduce the amount of files in your project.
If you customize the configuration a lot, you can consider moving them to individual files.
Local Demo with web-dev-server
npm start
To run a local development server that serves the basic demo located in demo/index.html