Skip to content

Commit bdaba56

Browse files
Lukas742Lukas742
committed
Merge branch 'master' into feat/analytical-table-horizontal-virtualization
# Conflicts: # yarn.lock
2 parents af5388a + f047068 commit bdaba56

File tree

161 files changed

+3908
-2079
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

161 files changed

+3908
-2079
lines changed

‎.github/workflows/release-rc.yml

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,14 +27,17 @@ jobs:
2727
2828
- name: publish
2929
run: |
30-
npm config set //registry.npmjs.org/:_authToken=${{ secrets.NPM_TOKEN }}
30+
npm config set //registry.npmjs.org/:_authToken=${NODE_AUTH_TOKEN}
31+
3132
git config user.email ${{ secrets.BOT_GIT_EMAIL }}
3233
git config user.name ${{ secrets.BOT_GIT_USERNAME }}
34+
3335
${GITHUB_WORKSPACE}/node_modules/.bin/lerna publish prerelease \
3436
--conventional-prerelease \
3537
--create-release github \
3638
--dist-tag next \
3739
--pre-dist-tag next
3840
env:
3941
GH_TOKEN: ${{ secrets.ACCESS_TOKEN }}
42+
NODE_AUTH_TOKEN: ${{ secrets.NPM_AUTH_TOKEN }}
4043

‎.github/workflows/release-snapshot.yml

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -24,12 +24,12 @@ jobs:
2424
- name: Install, test and build
2525
run: |
2626
yarn install
27-
yarn test
2827
yarn build
2928
3029
- name: publish
3130
run: |
32-
npm config set //registry.npmjs.org/:_authToken=${{ secrets.NPM_TOKEN }}
31+
npm config set //registry.npmjs.org/:_authToken=${NODE_AUTH_TOKEN}
32+
3333
git config user.email ${{ secrets.BOT_GIT_EMAIL }}
3434
git config user.name ${{ secrets.BOT_GIT_USERNAME }}
3535
@@ -38,4 +38,6 @@ jobs:
3838
${GITHUB_WORKSPACE}/node_modules/.bin/lerna publish "0.0.0-${git_hash}" \
3939
--no-push \
4040
--no-git-tag-version \
41-
--dist-tag dev \
41+
--dist-tag dev
42+
env:
43+
NODE_AUTH_TOKEN: ${{ secrets.NPM_AUTH_TOKEN }}

‎.github/workflows/release.yml

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -32,12 +32,14 @@ jobs:
3232
3333
- name: publish
3434
run: |
35-
npm config set //registry.npmjs.org/:_authToken=${{ secrets.NPM_TOKEN }}
35+
npm config set //registry.npmjs.org/:_authToken=${NODE_AUTH_TOKEN}
36+
3637
git config user.email ${{ secrets.BOT_GIT_EMAIL }}
3738
git config user.name ${{ secrets.BOT_GIT_USERNAME }}
39+
3840
${GITHUB_WORKSPACE}/node_modules/.bin/lerna publish ${{ github.event.inputs.release_type }} \
3941
--conventional-graduate \
4042
--create-release github
4143
env:
4244
GH_TOKEN: ${{ secrets.ACCESS_TOKEN }}
43-
45+
NODE_AUTH_TOKEN: ${{ secrets.NPM_AUTH_TOKEN }}

‎.reuse/dep5

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,3 +7,7 @@ Files:
77
*
88
Copyright: 2019-2020 SAP SE or an SAP affiliate company and UI5 Web Components for React contributors
99
License: Apache-2.0
10+
11+
Files: /packages/charts/src/components/PieChart/PieChart.tsx
12+
Copyright: 2016-2020 Recharts Group
13+
License: MIT

‎CHANGELOG.md

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,34 @@
33
All notable changes to this project will be documented in this file.
44
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
55

