Skip to content

Commit 8a40deb

Browse files
feat(WebComponents): Updated to v1.0.0-rc.2 (#51)
BREAKING CHANGE **ShellBarItem**: prop `onPress` is renamed to `onClick` BREAKING CHANGE **Dialog**: remove prop `noHeader` BREAKING CHANGE **Popup**: remove prop `noHeader` Please also check the [UI5 Web Components Release Notes](https://github.com/SAP/ui5-webcomponents/releases/tag/v1.0.0-rc.2)
1 parent 704fbdd commit 8a40deb

File tree

22 files changed

+117
-130
lines changed

22 files changed

+117
-130
lines changed

packages/charts/src/components/ChartContainer/withChartContainer.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import { ChartBaseProps } from '../../interfaces/ChartBaseProps';
66
import { mergeConfig } from '../../util/utils';
77
import { Loader } from '../Loader';
88

9-
const styles = () => ({
9+
const styles = {
1010
chart: {
1111
position: 'relative',
1212
paddingTop: '6px',
@@ -21,7 +21,7 @@ const styles = () => ({
2121
height: (props) => `${props.height}px`
2222
}
2323
}
24-
});
24+
};
2525

2626
export const withChartContainer = (Component: ComponentType<any>) => {
2727
const ChartContainer = (props) => {
Lines changed: 40 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,43 +1,50 @@
1-
import { Badge, Label, Table, TableCell, TableColumn, TableRow, Text, ThemeProvider } from '@ui5/webcomponents-react';
1+
import { Badge, Label, Table, TableCell, TableColumn, TableRow, Text } from '@ui5/webcomponents-react';
22
import React from 'react';
33

44
const columns = [
5-
<TableColumn key="name" header={<Label>Prop</Label>} width="150px" />,
6-
<TableColumn key="propType" header={<Label>PropType</Label>} width="150px" />,
7-
<TableColumn key="required" header={<Label>Required</Label>} width="80px" />,
8-
<TableColumn key="defaultValue" header={<Label>Default Value</Label>} width="100px" />,
9-
<TableColumn key="desc" header={<Label>Description</Label>} />
5+
<TableColumn key="name" width="150px">
6+
<Label>Prop</Label>
7+
</TableColumn>,
8+
<TableColumn key="propType" width="150px">
9+
<Label>PropType</Label>
10+
</TableColumn>,
11+
<TableColumn key="required" width="80px">
12+
<Label>Required</Label>
13+
</TableColumn>,
14+
<TableColumn key="defaultValue" width="100px">
15+
<Label>Default Value</Label>
16+
</TableColumn>,
17+
<TableColumn key="desc">
18+
<Label>Description</Label>
19+
</TableColumn>
1020
];
1121

1222
export const TableComponent = (props) => {
1323
const info = props.type.__docgenInfo;
14-
if (!info || !info.props) {
15-
return (
16-
<ThemeProvider>
17-
<Text>Unfortunately, there are no prop types available for this component.</Text>
18-
</ThemeProvider>
19-
);
20-
}
24+
25+
const componentProps = info && info.props;
26+
2127
return (
22-
<ThemeProvider>
23-
<Table
24-
columns={columns}
25-
rows={Object.values(info.props).map((componentInfo: any) => (
26-
<TableRow key={componentInfo.name}>
27-
<TableCell>
28-
<Text>{componentInfo.name}</Text>
29-
</TableCell>
30-
<TableCell>
31-
<Text>{componentInfo.type.name}</Text>
32-
</TableCell>
33-
<TableCell>{componentInfo.required && <Badge colorScheme="8">Yes</Badge>}</TableCell>
34-
<TableCell>{componentInfo.defaultValue && <Text>{componentInfo.defaultValue.value}</Text>}</TableCell>
35-
<TableCell>
36-
<Text>{componentInfo.description}</Text>
37-
</TableCell>
38-
</TableRow>
39-
))}
40-
/>
41-
</ThemeProvider>
28+
<Table
29+
showNoData={componentProps === undefined}
30+
noDataText="Unfortunately, there are no prop types available for this component"
31+
columns={columns}
32+
>
33+
{Object.values(componentProps || {}).map((componentInfo: any) => (
34+
<TableRow key={componentInfo.name}>
35+
<TableCell>
36+
<Text>{componentInfo.name}</Text>
37+
</TableCell>
38+
<TableCell>
39+
<Text>{componentInfo.type.name}</Text>
40+
</TableCell>
41+
<TableCell>{componentInfo.required && <Badge colorScheme="8">Yes</Badge>}</TableCell>
42+
<TableCell>{componentInfo.defaultValue && <Text>{componentInfo.defaultValue.value}</Text>}</TableCell>
43+
<TableCell>
44+
<Text>{componentInfo.description}</Text>
45+
</TableCell>
46+
</TableRow>
47+
))}
48+
</Table>
4249
);
4350
};

packages/main/__karma_snapshots__/ActionSheet.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,14 +8,14 @@
88
<ThemeProvider theme={{...}}>
99
<WithStyles(ActionSheet) openBy={{...}} placement="Bottom">
1010
<ActionSheet openBy={{...}} placement="Bottom" classes={{...}} theme={{...}}>
11-
<Popover noHeader={true} openBy={{...}} placementType="Bottom" style={[undefined]} slot={[undefined]} initialFocus={{...}} headerText="" horizontalAlign="Center" verticalAlign="Center">
11+
<Popover openBy={{...}} placementType="Bottom" style={[undefined]} slot={[undefined]} initialFocus={{...}} headerText="" horizontalAlign="Center" verticalAlign="Center">
1212
<div style={{...}} onClick={[Function]}>
1313
<Button design="Default">
1414
<ui5-button design="Default" class="" />
1515
</Button>
1616
</div>
17-
<WithWebComponent(Popover) noHeader={true} placementType="Bottom" style={[undefined]} slot={[undefined]} initialFocus={{...}} headerText="" horizontalAlign="Center" verticalAlign="Center">
18-
<ui5-popover no-header={true} placement-type="Bottom" style={[undefined]} slot={[undefined]} initial-focus={{...}} header-text="" horizontal-align="Center" vertical-align="Center" class="">
17+
<WithWebComponent(Popover) placementType="Bottom" style={[undefined]} slot={[undefined]} initialFocus={{...}} headerText="" horizontalAlign="Center" verticalAlign="Center">
18+
<ui5-popover placement-type="Bottom" style={[undefined]} slot={[undefined]} initial-focus={{...}} header-text="" horizontal-align="Center" vertical-align="Center" class="">
1919
<ul className="ActionSheet-actionSheet---" />
2020
</ui5-popover>
2121
</WithWebComponent(Popover)>

0 commit comments

Comments
 (0)