Introduction#

Motor components are complete React components for your Qlik Sense mashups. You can use them alongside our hooks to build custom dashboards (mashups) even faster.

All the components are styled using a default theme, which you can customise using our theme package. Some styling options are also available to change via props.

Getting Started#

Get started by importing the components and theme packages into your application.

jsx
1
npm i @motor-js/components @motor-js/theme styled-components

Once installed, just import the component into your project. In the below example, we are using the Filter component.

jsx
1
import { useList } from '@motor-js/engine';
2
import { Filter } from '@motor-js/components;
3

4
const FilterExample = () => {
5

6
const dimension = ['Burger'];
7

8
const { listData, motorListProps} = useList({ dimension })
9

10
  return (
11
    <Filter
12
      data={listData}
13
      motorListProps={motorListProps} 
14
    /> 
15
  )
16

17
}
18

19
export default FilterExample