@gooddata/sdk-ui-vis-commons 10.28.0-alpha.9 → 10.28.0-alpha.91
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/esm/index.d.ts +1 -1
- package/esm/index.d.ts.map +1 -1
- package/esm/index.js +1 -1
- package/esm/index.js.map +1 -1
- package/esm/legend/FluidLegend.d.ts.map +1 -1
- package/esm/legend/FluidLegend.js +3 -2
- package/esm/legend/FluidLegend.js.map +1 -1
- package/esm/legend/Legend.d.ts +4 -4
- package/esm/legend/Legend.d.ts.map +1 -1
- package/esm/legend/Legend.js +1 -1
- package/esm/legend/Legend.js.map +1 -1
- package/esm/legend/LegendAxisIndicator.d.ts +2 -2
- package/esm/legend/LegendAxisIndicator.d.ts.map +1 -1
- package/esm/legend/LegendAxisIndicator.js +1 -1
- package/esm/legend/LegendAxisIndicator.js.map +1 -1
- package/esm/legend/LegendItem.d.ts +3 -2
- package/esm/legend/LegendItem.d.ts.map +1 -1
- package/esm/legend/LegendItem.js +8 -1
- package/esm/legend/LegendItem.js.map +1 -1
- package/esm/legend/LegendList.d.ts +4 -6
- package/esm/legend/LegendList.d.ts.map +1 -1
- package/esm/legend/LegendList.js +16 -19
- package/esm/legend/LegendList.js.map +1 -1
- package/esm/legend/LegendSeries.d.ts +13 -0
- package/esm/legend/LegendSeries.d.ts.map +1 -0
- package/esm/legend/LegendSeries.js +63 -0
- package/esm/legend/LegendSeries.js.map +1 -0
- package/esm/legend/Paging.d.ts.map +1 -1
- package/esm/legend/Paging.js +2 -1
- package/esm/legend/Paging.js.map +1 -1
- package/esm/legend/PopUpLegend/LegendDialog.d.ts +1 -0
- package/esm/legend/PopUpLegend/LegendDialog.d.ts.map +1 -1
- package/esm/legend/PopUpLegend/LegendDialog.js +21 -13
- package/esm/legend/PopUpLegend/LegendDialog.js.map +1 -1
- package/esm/legend/PopUpLegend/PopUpLegend.d.ts +3 -3
- package/esm/legend/PopUpLegend/PopUpLegend.d.ts.map +1 -1
- package/esm/legend/PopUpLegend/PopUpLegend.js +10 -5
- package/esm/legend/PopUpLegend/PopUpLegend.js.map +1 -1
- package/esm/legend/PopUpLegend/RowLegend.d.ts +7 -3
- package/esm/legend/PopUpLegend/RowLegend.d.ts.map +1 -1
- package/esm/legend/PopUpLegend/RowLegend.js +26 -22
- package/esm/legend/PopUpLegend/RowLegend.js.map +1 -1
- package/esm/legend/StaticLegend.d.ts +5 -15
- package/esm/legend/StaticLegend.d.ts.map +1 -1
- package/esm/legend/StaticLegend.js +51 -73
- package/esm/legend/StaticLegend.js.map +1 -1
- package/esm/legend/context.d.ts +16 -0
- package/esm/legend/context.d.ts.map +1 -0
- package/esm/legend/context.js +14 -0
- package/esm/legend/context.js.map +1 -0
- package/esm/legend/helpers.js +1 -1
- package/esm/legend/types.d.ts +15 -0
- package/esm/legend/types.d.ts.map +1 -1
- package/esm/legend/types.js +1 -1
- package/esm/sdk-ui-vis-commons.d.ts +25 -19
- package/package.json +10 -9
- package/styles/scss/legend.scss +9 -8
|
@@ -4,6 +4,7 @@ import { useIntl } from "react-intl";
|
|
|
4
4
|
import { StaticLegend } from "../StaticLegend.js";
|
|
5
5
|
import { LegendDialog } from "./LegendDialog.js";
|
|
6
6
|
import { RowLegend } from "./RowLegend.js";
|
|
7
|
+
import { useIdPrefixed } from "@gooddata/sdk-ui-kit";
|
|
7
8
|
const PAGINATION_HEIGHT = 34;
|
|
8
9
|
/**
|
|
9
10
|
* @internal
|
|
@@ -14,15 +15,19 @@ export const PopUpLegend = (props) => {
|
|
|
14
15
|
const [isDialogOpen, setDialogOpen] = useState(false);
|
|
15
16
|
const [page, setPage] = useState(1);
|
|
16
17
|
const dialogTitle = (page === 1 && customComponentName) || name || intl.formatMessage({ id: "properties.legend.title" });
|
|
17
|
-
const
|
|
18
|
+
const id = useIdPrefixed("popUpLegend");
|
|
19
|
+
const dialogId = `${id}-dialog`;
|
|
20
|
+
const triggerId = `${id}-trigger`;
|
|
21
|
+
const onCloseDialog = React.useCallback(() => {
|
|
18
22
|
setDialogOpen(false);
|
|
19
23
|
setPage(1);
|
|
20
|
-
|
|
24
|
+
document.getElementById(triggerId)?.focus();
|
|
25
|
+
}, [triggerId]);
|
|
21
26
|
return (React.createElement("div", { "data-testid": "pop-up-legend" },
|
|
22
27
|
React.createElement(RowLegend, { legendLabel: name, maxRowsCount: maxRows, series: [...series], onDialogIconClick: () => {
|
|
23
28
|
setDialogOpen((prevState) => !prevState);
|
|
24
|
-
}, onLegendItemClick: onLegendItemClick, enableBorderRadius: enableBorderRadius, isActive: isDialogOpen }),
|
|
25
|
-
React.createElement(LegendDialog, { name: dialogTitle, alignTo: `.${containerId}`, isOpen: isDialogOpen, onCloseDialog: onCloseDialog },
|
|
26
|
-
React.createElement(StaticLegend, { containerHeight: 260, series: [...series], position: "dialog", buttonOrientation: "leftRight", onItemClick: onLegendItemClick, shouldFillAvailableSpace: false, enableBorderRadius: enableBorderRadius, paginationHeight: PAGINATION_HEIGHT, customComponent: customComponent, onPageChanged: setPage }))));
|
|
29
|
+
}, onLegendItemClick: onLegendItemClick, enableBorderRadius: enableBorderRadius, isActive: isDialogOpen, dialogId: dialogId, triggerId: triggerId }),
|
|
30
|
+
React.createElement(LegendDialog, { name: dialogTitle, alignTo: `.${containerId}`, isOpen: isDialogOpen, onCloseDialog: onCloseDialog, id: dialogId },
|
|
31
|
+
React.createElement(StaticLegend, { containerHeight: 260, series: [...series], label: name, isLabelVisible: false, position: "dialog", buttonOrientation: "leftRight", onItemClick: onLegendItemClick, shouldFillAvailableSpace: false, enableBorderRadius: enableBorderRadius, paginationHeight: PAGINATION_HEIGHT, customComponent: customComponent, onPageChanged: setPage }))));
|
|
27
32
|
};
|
|
28
33
|
//# sourceMappingURL=PopUpLegend.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PopUpLegend.js","sourceRoot":"","sources":["../../../src/legend/PopUpLegend/PopUpLegend.tsx"],"names":[],"mappings":"AAAA,qCAAqC;AACrC,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAErC,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAGlD,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"PopUpLegend.js","sourceRoot":"","sources":["../../../src/legend/PopUpLegend/PopUpLegend.tsx"],"names":[],"mappings":"AAAA,qCAAqC;AACrC,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAErC,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAGlD,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAErD,MAAM,iBAAiB,GAAG,EAAE,CAAC;AAiB7B;;GAEG;AACH,MAAM,CAAC,MAAM,WAAW,GAAgC,CAAC,KAAK,EAAE,EAAE;IAC9D,MAAM,EACF,IAAI,EACJ,OAAO,EACP,kBAAkB,EAClB,MAAM,EACN,iBAAiB,EACjB,WAAW,EACX,eAAe,EACf,mBAAmB,GACtB,GAAG,KAAK,CAAC;IACV,MAAM,IAAI,GAAG,OAAO,EAAE,CAAC;IACvB,MAAM,CAAC,YAAY,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACtD,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;IAEpC,MAAM,WAAW,GACb,CAAC,IAAI,KAAK,CAAC,IAAI,mBAAmB,CAAC,IAAI,IAAI,IAAI,IAAI,CAAC,aAAa,CAAC,EAAE,EAAE,EAAE,yBAAyB,EAAE,CAAC,CAAC;IAEzG,MAAM,EAAE,GAAG,aAAa,CAAC,aAAa,CAAC,CAAC;IACxC,MAAM,QAAQ,GAAG,GAAG,EAAE,SAAS,CAAC;IAChC,MAAM,SAAS,GAAG,GAAG,EAAE,UAAU,CAAC;IAElC,MAAM,aAAa,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACzC,aAAa,CAAC,KAAK,CAAC,CAAC;QACrB,OAAO,CAAC,CAAC,CAAC,CAAC;QACX,QAAQ,CAAC,cAAc,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,CAAC;IAChD,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,OAAO,CACH,4CAAiB,eAAe;QAC5B,oBAAC,SAAS,IACN,WAAW,EAAE,IAAI,EACjB,YAAY,EAAE,OAAO,EACrB,MAAM,EAAE,CAAC,GAAG,MAAM,CAAC,EACnB,iBAAiB,EAAE,GAAG,EAAE;gBACpB,aAAa,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC;YAC7C,CAAC,EACD,iBAAiB,EAAE,iBAAiB,EACpC,kBAAkB,EAAE,kBAAkB,EACtC,QAAQ,EAAE,YAAY,EACtB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,GACtB;QAEF,oBAAC,YAAY,IACT,IAAI,EAAE,WAAW,EACjB,OAAO,EAAE,IAAI,WAAW,EAAE,EAC1B,MAAM,EAAE,YAAY,EACpB,aAAa,EAAE,aAAa,EAC5B,EAAE,EAAE,QAAQ;YAEZ,oBAAC,YAAY,IACT,eAAe,EAAE,GAAG,EACpB,MAAM,EAAE,CAAC,GAAG,MAAM,CAAC,EACnB,KAAK,EAAE,IAAI,EACX,cAAc,EAAE,KAAK,EACrB,QAAQ,EAAE,QAAQ,EAClB,iBAAiB,EAAE,WAAW,EAC9B,WAAW,EAAE,iBAAiB,EAC9B,wBAAwB,EAAE,KAAK,EAC/B,kBAAkB,EAAE,kBAAkB,EACtC,gBAAgB,EAAE,iBAAiB,EACnC,eAAe,EAAE,eAAe,EAChC,aAAa,EAAE,OAAO,GACxB,CACS,CACb,CACT,CAAC;AACN,CAAC,CAAC"}
|
|
@@ -1,19 +1,23 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
import {
|
|
2
|
+
import { ISeriesItem, ItemBorderRadiusPredicate } from "../types.js";
|
|
3
3
|
export interface IRowLegendIcoButton {
|
|
4
4
|
isVisible: boolean;
|
|
5
5
|
isActive: boolean;
|
|
6
6
|
onIconClick: () => void;
|
|
7
|
+
dialogId: string;
|
|
8
|
+
triggerId: string;
|
|
7
9
|
}
|
|
8
10
|
export declare const RowLegendIcoButton: React.FC<IRowLegendIcoButton>;
|
|
9
11
|
export interface IRowLegendProps {
|
|
10
12
|
legendLabel?: string;
|
|
11
13
|
maxRowsCount?: number;
|
|
12
|
-
series:
|
|
14
|
+
series: ISeriesItem[];
|
|
13
15
|
enableBorderRadius?: boolean | ItemBorderRadiusPredicate;
|
|
14
16
|
onDialogIconClick: () => void;
|
|
15
|
-
onLegendItemClick: (item:
|
|
17
|
+
onLegendItemClick: (item: ISeriesItem) => void;
|
|
16
18
|
isActive?: boolean;
|
|
19
|
+
dialogId: string;
|
|
20
|
+
triggerId: string;
|
|
17
21
|
}
|
|
18
22
|
export declare const RowLegend: React.FC<IRowLegendProps>;
|
|
19
23
|
//# sourceMappingURL=RowLegend.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RowLegend.d.ts","sourceRoot":"","sources":["../../../src/legend/PopUpLegend/RowLegend.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAKxC,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"RowLegend.d.ts","sourceRoot":"","sources":["../../../src/legend/PopUpLegend/RowLegend.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAKxC,OAAO,EAAE,WAAW,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AA2BrE,MAAM,WAAW,mBAAmB;IAChC,SAAS,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;IAClB,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;CACrB;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CA4C5D,CAAC;AAEF,MAAM,WAAW,eAAe;IAC5B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,MAAM,EAAE,WAAW,EAAE,CAAC;IACtB,kBAAkB,CAAC,EAAE,OAAO,GAAG,yBAAyB,CAAC;IACzD,iBAAiB,EAAE,MAAM,IAAI,CAAC;IAC9B,iBAAiB,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;IAC/C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;CACrB;AAED,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CA8C/C,CAAC"}
|
|
@@ -1,9 +1,11 @@
|
|
|
1
|
-
// (C) 2007-
|
|
1
|
+
// (C) 2007-2025 GoodData Corporation
|
|
2
2
|
import React, { useState } from "react";
|
|
3
|
-
import { Icon } from "@gooddata/sdk-ui-kit";
|
|
3
|
+
import { Button, Icon } from "@gooddata/sdk-ui-kit";
|
|
4
4
|
import cx from "classnames";
|
|
5
5
|
import { LegendLabelItem } from "../LegendLabelItem.js";
|
|
6
6
|
import { LegendList } from "../LegendList.js";
|
|
7
|
+
import { LegendSeries } from "../LegendSeries.js";
|
|
8
|
+
import { useIntl } from "react-intl";
|
|
7
9
|
const LEGEND_ROW_HEIGHT = 20;
|
|
8
10
|
const LEGEND_TOP_BOTTOM_PADDING = 10;
|
|
9
11
|
const useCheckOverflow = () => {
|
|
@@ -22,37 +24,39 @@ const useCheckOverflow = () => {
|
|
|
22
24
|
};
|
|
23
25
|
return [isOverflow, numOfUsedRow, checkOverFlow];
|
|
24
26
|
};
|
|
25
|
-
export const RowLegendIcoButton = (
|
|
26
|
-
const {
|
|
27
|
-
|
|
28
|
-
return null;
|
|
29
|
-
}
|
|
30
|
-
const handleOnClick = (e) => {
|
|
27
|
+
export const RowLegendIcoButton = ({ isVisible, isActive, onIconClick, dialogId, triggerId, }) => {
|
|
28
|
+
const { formatMessage } = useIntl();
|
|
29
|
+
const handleClick = React.useCallback((e) => {
|
|
31
30
|
e.stopPropagation();
|
|
32
31
|
e.preventDefault();
|
|
33
32
|
onIconClick();
|
|
34
|
-
};
|
|
35
|
-
|
|
33
|
+
}, [onIconClick]);
|
|
34
|
+
if (!isVisible) {
|
|
35
|
+
return null;
|
|
36
|
+
}
|
|
37
|
+
const iconClasses = cx("legend-popup-button legend-popup-icon s-legend-popup-icon", {
|
|
36
38
|
"legend-popup-icon-active": isActive,
|
|
37
39
|
});
|
|
38
40
|
return (React.createElement("div", { className: "legend-popup-button" },
|
|
39
|
-
React.createElement(
|
|
40
|
-
|
|
41
|
+
React.createElement(Button, { onClick: handleClick, className: iconClasses, tabIndex: 0, accessibilityConfig: {
|
|
42
|
+
isExpanded: isActive,
|
|
43
|
+
popupId: dialogId,
|
|
44
|
+
ariaLabel: formatMessage({ id: "properties.legend.more.button" }),
|
|
45
|
+
}, id: triggerId },
|
|
46
|
+
React.createElement("div", { role: "presentation" },
|
|
47
|
+
React.createElement(Icon.LegendMenu, null)))));
|
|
41
48
|
};
|
|
42
49
|
export const RowLegend = (props) => {
|
|
43
|
-
const { series, maxRowsCount = 1, legendLabel, enableBorderRadius, onDialogIconClick, onLegendItemClick, isActive = false, } = props;
|
|
50
|
+
const { series, maxRowsCount = 1, legendLabel, enableBorderRadius, onDialogIconClick, onLegendItemClick, dialogId, triggerId, isActive = false, } = props;
|
|
44
51
|
const [isOverflow, numOfUsedRow, checkOverFlow] = useCheckOverflow();
|
|
45
52
|
const LEGEND_HEIGHT = maxRowsCount * LEGEND_ROW_HEIGHT + LEGEND_TOP_BOTTOM_PADDING;
|
|
46
53
|
const itemsAlign = numOfUsedRow === 1 ? "flex-end" : "flex-start";
|
|
47
54
|
return (React.createElement("div", { className: "legend-popup-row", style: { maxHeight: LEGEND_HEIGHT } },
|
|
48
|
-
React.createElement(
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
React.createElement(LegendLabelItem, { label: legendLabel }),
|
|
55
|
-
React.createElement(LegendList, { enableBorderRadius: enableBorderRadius, series: series, onItemClick: onLegendItemClick }))),
|
|
56
|
-
React.createElement(RowLegendIcoButton, { isActive: isActive, isVisible: isOverflow, onIconClick: onDialogIconClick })));
|
|
55
|
+
React.createElement(LegendSeries, { onToggleItem: onLegendItemClick, series: series, ref: checkOverFlow, style: {
|
|
56
|
+
justifyContent: itemsAlign,
|
|
57
|
+
}, label: legendLabel, className: "viz-legend static position-row" },
|
|
58
|
+
React.createElement(LegendLabelItem, { label: legendLabel }),
|
|
59
|
+
React.createElement(LegendList, { enableBorderRadius: enableBorderRadius, series: series, onItemClick: onLegendItemClick })),
|
|
60
|
+
React.createElement(RowLegendIcoButton, { isActive: isActive, isVisible: isOverflow, onIconClick: onDialogIconClick, dialogId: dialogId, triggerId: triggerId })));
|
|
57
61
|
};
|
|
58
62
|
//# sourceMappingURL=RowLegend.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RowLegend.js","sourceRoot":"","sources":["../../../src/legend/PopUpLegend/RowLegend.tsx"],"names":[],"mappings":"AAAA,qCAAqC;AACrC,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;
|
|
1
|
+
{"version":3,"file":"RowLegend.js","sourceRoot":"","sources":["../../../src/legend/PopUpLegend/RowLegend.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,36 +1,26 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { ButtonsOrientationType } from "./Paging.js";
|
|
3
|
-
import {
|
|
3
|
+
import { ISeriesItem, ItemBorderRadiusPredicate } from "./types.js";
|
|
4
4
|
/**
|
|
5
5
|
* @internal
|
|
6
6
|
*/
|
|
7
7
|
export interface IStaticLegendProps {
|
|
8
8
|
containerHeight: number;
|
|
9
9
|
position: string;
|
|
10
|
-
series:
|
|
10
|
+
series: ISeriesItem[];
|
|
11
11
|
enableBorderRadius?: boolean | ItemBorderRadiusPredicate;
|
|
12
12
|
shouldFillAvailableSpace?: boolean;
|
|
13
13
|
label?: string;
|
|
14
14
|
buttonOrientation?: ButtonsOrientationType;
|
|
15
|
-
onItemClick?(item: IPushpinCategoryLegendItem): void;
|
|
16
15
|
paginationHeight?: number;
|
|
17
16
|
customComponent?: JSX.Element | null;
|
|
17
|
+
isLabelVisible?: boolean;
|
|
18
|
+
onItemClick?(item: ISeriesItem): void;
|
|
18
19
|
onPageChanged?: (page: number) => void;
|
|
19
20
|
}
|
|
20
21
|
/**
|
|
21
22
|
* @internal
|
|
22
23
|
*/
|
|
23
|
-
export declare
|
|
24
|
-
static defaultProps: Pick<IStaticLegendProps, "buttonOrientation" | "paginationHeight" | "onPageChanged">;
|
|
25
|
-
state: {
|
|
26
|
-
page: number;
|
|
27
|
-
};
|
|
28
|
-
showNextPage: () => void;
|
|
29
|
-
showPrevPage: () => void;
|
|
30
|
-
renderPaging: (pagesCount: number) => React.ReactNode;
|
|
31
|
-
render(): React.JSX.Element;
|
|
32
|
-
private getPagesCount;
|
|
33
|
-
private hasCustomComponent;
|
|
34
|
-
}
|
|
24
|
+
export declare const StaticLegend: React.NamedExoticComponent<IStaticLegendProps>;
|
|
35
25
|
export declare const getPagingValues: (page: number, visibleItemsCount: number, seriesLength: number, hasCustomComponent: boolean) => [number, number];
|
|
36
26
|
//# sourceMappingURL=StaticLegend.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StaticLegend.d.ts","sourceRoot":"","sources":["../../src/legend/StaticLegend.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"StaticLegend.d.ts","sourceRoot":"","sources":["../../src/legend/StaticLegend.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,sBAAsB,EAAU,MAAM,aAAa,CAAC;AAG7D,OAAO,EAAE,WAAW,EAAE,yBAAyB,EAAE,MAAM,YAAY,CAAC;AAIpE;;GAEG;AACH,MAAM,WAAW,kBAAkB;IAC/B,eAAe,EAAE,MAAM,CAAC;IACxB,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,WAAW,EAAE,CAAC;IACtB,kBAAkB,CAAC,EAAE,OAAO,GAAG,yBAAyB,CAAC;IACzD,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iBAAiB,CAAC,EAAE,sBAAsB,CAAC;IAC3C,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,eAAe,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,IAAI,CAAC;IACrC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,WAAW,CAAC,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI,CAAC;IACtC,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CAC1C;AAED;;GAEG;AACH,eAAO,MAAM,YAAY,gDAmHvB,CAAC;AAOH,eAAO,MAAM,eAAe,SAClB,MAAM,qBACO,MAAM,gBACX,MAAM,sBACA,OAAO,KAC5B,CAAC,MAAM,EAAE,MAAM,CAMjB,CAAC"}
|
|
@@ -1,89 +1,67 @@
|
|
|
1
|
-
// (C) 2007-
|
|
1
|
+
// (C) 2007-2025 GoodData Corporation
|
|
2
2
|
import React from "react";
|
|
3
3
|
import cx from "classnames";
|
|
4
4
|
import noop from "lodash/noop.js";
|
|
5
|
-
import isNil from "lodash/isNil.js";
|
|
6
5
|
import { LegendList } from "./LegendList.js";
|
|
7
6
|
import { Paging } from "./Paging.js";
|
|
8
7
|
import { BOTTOM, TOP } from "./PositionTypes.js";
|
|
9
8
|
import { calculateStaticLegend, ITEM_HEIGHT, STATIC_PAGING_HEIGHT } from "./helpers.js";
|
|
10
9
|
import { LegendLabelItem } from "./LegendLabelItem.js";
|
|
10
|
+
import { LegendSeries } from "./LegendSeries.js";
|
|
11
11
|
/**
|
|
12
12
|
* @internal
|
|
13
13
|
*/
|
|
14
|
-
export
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
page: 1,
|
|
22
|
-
};
|
|
23
|
-
showNextPage = () => {
|
|
24
|
-
const updatedPage = this.state.page + 1;
|
|
25
|
-
this.props.onPageChanged(updatedPage);
|
|
26
|
-
this.setState({ page: updatedPage });
|
|
27
|
-
};
|
|
28
|
-
showPrevPage = () => {
|
|
29
|
-
const updatedPage = this.state.page - 1;
|
|
30
|
-
this.props.onPageChanged(updatedPage);
|
|
31
|
-
this.setState({ page: updatedPage });
|
|
32
|
-
};
|
|
33
|
-
renderPaging = (pagesCount) => {
|
|
34
|
-
const { page } = this.state;
|
|
35
|
-
const { buttonOrientation } = this.props;
|
|
36
|
-
return (React.createElement(Paging, { page: page, pagesCount: pagesCount, showNextPage: this.showNextPage, showPrevPage: this.showPrevPage, buttonsOrientation: buttonOrientation }));
|
|
37
|
-
};
|
|
38
|
-
render() {
|
|
39
|
-
const { enableBorderRadius, containerHeight, onItemClick = noop, position, series, shouldFillAvailableSpace = true, label, paginationHeight, customComponent, } = this.props;
|
|
40
|
-
const { page } = this.state;
|
|
41
|
-
const classNames = cx("viz-legend", "static", `position-${position}`);
|
|
42
|
-
// Without paging
|
|
43
|
-
if (position === TOP || position === BOTTOM) {
|
|
44
|
-
return (React.createElement("div", { className: classNames },
|
|
45
|
-
React.createElement("div", { className: "series" },
|
|
46
|
-
React.createElement(LegendList, { enableBorderRadius: enableBorderRadius, series: series, onItemClick: onItemClick }))));
|
|
47
|
-
}
|
|
48
|
-
const columnNum = position === "dialog" ? 2 : 1;
|
|
49
|
-
const labelHeight = label ? ITEM_HEIGHT : 0;
|
|
50
|
-
const labelComponent = label ? React.createElement(LegendLabelItem, { label: label }) : null;
|
|
51
|
-
const contentHeight = containerHeight - labelHeight;
|
|
52
|
-
const seriesCount = series.length;
|
|
53
|
-
const { hasPaging, visibleItemsCount } = calculateStaticLegend(seriesCount, contentHeight, columnNum, paginationHeight);
|
|
54
|
-
const usePaging = hasPaging || customComponent;
|
|
55
|
-
const heightOfAvailableSpace = (visibleItemsCount / columnNum) * ITEM_HEIGHT;
|
|
56
|
-
const heightOfVisibleItems = Math.min(visibleItemsCount / columnNum, seriesCount) * ITEM_HEIGHT;
|
|
57
|
-
const seriesHeight = (shouldFillAvailableSpace ? heightOfAvailableSpace : heightOfVisibleItems) + labelHeight;
|
|
58
|
-
const shouldDisplayCustomComponent = page === 1 && this.hasCustomComponent();
|
|
59
|
-
const pagesCount = this.getPagesCount(series.length, visibleItemsCount);
|
|
60
|
-
if (shouldDisplayCustomComponent) {
|
|
61
|
-
return (React.createElement("div", { className: classNames },
|
|
62
|
-
React.createElement("div", { className: "series", style: { height: seriesHeight } },
|
|
63
|
-
labelComponent,
|
|
64
|
-
customComponent),
|
|
65
|
-
usePaging ? this.renderPaging(pagesCount) : null));
|
|
66
|
-
}
|
|
67
|
-
const [start, end] = getPagingValues(page, visibleItemsCount, series.length, this.hasCustomComponent());
|
|
68
|
-
const pagedSeries = series.slice(start, end);
|
|
69
|
-
const visibleItemsFitOneColumn = shouldItemsFitOneColumn(visibleItemsCount, columnNum, pagedSeries.length);
|
|
70
|
-
const fullClassNames = cx(classNames, {
|
|
71
|
-
"no-width": visibleItemsFitOneColumn,
|
|
14
|
+
export const StaticLegend = React.memo(function StaticLegend({ buttonOrientation = "upDown", paginationHeight = STATIC_PAGING_HEIGHT, containerHeight, position, series, enableBorderRadius, shouldFillAvailableSpace, label, customComponent, isLabelVisible = true, onItemClick, onPageChanged, }) {
|
|
15
|
+
const [page, setPage] = React.useState(1);
|
|
16
|
+
const handleNextPage = React.useCallback(() => {
|
|
17
|
+
setPage((currentPage) => {
|
|
18
|
+
const newPage = currentPage + 1;
|
|
19
|
+
onPageChanged?.(newPage);
|
|
20
|
+
return newPage;
|
|
72
21
|
});
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
22
|
+
}, [onPageChanged]);
|
|
23
|
+
const handlePreviousPage = React.useCallback(() => {
|
|
24
|
+
setPage((currentPage) => {
|
|
25
|
+
const newPage = currentPage - 1;
|
|
26
|
+
onPageChanged?.(newPage);
|
|
27
|
+
return newPage;
|
|
28
|
+
});
|
|
29
|
+
}, [onPageChanged]);
|
|
30
|
+
const hasCustomComponent = customComponent != null;
|
|
31
|
+
const shouldDisplayCustomComponent = page === 1 && hasCustomComponent;
|
|
32
|
+
const columnNum = position === "dialog" ? 2 : 1;
|
|
33
|
+
const labelHeight = label && isLabelVisible ? ITEM_HEIGHT : 0;
|
|
34
|
+
const labelNode = label && isLabelVisible ? React.createElement(LegendLabelItem, { label: label }) : null;
|
|
35
|
+
const contentHeight = containerHeight - labelHeight;
|
|
36
|
+
const seriesCount = series.length;
|
|
37
|
+
const { hasPaging, visibleItemsCount } = calculateStaticLegend(seriesCount, contentHeight, columnNum, paginationHeight);
|
|
38
|
+
const usePaging = hasPaging || hasCustomComponent;
|
|
39
|
+
const pagesCount = getPagesCount(series.length, visibleItemsCount, hasCustomComponent);
|
|
40
|
+
const heightOfAvailableSpace = (visibleItemsCount / columnNum) * ITEM_HEIGHT;
|
|
41
|
+
const heightOfVisibleItems = Math.min(visibleItemsCount / columnNum, seriesCount) * ITEM_HEIGHT;
|
|
42
|
+
const seriesHeight = (shouldFillAvailableSpace ? heightOfAvailableSpace : heightOfVisibleItems) + labelHeight;
|
|
43
|
+
const [start, end] = getPagingValues(page, visibleItemsCount, series.length, hasCustomComponent);
|
|
44
|
+
const pagedSeries = series.slice(start, end);
|
|
45
|
+
const visibleItemsFitOneColumn = shouldItemsFitOneColumn(visibleItemsCount, columnNum, pagedSeries.length);
|
|
46
|
+
const classNames = cx("viz-legend", "static", `position-${position}`, {
|
|
47
|
+
"no-width": !shouldDisplayCustomComponent && visibleItemsFitOneColumn,
|
|
48
|
+
});
|
|
49
|
+
// Without paging
|
|
50
|
+
if (position === TOP || position === BOTTOM) {
|
|
51
|
+
return (React.createElement("div", { className: classNames },
|
|
52
|
+
React.createElement(LegendSeries, { series: series, label: label, onToggleItem: onItemClick ?? noop },
|
|
53
|
+
React.createElement(LegendList, { enableBorderRadius: enableBorderRadius, series: series, onItemClick: onItemClick ?? noop }))));
|
|
85
54
|
}
|
|
86
|
-
}
|
|
55
|
+
return (React.createElement("div", { className: classNames },
|
|
56
|
+
React.createElement(LegendSeries, { series: pagedSeries, label: label, style: { height: seriesHeight }, onToggleItem: onItemClick ?? noop },
|
|
57
|
+
labelNode,
|
|
58
|
+
shouldDisplayCustomComponent ? (customComponent) : (React.createElement(LegendList, { enableBorderRadius: enableBorderRadius, series: pagedSeries, onItemClick: onItemClick ?? noop }))),
|
|
59
|
+
usePaging ? (React.createElement(Paging, { page: page, pagesCount: pagesCount, showNextPage: handleNextPage, showPrevPage: handlePreviousPage, buttonsOrientation: buttonOrientation })) : null));
|
|
60
|
+
});
|
|
61
|
+
const getPagesCount = (seriesLength, visibleItemsCount, hasCustomComponent) => {
|
|
62
|
+
const defaultPagesCount = Math.ceil(seriesLength / visibleItemsCount);
|
|
63
|
+
return hasCustomComponent ? defaultPagesCount + 1 : defaultPagesCount;
|
|
64
|
+
};
|
|
87
65
|
export const getPagingValues = (page, visibleItemsCount, seriesLength, hasCustomComponent) => {
|
|
88
66
|
const start = hasCustomComponent ? (page - 2) * visibleItemsCount : (page - 1) * visibleItemsCount;
|
|
89
67
|
const end = hasCustomComponent
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StaticLegend.js","sourceRoot":"","sources":["../../src/legend/StaticLegend.tsx"],"names":[],"mappings":"AAAA,qCAAqC;AACrC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,IAAI,MAAM,gBAAgB,CAAC;AAClC,OAAO,
|
|
1
|
+
{"version":3,"file":"StaticLegend.js","sourceRoot":"","sources":["../../src/legend/StaticLegend.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { ISeriesItem } from "./types.js";
|
|
2
|
+
export declare const useLegendSeriesContextValue: ({ series, focusedIndex, id, }: {
|
|
3
|
+
series: ISeriesItem[];
|
|
4
|
+
focusedIndex: number;
|
|
5
|
+
id: string;
|
|
6
|
+
}) => {
|
|
7
|
+
focusedItem: ISeriesItem;
|
|
8
|
+
makeItemId: (item?: ISeriesItem) => string | undefined;
|
|
9
|
+
descriptionId: string;
|
|
10
|
+
};
|
|
11
|
+
export declare const LegendSeriesContextStore: import("@gooddata/sdk-ui").IContextStore<{
|
|
12
|
+
focusedItem: ISeriesItem;
|
|
13
|
+
makeItemId: (item?: ISeriesItem) => string | undefined;
|
|
14
|
+
descriptionId: string;
|
|
15
|
+
}>;
|
|
16
|
+
//# sourceMappingURL=context.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../src/legend/context.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAIzC,eAAO,MAAM,2BAA2B;YAK5B,WAAW,EAAE;kBACP,MAAM;QAChB,MAAM;;;wBAKE,WAAW;;CAY1B,CAAC;AAEF,eAAO,MAAM,wBAAwB;;wBAdrB,WAAW;;EAe2D,CAAC"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
// (C) 2025 GoodData Corporation
|
|
2
|
+
import React from "react";
|
|
3
|
+
import { createContextStore } from "@gooddata/sdk-ui";
|
|
4
|
+
export const useLegendSeriesContextValue = ({ series, focusedIndex, id, }) => {
|
|
5
|
+
const descriptionId = `${id}-description`;
|
|
6
|
+
const makeItemId = React.useCallback((item) => item && `${id}-${series.indexOf(item)}`, [id, series]);
|
|
7
|
+
return React.useMemo(() => ({
|
|
8
|
+
focusedItem: series[focusedIndex],
|
|
9
|
+
makeItemId,
|
|
10
|
+
descriptionId,
|
|
11
|
+
}), [descriptionId, focusedIndex, makeItemId, series]);
|
|
12
|
+
};
|
|
13
|
+
export const LegendSeriesContextStore = createContextStore("LegendSeries");
|
|
14
|
+
//# sourceMappingURL=context.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"context.js","sourceRoot":"","sources":["../../src/legend/context.ts"],"names":[],"mappings":"AAAA,gCAAgC;AAGhC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAEtD,MAAM,CAAC,MAAM,2BAA2B,GAAG,CAAC,EACxC,MAAM,EACN,YAAY,EACZ,EAAE,GAKL,EAAE,EAAE;IACD,MAAM,aAAa,GAAG,GAAG,EAAE,cAAc,CAAC;IAE1C,MAAM,UAAU,GAAG,KAAK,CAAC,WAAW,CAChC,CAAC,IAAkB,EAAE,EAAE,CAAC,IAAI,IAAI,GAAG,EAAE,IAAI,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,EAC/D,CAAC,EAAE,EAAE,MAAM,CAAC,CACf,CAAC;IAEF,OAAO,KAAK,CAAC,OAAO,CAChB,GAAG,EAAE,CAAC,CAAC;QACH,WAAW,EAAE,MAAM,CAAC,YAAY,CAAC;QACjC,UAAU;QACV,aAAa;KAChB,CAAC,EACF,CAAC,aAAa,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,CAAC,CACpD,CAAC;AACN,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,wBAAwB,GACjC,kBAAkB,CAAiD,cAAc,CAAC,CAAC"}
|
package/esm/legend/helpers.js
CHANGED
package/esm/legend/types.d.ts
CHANGED
|
@@ -94,4 +94,19 @@ export type ItemBorderRadiusPredicate = (item: any) => boolean;
|
|
|
94
94
|
* @internal
|
|
95
95
|
*/
|
|
96
96
|
export type IColorLegendSize = "large" | "medium" | "small";
|
|
97
|
+
/**
|
|
98
|
+
* The items can have many different properties, the data can come from many different sources.
|
|
99
|
+
* The components like to use a lot of `any` for the item types, which poisons the type checking further down.
|
|
100
|
+
* These are the keys that are definitely used in different cases, but the whole type situation here could use a lot of work.
|
|
101
|
+
*
|
|
102
|
+
* @internal
|
|
103
|
+
*/
|
|
104
|
+
export type ISeriesItem = {
|
|
105
|
+
isVisible?: boolean;
|
|
106
|
+
name?: string;
|
|
107
|
+
color?: string;
|
|
108
|
+
type?: string;
|
|
109
|
+
labelKey?: string;
|
|
110
|
+
data?: string[];
|
|
111
|
+
};
|
|
97
112
|
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/legend/types.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,eAAO,MAAM,cAAc,EAAE;IAAE,CAAC,IAAI,EAAE,MAAM,GAAG,YAAY,CAAA;CAM1D,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,wBAAwB,EAAE,YAAY,EAAuC,CAAC;AAE3F;;GAEG;AACH,MAAM,WAAW,cAAc;IAC3B,OAAO,EAAE,OAAO,CAAC;IACjB,aAAa,EAAE,OAAO,CAAC;IACvB,QAAQ,EAAE,YAAY,CAAC;IACvB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,qBAAqB,EAAE,CAAC;IAC/B,UAAU,CAAC,EAAE,OAAO,GAAG,uBAAuB,CAAC;IAC/C,kBAAkB,CAAC,EAAE,OAAO,GAAG,yBAAyB,CAAC;IACzD,YAAY,CAAC,EAAE,CAAC,aAAa,EAAE,GAAG,KAAK,GAAG,CAAC;CAC9C;AAED;;GAEG;AACH,MAAM,MAAM,qBAAqB,GAAG,eAAe,GAAG,kBAAkB,CAAC;AAEzE;;GAEG;AACH,MAAM,WAAW,eAAe;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;CACjB;AAED;;GAEG;AACH,MAAM,WAAW,kBAAkB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;CACvB;AAED;;GAEG;AACH,MAAM,WAAW,gBAAgB;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACjB;AAED;;GAEG;AACH,MAAM,WAAW,mBAAmB;IAChC,SAAS,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC/B,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;CACvB;AAED;;GAEG;AACH,MAAM,WAAW,MAAM;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,EAAE,MAAM,CAAC;CACd;AAED;;GAEG;AACH,eAAO,MAAM,qBAAqB;;;CAGjC,CAAC;AAEF;;GAEG;AACH,MAAM,WAAW,0BAA0B;IACvC,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;CACvB;AAED;;;GAGG;AACH,MAAM,MAAM,YAAY,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,GAAG,MAAM,CAAC;AAExE;;GAEG;AACH,MAAM,MAAM,yBAAyB,GAAG,CAAC,IAAI,EAAE,GAAG,KAAK,OAAO,CAAC;AAE/D;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC"}
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/legend/types.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,eAAO,MAAM,cAAc,EAAE;IAAE,CAAC,IAAI,EAAE,MAAM,GAAG,YAAY,CAAA;CAM1D,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,wBAAwB,EAAE,YAAY,EAAuC,CAAC;AAE3F;;GAEG;AACH,MAAM,WAAW,cAAc;IAC3B,OAAO,EAAE,OAAO,CAAC;IACjB,aAAa,EAAE,OAAO,CAAC;IACvB,QAAQ,EAAE,YAAY,CAAC;IACvB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,qBAAqB,EAAE,CAAC;IAC/B,UAAU,CAAC,EAAE,OAAO,GAAG,uBAAuB,CAAC;IAC/C,kBAAkB,CAAC,EAAE,OAAO,GAAG,yBAAyB,CAAC;IACzD,YAAY,CAAC,EAAE,CAAC,aAAa,EAAE,GAAG,KAAK,GAAG,CAAC;CAC9C;AAED;;GAEG;AACH,MAAM,MAAM,qBAAqB,GAAG,eAAe,GAAG,kBAAkB,CAAC;AAEzE;;GAEG;AACH,MAAM,WAAW,eAAe;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;CACjB;AAED;;GAEG;AACH,MAAM,WAAW,kBAAkB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;CACvB;AAED;;GAEG;AACH,MAAM,WAAW,gBAAgB;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACjB;AAED;;GAEG;AACH,MAAM,WAAW,mBAAmB;IAChC,SAAS,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC/B,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;CACvB;AAED;;GAEG;AACH,MAAM,WAAW,MAAM;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,EAAE,MAAM,CAAC;CACd;AAED;;GAEG;AACH,eAAO,MAAM,qBAAqB;;;CAGjC,CAAC;AAEF;;GAEG;AACH,MAAM,WAAW,0BAA0B;IACvC,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;CACvB;AAED;;;GAGG;AACH,MAAM,MAAM,YAAY,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,GAAG,MAAM,CAAC;AAExE;;GAEG;AACH,MAAM,MAAM,yBAAyB,GAAG,CAAC,IAAI,EAAE,GAAG,KAAK,OAAO,CAAC;AAE/D;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAE5D;;;;;;GAMG;AACH,MAAM,MAAM,WAAW,GAAG;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC;CACnB,CAAC"}
|
package/esm/legend/types.js
CHANGED
|
@@ -372,13 +372,13 @@ export declare interface ILegendProps {
|
|
|
372
372
|
height?: number;
|
|
373
373
|
position: string;
|
|
374
374
|
heatmapLegend?: boolean;
|
|
375
|
-
series:
|
|
375
|
+
series: ISeriesItem[];
|
|
376
376
|
seriesMapper?: (visibleSeries: any) => any;
|
|
377
377
|
format?: string;
|
|
378
378
|
locale?: string;
|
|
379
379
|
showFluidLegend?: boolean;
|
|
380
380
|
enableBorderRadius?: boolean | ItemBorderRadiusPredicate;
|
|
381
|
-
onItemClick(item:
|
|
381
|
+
onItemClick(item: ISeriesItem): void;
|
|
382
382
|
validateOverHeight(legendClient: Rect): void;
|
|
383
383
|
contentDimensions: {
|
|
384
384
|
width: number;
|
|
@@ -402,8 +402,8 @@ export declare interface IPagingProps {
|
|
|
402
402
|
* @internal
|
|
403
403
|
*/
|
|
404
404
|
export declare interface IPopUpLegendProps {
|
|
405
|
-
series:
|
|
406
|
-
onLegendItemClick: (item:
|
|
405
|
+
series: ISeriesItem[];
|
|
406
|
+
onLegendItemClick: (item: ISeriesItem) => void;
|
|
407
407
|
name?: string;
|
|
408
408
|
maxRows?: number;
|
|
409
409
|
enableBorderRadius?: boolean | ItemBorderRadiusPredicate;
|
|
@@ -436,20 +436,37 @@ export declare interface IRange {
|
|
|
436
436
|
*/
|
|
437
437
|
export declare function isCustomPalette(palette: IColorPalette): boolean;
|
|
438
438
|
|
|
439
|
+
/**
|
|
440
|
+
* The items can have many different properties, the data can come from many different sources.
|
|
441
|
+
* The components like to use a lot of `any` for the item types, which poisons the type checking further down.
|
|
442
|
+
* These are the keys that are definitely used in different cases, but the whole type situation here could use a lot of work.
|
|
443
|
+
*
|
|
444
|
+
* @internal
|
|
445
|
+
*/
|
|
446
|
+
export declare type ISeriesItem = {
|
|
447
|
+
isVisible?: boolean;
|
|
448
|
+
name?: string;
|
|
449
|
+
color?: string;
|
|
450
|
+
type?: string;
|
|
451
|
+
labelKey?: string;
|
|
452
|
+
data?: string[];
|
|
453
|
+
};
|
|
454
|
+
|
|
439
455
|
/**
|
|
440
456
|
* @internal
|
|
441
457
|
*/
|
|
442
458
|
export declare interface IStaticLegendProps {
|
|
443
459
|
containerHeight: number;
|
|
444
460
|
position: string;
|
|
445
|
-
series:
|
|
461
|
+
series: ISeriesItem[];
|
|
446
462
|
enableBorderRadius?: boolean | ItemBorderRadiusPredicate;
|
|
447
463
|
shouldFillAvailableSpace?: boolean;
|
|
448
464
|
label?: string;
|
|
449
465
|
buttonOrientation?: ButtonsOrientationType;
|
|
450
|
-
onItemClick?(item: IPushpinCategoryLegendItem): void;
|
|
451
466
|
paginationHeight?: number;
|
|
452
467
|
customComponent?: JSX.Element | null;
|
|
468
|
+
isLabelVisible?: boolean;
|
|
469
|
+
onItemClick?(item: ISeriesItem): void;
|
|
453
470
|
onPageChanged?: (page: number) => void;
|
|
454
471
|
}
|
|
455
472
|
|
|
@@ -475,7 +492,7 @@ export declare class Legend extends React_2.PureComponent<ILegendProps> {
|
|
|
475
492
|
isLegendOverHeight: boolean;
|
|
476
493
|
enableBorderRadius: boolean;
|
|
477
494
|
};
|
|
478
|
-
onItemClick: (item:
|
|
495
|
+
onItemClick: (item: ISeriesItem) => void;
|
|
479
496
|
getSeries: () => any;
|
|
480
497
|
renderPopUpLegend: () => React_2.ReactNode;
|
|
481
498
|
renderFluid: () => React_2.ReactNode;
|
|
@@ -545,18 +562,7 @@ export declare function shouldShowFluid(documentObj: Document): boolean;
|
|
|
545
562
|
/**
|
|
546
563
|
* @internal
|
|
547
564
|
*/
|
|
548
|
-
export declare
|
|
549
|
-
static defaultProps: Pick<IStaticLegendProps, "buttonOrientation" | "paginationHeight" | "onPageChanged">;
|
|
550
|
-
state: {
|
|
551
|
-
page: number;
|
|
552
|
-
};
|
|
553
|
-
showNextPage: () => void;
|
|
554
|
-
showPrevPage: () => void;
|
|
555
|
-
renderPaging: (pagesCount: number) => React_2.ReactNode;
|
|
556
|
-
render(): React_2.JSX.Element;
|
|
557
|
-
private getPagesCount;
|
|
558
|
-
private hasCustomComponent;
|
|
559
|
-
}
|
|
565
|
+
export declare const StaticLegend: React_2.NamedExoticComponent<IStaticLegendProps>;
|
|
560
566
|
|
|
561
567
|
/**
|
|
562
568
|
* @internal
|