willba-component-library 0.1.82 → 0.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +58 -11
- package/lib/index.d.ts +1 -1
- package/package.json +1 -1
- package/src/components/FilterBar/FilterBar.stories.tsx +0 -1
- package/src/index.ts +1 -0
package/README.md
CHANGED
|
@@ -27,11 +27,14 @@ ReactDOM.render(<App />, document.querySelector('#app'))
|
|
|
27
27
|
or you can add the willba-component-library using scripts:
|
|
28
28
|
|
|
29
29
|
```html
|
|
30
|
-
<div
|
|
30
|
+
<div
|
|
31
|
+
id="will-filter-bar"
|
|
32
|
+
style="max-width: 1200px; display: flex; justify-content: center;"
|
|
33
|
+
></div>
|
|
31
34
|
|
|
32
|
-
<script src="https://unpkg.com/react@18/umd/react.
|
|
33
|
-
<script src="https://unpkg.com/react-dom@18/umd/react-dom.
|
|
34
|
-
<script src="https://cdn.jsdelivr.net/npm/willba-component-library@0/lib/index.umd.js"></script>
|
|
35
|
+
<script src="https://unpkg.com/react@18/umd/react.production.min.js"></script>
|
|
36
|
+
<script src="https://unpkg.com/react-dom@18/umd/react-dom.production.min.js"></script>
|
|
37
|
+
<script src="https://cdn.jsdelivr.net/npm/willba-component-library@0.1.83/lib/index.umd.js"></script>
|
|
35
38
|
|
|
36
39
|
<script>
|
|
37
40
|
const filterBarElement = React.createElement
|
|
@@ -41,7 +44,45 @@ or you can add the willba-component-library using scripts:
|
|
|
41
44
|
|
|
42
45
|
root.render(
|
|
43
46
|
filterBarElement(WillFilterBar, {
|
|
44
|
-
redirectUrl: '
|
|
47
|
+
redirectUrl: 'https://www.google.com',
|
|
48
|
+
language: 'en',
|
|
49
|
+
calendarOffset: {
|
|
50
|
+
rooms: 7,
|
|
51
|
+
events: -1,
|
|
52
|
+
},
|
|
53
|
+
mode: 'dark',
|
|
54
|
+
ageCategories: [
|
|
55
|
+
{
|
|
56
|
+
id: '2',
|
|
57
|
+
name: 'Alle 6 vuotiaat',
|
|
58
|
+
minVal: 0,
|
|
59
|
+
sortOrder: 3,
|
|
60
|
+
},
|
|
61
|
+
{
|
|
62
|
+
id: '3',
|
|
63
|
+
name: '6-16 vuotiaat',
|
|
64
|
+
minVal: 0,
|
|
65
|
+
sortOrder: 2,
|
|
66
|
+
},
|
|
67
|
+
{
|
|
68
|
+
id: '1',
|
|
69
|
+
name: 'Aikuiset',
|
|
70
|
+
minVal: 1,
|
|
71
|
+
sortOrder: 1,
|
|
72
|
+
},
|
|
73
|
+
],
|
|
74
|
+
tabs: [
|
|
75
|
+
{
|
|
76
|
+
path: '/rooms',
|
|
77
|
+
default: true,
|
|
78
|
+
order: 2,
|
|
79
|
+
},
|
|
80
|
+
{
|
|
81
|
+
path: '/events',
|
|
82
|
+
default: false,
|
|
83
|
+
order: 1,
|
|
84
|
+
},
|
|
85
|
+
],
|
|
45
86
|
})
|
|
46
87
|
)
|
|
47
88
|
</script>
|
|
@@ -49,9 +90,15 @@ or you can add the willba-component-library using scripts:
|
|
|
49
90
|
|
|
50
91
|
## Props of FilterBar
|
|
51
92
|
|
|
52
|
-
| Name
|
|
53
|
-
|
|
|
54
|
-
| redirectUrl
|
|
55
|
-
| language
|
|
56
|
-
| ageCategories
|
|
57
|
-
| palette
|
|
93
|
+
| Name | Value | Description |
|
|
94
|
+
| -------------- | ------------- | ---------------------------------------------------------------------------------------------------------------- |
|
|
95
|
+
| redirectUrl | `"string"` | Define the URL where the component should redirect on filtering. |
|
|
96
|
+
| language | `"fi" , "en"` | Specify the language, available languages Finnish and English. |
|
|
97
|
+
| ageCategories | `[{}]` | Specify age categories for guests: [{id: string, name: string, , minVal: number, sortOrder: number}] |
|
|
98
|
+
| palette | `{}` | Override color: palette: {primary: string, secondary: string}. |
|
|
99
|
+
| calendarOffset | `{}` | Calendar disabled date starting from today: {rooms: number, events: number}. |
|
|
100
|
+
| fullWidth | `true` | Filter bar width, dynamic or fixed. |
|
|
101
|
+
| |
|
|
102
|
+
| mode | `"light"` | Filter bar tabs color: light or dark |
|
|
103
|
+
| |
|
|
104
|
+
| tabs | `[{}]` | Filter bar tabs management: [{path: string, default: boolean, order: number, label: { en: string, fi: string}}]. |
|
package/lib/index.d.ts
CHANGED
|
@@ -70,4 +70,4 @@ type FilterBarProps = {
|
|
|
70
70
|
};
|
|
71
71
|
declare function FilterBar({ language, ageCategories, redirectUrl, palette, onSubmit, fullWidth, calendarOffset, mode, tabs, }: FilterBarProps): React.JSX.Element | null;
|
|
72
72
|
|
|
73
|
-
export { Button, FilterBar };
|
|
73
|
+
export { Button, FilterBar, Tab };
|
package/package.json
CHANGED
package/src/index.ts
CHANGED