Skip to content

Commit 17e22ff

Browse files
docs: add migration guide for 0.10.0 to 0.11.0 (#718)
1 parent f30d2fc commit 17e22ff

File tree

1 file changed

+50
-1
lines changed

1 file changed

+50
-1
lines changed

docs/2-MigrationGuide.stories.mdx

Lines changed: 50 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Meta, Story, Canvas } from '@storybook/addon-docs/blocks';
1+
import { Meta } from '@storybook/addon-docs/blocks';
22

33
<Meta title="Migration Guide" />
44

@@ -14,9 +14,58 @@ or the [changelog](https://github.com/SAP/ui5-webcomponents-react/blob/master/CH
1414

1515
## Table of Contents
1616

17+
- [0.10.x to 0.11.0](#migrating-from-010x-to-0110)
1718
- [0.9.x to 0.10.0](#migrating-from-09x-to-0100)
1819
- [0.8.x to 0.9.0](#migrating-from-08x-to-090)
1920

21+
## Migrating from 0.10.x to 0.11.0
22+
23+
<br />
24+
25+
### Deleted Components
26+
27+
The `FilterItem` component (which was deprecated in 0.10.0) is now deleted. Please use the `FilterGroupItem` component instead. <br />
28+
In addition to that, the `FilterBar` is now only accepting `FilterGroupItems` as children.
29+
30+
If you have the following `FilterItem` in your codebase
31+
32+
```jsx
33+
<FilterItem
34+
filterItems={[
35+
{ text: 'Text 1', key: '1' },
36+
{ text: 'Text 2', key: '2' }
37+
]}
38+
label="My Filter Item"
39+
key="filter_item"
40+
type={FilterType.Select}
41+
loading
42+
/>
43+
```
44+
45+
this will become
46+
47+
```jsx
48+
<FilterGroupItem label="My Filter Item" loading>
49+
<Select>
50+
<Option data-key="1">Text 1</Option>
51+
<Option data-key="2">Text 2</Option>
52+
</Select>
53+
</FilterGroupItem>
54+
```
55+
56+
The same pattern applies for other FilterTypes like `Default` or `MultiSelect`.
57+
58+
### Components with changed API
59+
60+
The `Token` component is now officially a public component, and its API has changed.
61+
The text content of a `Token` was previously defined via `children`, now you have to use `text` instead.
62+
63+
Example:
64+
`<Token>My Token</Token>` will become `<Token text="My Token" />`
65+
66+
Furthermore, the `onDelete` event is removed as the Token shouldn’t be used as a standalone component.
67+
Most probably, you will use the `Token` as child of `MultiInput` - there you can listen to the `onTokenDelete` event.
68+
2069
## Migrating from 0.9.x to 0.10.0
2170

2271
<br />

0 commit comments

Comments
 (0)