6+
## [0.10.8](https://github.com/SAP/ui5-webcomponents-react/compare/v0.10.7...v0.10.8) (2020-09-02)
7+
8+
9+
### Bug Fixes
10+
11+
* **MessageBox:** allow any react node to be passed as children ([#670](https://github.com/SAP/ui5-webcomponents-react/issues/670)) ([b2fae12](https://github.com/SAP/ui5-webcomponents-react/commit/b2fae12ce5c9443c70934b5cc09b0ca17372dea2))
12+
* **PieChart/DonutChart:** re-release active segment feature ([0447b22](https://github.com/SAP/ui5-webcomponents-react/commit/0447b22a63e642d632b0d80521a4ee6a31213a4b))
13+
14+
15+
16+
17+
18+
## [0.10.7](https://github.com/SAP/ui5-webcomponents-react/compare/v0.10.6...v0.10.7) (2020-08-28)
19+
20+
21+
### Bug Fixes
22+
23+
* **PieChart / DonutChart:** fix hide data label logic ([#668](https://github.com/SAP/ui5-webcomponents-react/issues/668)) ([d8dc5ef](https://github.com/SAP/ui5-webcomponents-react/commit/d8dc5ef1faa96fcc24014790fb199999a3a9266d))
24+
25+
26+
### Features
27+
28+
* **PieChart / DonutChart:** add option to mark chart segments as active ([#667](https://github.com/SAP/ui5-webcomponents-react/issues/667)) ([743d6d8](https://github.com/SAP/ui5-webcomponents-react/commit/743d6d8fcc79a58f0dd09f37e0f77030f96cb2f9))
29+
30+
31+
32+
33+
634
## [0.10.6](https://github.com/SAP/ui5-webcomponents-react/compare/v0.10.5...v0.10.6) (2020-08-24)
735

836

‎config/jest.config.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,6 @@ module.exports = {
2626
transformIgnorePatterns: ['node_modules/(?!(@ui5|lit-html))'],
2727
moduleNameMapper: {
2828
'^@shared/(.*)$': '<rootDir>/shared/$1',
29-
'^@tests/(.*)$': '<rootDir>/shared/tests/$1',
3029
'^@ui5/webcomponents-react/dist/(.*)$': '<rootDir>/packages/main/dist/$1',
3130
'^@ui5/webcomponents-react/(.*)$': '<rootDir>/packages/main/src/$1',
3231
'^@ui5/webcomponents-react-base/third-party/(.*)$': '<rootDir>/packages/base/third-party/$1',

‎lerna.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"packages": [
33
"packages/*"
44
],
5-
"version": "0.10.6",
5+
"version": "0.10.8",
66
"npmClient": "yarn",
77
"useWorkspaces": true,
88
"command": {

‎package.json

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -19,20 +19,20 @@
1919
"deploy:storybook": "lerna run build:i18n && storybook-to-ghpages --ci"
2020
},
2121
"dependencies": {
22-
"@storybook/addon-actions": "6.0.13",
23-
"@storybook/addon-controls": "6.0.13",
24-
"@storybook/addon-docs": "6.0.13",
25-
"@storybook/addon-toolbars": "6.0.13",
26-
"@storybook/addons": "6.0.13",
27-
"@storybook/cli": "6.0.13",
28-
"@storybook/react": "6.0.13",
29-
"@storybook/theming": "6.0.13",
22+
"@storybook/addon-actions": "6.0.20",
23+
"@storybook/addon-controls": "6.0.20",
24+
"@storybook/addon-docs": "6.0.20",
25+
"@storybook/addon-toolbars": "6.0.20",
26+
"@storybook/addons": "6.0.20",
27+
"@storybook/cli": "6.0.20",
28+
"@storybook/react": "6.0.20",
29+
"@storybook/theming": "6.0.20",
3030
"@ui5/webcomponents": "1.0.0-rc.8",
3131
"@ui5/webcomponents-fiori": "1.0.0-rc.8",
3232
"@ui5/webcomponents-icons": "1.0.0-rc.8",
3333
"react": "16.8.0",
3434
"react-dom": "16.8.0",
35-
"react-syntax-highlighter": "^13.3.1"
35+
"react-syntax-highlighter": "^13.5.1"
3636
},
3737
"devDependencies": {
3838
"@babel/core": "^7.11.0",
@@ -51,8 +51,8 @@
5151
"@rollup/plugin-node-resolve": "^8.4.0",
5252
"@rollup/plugin-replace": "^2.3.2",
5353
"@storybook/storybook-deployer": "^2.8.6",
54-
"@testing-library/jest-dom": "^5.11.2",
55-
"@testing-library/react": "^10.4.7",
54+
"@testing-library/jest-dom": "^5.11.4",
55+
"@testing-library/react": "^11.0.0-beta.1",
5656
"@types/enzyme": "^3.10.5",
5757
"@types/jest": "^26.0.8",
5858
"@types/react": "^16.9.34",
@@ -78,7 +78,7 @@
7878
"glob": "^7.1.6",
7979
"husky": "^4.2.5",
8080
"identity-obj-proxy": "^3.0.0",
81-
"jest": "^26.2.2",
81+
"jest": "^26.4.2",
8282
"jest-canvas-mock": "^2.2.0",
8383
"jest-environment-jsdom-sixteen": "^1.0.2",
8484
"jest-enzyme": "^7.1.2",

‎packages/charts/CHANGELOG.md

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,33 @@
33
All notable changes to this project will be documented in this file.
44
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
55

6+
## [0.10.8](https://github.com/SAP/ui5-webcomponents-react/compare/v0.10.7...v0.10.8) (2020-09-02)
7+
8+
9+
### Bug Fixes
10+
11+
* **PieChart/DonutChart:** re-release active segment feature ([0447b22](https://github.com/SAP/ui5-webcomponents-react/commit/0447b22a63e642d632b0d80521a4ee6a31213a4b))
12+
13+
14+
15+
16+
17+
## [0.10.7](https://github.com/SAP/ui5-webcomponents-react/compare/v0.10.6...v0.10.7) (2020-08-28)
18+
19+
20+
### Bug Fixes
21+
22+
* **PieChart / DonutChart:** fix hide data label logic ([#668](https://github.com/SAP/ui5-webcomponents-react/issues/668)) ([d8dc5ef](https://github.com/SAP/ui5-webcomponents-react/commit/d8dc5ef1faa96fcc24014790fb199999a3a9266d))
23+
24+
25+
### Features
26+
27+
* **PieChart / DonutChart:** add option to mark chart segments as active ([#667](https://github.com/SAP/ui5-webcomponents-react/issues/667)) ([743d6d8](https://github.com/SAP/ui5-webcomponents-react/commit/743d6d8fcc79a58f0dd09f37e0f77030f96cb2f9))
28+
29+
30+
31+
32+
633
## [0.10.6](https://github.com/SAP/ui5-webcomponents-react/compare/v0.10.5...v0.10.6) (2020-08-24)
734

835

‎packages/charts/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@ui5/webcomponents-react-charts",
3-
"version": "0.10.6",
3+
"version": "0.10.8",
44
"description": "Charts for ui5-webcomponents-react",
55
"main": "index.cjs.js",
66
"module": "index.esm.js",

‎packages/charts/src/components/DonutChart/DonutChart.stories.tsx

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,11 +17,19 @@ export default {
1717
},
1818
dimension: {
1919
type: null
20+
},
21+
showActiveSegmentDataLabel: {
22+
type: 'boolean'
23+
},
24+
activeSegment: {
25+
type: 'number'
2026
}
2127
},
2228
args: {
2329
innerRadius: '20%',
24-
outerRadius: '90%'
30+
outerRadius: '90%',
31+
activeSegment: 9,
32+
showActiveSegmentDataLabel: true
2533
}
2634
};
2735

@@ -35,6 +43,10 @@ export const renderStory = (props) => {
3543
onLegendClick={props.onLegendClick}
3644
style={{ width: '50%' }}
3745
dataset={simpleDataSet}
46+
chartConfig={{
47+
activeSegment: props.activeSegment,
48+
showActiveSegmentDataLabel: props.showActiveSegmentDataLabel
49+
}}
3850
dimension={{
3951
accessor: 'name'
4052
}}

‎packages/charts/src/components/PieChart/PieChart.stories.tsx

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -95,6 +95,10 @@ export const renderFormatedStory = (props) => {
9595
accessor: 'users',
9696
formatter: (d) => (d > 200 ? 'over 200' : 'lower')
9797
}}
98+
chartConfig={{
99+
activeSegment: 1,
100+
showActiveSegmentDataLabel: true
101+
}}
98102
/>
99103
);
100104
};

‎packages/charts/src/components/PieChart/PieChart.tsx

Lines changed: 88 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import { ChartContainer } from '@ui5/webcomponents-react-charts/lib/components/C
44
import { PieChartPlaceholder } from '@ui5/webcomponents-react-charts/lib/PieChartPlaceholder';
55
import { useLegendItemClick } from '@ui5/webcomponents-react-charts/lib/useLegendItemClick';
66
import React, { CSSProperties, FC, forwardRef, Ref, useCallback, useMemo, isValidElement, cloneElement } from 'react';
7-
import { Cell, Label, Legend, Pie, PieChart as PieChartLib, Tooltip, Text } from 'recharts';
7+
import { Cell, Label, Legend, Pie, PieChart as PieChartLib, Tooltip, Text, Sector } from 'recharts';
88
import { getValueByDataKey } from 'recharts/lib/util/ChartUtils';
99
import { IChartBaseProps } from '../../interfaces/IChartBaseProps';
1010
import { IChartMeasure } from '../../interfaces/IChartMeasure';
@@ -85,6 +85,8 @@ const PieChart: FC<PieChartProps> = forwardRef((props: PieChartProps, ref: Ref<H
8585
};
8686
}, [props.chartConfig]);
8787

88+
const showActiveSegmentDataLabel = chartConfig.showActiveSegmentDataLabel ?? true;
89+
8890
const dimension: DimensionConfig = useMemo(
8991
() => ({
9092
formatter: defaultFormatter,
@@ -103,7 +105,7 @@ const PieChart: FC<PieChartProps> = forwardRef((props: PieChartProps, ref: Ref<H
103105

104106
const dataLabel = useCallback(
105107
(props) => {
106-
if (measure.hideDataLabel) return null;
108+
if (measure.hideDataLabel || chartConfig.activeSegment === props.index) return null;
107109

108110
if (isValidElement(measure.DataLabel)) {
109111
return cloneElement(measure.DataLabel, { ...props, config: measure });
@@ -115,7 +117,7 @@ const PieChart: FC<PieChartProps> = forwardRef((props: PieChartProps, ref: Ref<H
115117
</Text>
116118
);
117119
},
118-
[measure]
120+
[measure, chartConfig.activeSegment]
119121
);
120122

121123
const tooltipValueFormatter = useCallback((value, name) => [measure.formatter(value), dimension.formatter(name)], [
@@ -143,6 +145,85 @@ const PieChart: FC<PieChartProps> = forwardRef((props: PieChartProps, ref: Ref<H
143145
[onDataPointClick]
144146
);
145147

148+
const renderActiveShape = useCallback(
149+
(props) => {
150+
const RADIAN = Math.PI / 180;
151+
const { cx, cy, midAngle, innerRadius, outerRadius, startAngle, endAngle, fill, payload, percent, value } = props;
152+
const sin = Math.sin(-RADIAN * midAngle);
153+
const cos = Math.cos(-RADIAN * midAngle);
154+
const sx = cx + (outerRadius + 10) * cos;
155+
const sy = cy + (outerRadius + 10) * sin;
156+
const mx = cx + (outerRadius + 30) * cos;
157+
const my = cy + (outerRadius + 30) * sin;
158+
const ex = mx + (cos >= 0 ? 1 : -1) * 22;
159+
const ey = my;
160+
const textAnchor = cos >= 0 ? 'start' : 'end';
161+
162+
return (
163+
<g>
164+
<text x={cx} y={cy} dy={8} textAnchor="middle" fill={fill}>
165+
{payload.name}
166+
</text>
167+
<Sector
168+
cx={cx}
169+
cy={cy}
170+
innerRadius={innerRadius}
171+
outerRadius={outerRadius}
172+
startAngle={startAngle}
173+
endAngle={endAngle}
174+
fill={fill}
175+
/>
176+
<Sector
177+
cx={cx}
178+
cy={cy}
179+
startAngle={startAngle}
180+
endAngle={endAngle}
181+
innerRadius={outerRadius + 6}
182+
outerRadius={outerRadius + 10}
183+
fill={fill}
184+
/>
185+
{showActiveSegmentDataLabel && (
186+
<>
187+
<path d={`M${sx},${sy}L${mx},${my}L${ex},${ey}`} stroke={fill} fill="none" />
188+
<circle cx={ex} cy={ey} r={2} fill={fill} stroke="none" />
189+
<text x={ex + (cos >= 0 ? 1 : -1) * 12} y={ey} textAnchor={textAnchor} fill={fill}>
190+
{measure.formatter(value)}
191+
</text>
192+
<text x={ex + (cos >= 0 ? 1 : -1) * 12} y={ey} dy={18} textAnchor={textAnchor} fill={fill}>
193+
{`(${(percent * 100).toFixed(2)}%)`}
194+
</text>
195+
</>
196+
)}
197+
</g>
198+
);
199+
},
200+
[showActiveSegmentDataLabel]
201+
);
202+
203+
const renderLabelLine = useCallback(
204+
(props) => {
205+
if (measure.hideDataLabel || chartConfig.activeSegment === props.index) return null;
206+
return Pie.renderLabelLineItem(undefined, props);
207+
},
208+
[chartConfig.activeSegment, measure.hideDataLabel]
209+
);
210+
211+
const legendWrapperStyle = useMemo(() => {
212+
if (chartConfig.activeSegment != null && showActiveSegmentDataLabel) {
213+
if (chartConfig.legendPosition === 'bottom') {
214+
return {
215+
paddingTop: '30px'
216+
};
217+
} else if (chartConfig.legendPosition === 'top') {
218+
return {
219+
paddingBottom: '30px'
220+
};
221+
}
222+
}
223+
224+
return null;
225+
}, [showActiveSegmentDataLabel, chartConfig.activeSegment, chartConfig.legendPosition]);
226+
146227
return (
147228
<ChartContainer
148229
dataset={dataset}
@@ -172,8 +253,10 @@ const PieChart: FC<PieChartProps> = forwardRef((props: PieChartProps, ref: Ref<H
172253
data={dataset}
173254
animationBegin={0}
174255
isAnimationActive={noAnimation === false}
175-
labelLine={measure.hideDataLabel !== true}
256+
labelLine={renderLabelLine}
176257
label={dataLabel}
258+
activeIndex={chartConfig.activeSegment}
259+
activeShape={chartConfig.activeSegment != null && renderActiveShape}
177260
>
178261
{centerLabel && <Label position={'center'}>{centerLabel}</Label>}
179262
{dataset &&
@@ -199,6 +282,7 @@ const PieChart: FC<PieChartProps> = forwardRef((props: PieChartProps, ref: Ref<H
199282
verticalAlign={chartConfig.legendPosition}
200283
align={chartConfig.legendHorizontalAlign}
201284
onClick={onItemLegendClick}
285+
wrapperStyle={legendWrapperStyle}
202286
/>
203287
)}
204288
</PieChartLib>

0 commit comments

Comments
 (0)