@gooddata/sdk-ui-vis-commons 11.53.0-alpha.0 → 11.53.0-alpha.2

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.
@@ -1,5 +1,4 @@
1
1
  import { type ReactElement } from "react";
2
- import { type ITheme } from "@gooddata/sdk-model";
3
2
  import { type IColorLegendBox, type IHeatmapLegendLabel as IColorLegendLabel } from "./helpers.js";
4
3
  import { type IColorLegendItem, type IColorLegendSize } from "./types.js";
5
4
  /**
@@ -11,7 +10,6 @@ export interface IColorLegendProps {
11
10
  position: string;
12
11
  size?: IColorLegendSize;
13
12
  format?: string;
14
- theme?: ITheme;
15
13
  title?: string;
16
14
  }
17
15
  interface IColorLabelsProps {
@@ -25,6 +23,6 @@ export declare function ColorBoxes({ boxes }: IColorBoxesProps): ReactElement;
25
23
  /**
26
24
  * @internal
27
25
  */
28
- export declare const ColorLegend: import("react").ComponentType<Omit<IColorLegendProps, "theme" | "themeIsLoading" | "themeStatus">>;
26
+ export declare function ColorLegend({ title, data, format, numericSymbols, size, position }: IColorLegendProps): import("react/jsx-runtime").JSX.Element | null;
29
27
  export {};
30
28
  //# sourceMappingURL=ColorLegend.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"ColorLegend.d.ts","sourceRoot":"","sources":["../../src/legend/ColorLegend.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,YAAY,EAAkB,MAAM,OAAO,CAAC;AAI1D,OAAO,EAAE,KAAK,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAGlD,OAAO,EACH,KAAK,eAAe,EAEpB,KAAK,mBAAmB,IAAI,iBAAiB,EAEhD,MAAM,cAAc,CAAC;AAEtB,OAAO,EAAE,KAAK,gBAAgB,EAAE,KAAK,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAE1E;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAC9B,IAAI,EAAE,gBAAgB,EAAE,CAAC;IACzB,cAAc,EAAE,MAAM,EAAE,CAAC;IACzB,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,UAAU,iBAAiB;IACvB,MAAM,EAAE,iBAAiB,EAAE,CAAC;CAC/B;AAED,UAAU,gBAAgB;IACtB,KAAK,EAAE,eAAe,EAAE,CAAC;CAC5B;AAQD,wBAAgB,WAAW,CAAC,EAAE,MAAM,EAAE,EAAE,iBAAiB,GAAG,YAAY,CAavE;AAED,wBAAgB,UAAU,CAAC,EAAE,KAAK,EAAE,EAAE,gBAAgB,GAAG,YAAY,CAUpE;AA+BD;;GAEG;AACH,eAAO,MAAM,WAAW,oGA6BtB,CAAC"}
1
+ {"version":3,"file":"ColorLegend.d.ts","sourceRoot":"","sources":["../../src/legend/ColorLegend.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,YAAY,EAAkB,MAAM,OAAO,CAAC;AAM1D,OAAO,EACH,KAAK,eAAe,EAEpB,KAAK,mBAAmB,IAAI,iBAAiB,EAEhD,MAAM,cAAc,CAAC;AAEtB,OAAO,EAAE,KAAK,gBAAgB,EAAE,KAAK,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAE1E;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAC9B,IAAI,EAAE,gBAAgB,EAAE,CAAC;IACzB,cAAc,EAAE,MAAM,EAAE,CAAC;IACzB,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,UAAU,iBAAiB;IACvB,MAAM,EAAE,iBAAiB,EAAE,CAAC;CAC/B;AAED,UAAU,gBAAgB;IACtB,KAAK,EAAE,eAAe,EAAE,CAAC;CAC5B;AAQD,wBAAgB,WAAW,CAAC,EAAE,MAAM,EAAE,EAAE,iBAAiB,GAAG,YAAY,CAavE;AAED,wBAAgB,UAAU,CAAC,EAAE,KAAK,EAAE,EAAE,gBAAgB,GAAG,YAAY,CAUpE;AA+BD;;GAEG;AACH,wBAAgB,WAAW,CAAC,EACxB,KAAK,EACL,IAAI,EACJ,MAAM,EACN,cAAc,EACd,IAAc,EACd,QAAQ,EACX,EAAE,iBAAiB,kDA8BnB"}
@@ -1,6 +1,6 @@
1
1
  import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import cx from "classnames";
3
- import { withTheme } from "@gooddata/sdk-ui-theme-provider";
3
+ import { useTheme } from "@gooddata/sdk-ui-theme-provider";
4
4
  import { getColorLegendConfiguration, } from "./helpers.js";
5
5
  import { BOTTOM, TOP } from "./PositionTypes.js";
6
6
  export function ColorLabels({ labels }) {
@@ -29,8 +29,8 @@ function LegendWithTitle({ title, position, children, }) {
29
29
  /**
30
30
  * @internal
31
31
  */
32
- export const ColorLegend = withTheme((colorLegendProps) => {
33
- const { title, data, format, numericSymbols, size = "large", position, theme } = colorLegendProps;
32
+ export function ColorLegend({ title, data, format, numericSymbols, size = "large", position, }) {
33
+ const theme = useTheme();
34
34
  if (!data.length) {
35
35
  return null;
36
36
  }
@@ -39,4 +39,4 @@ export const ColorLegend = withTheme((colorLegendProps) => {
39
39
  const renderLabelsFirst = config.position === TOP;
40
40
  const { boxes, labels } = config;
41
41
  return (_jsx("div", { className: classes, "data-testid": "color-legend", children: title ? (_jsx(LegendWithTitle, { title: title, position: position, children: _jsx(LegendBoxes, { renderLabelsFirst: renderLabelsFirst, boxes: boxes, labels: labels }) })) : (_jsx(LegendBoxes, { renderLabelsFirst: renderLabelsFirst, boxes: boxes, labels: labels })) }));
42
- });
42
+ }
@@ -1,4 +1,3 @@
1
- import { type ITheme } from "@gooddata/sdk-model";
2
1
  import { type ChartFillType } from "../coloring/types.js";
3
2
  import { type ISeriesItemMetric } from "./types.js";
4
3
  interface ILegendItemProps {
@@ -7,9 +6,8 @@ interface ILegendItemProps {
7
6
  width?: number;
8
7
  enableBorderRadius?: boolean;
9
8
  onItemClick: (item: ISeriesItemMetric) => void;
10
- theme?: ITheme;
11
9
  chartFill?: ChartFillType;
12
10
  }
13
- export declare const LegendItem: import("react").ComponentType<Omit<ILegendItemProps, "theme" | "themeIsLoading" | "themeStatus">>;
11
+ export declare function LegendItem({ item, index, width, enableBorderRadius, onItemClick, chartFill }: ILegendItemProps): import("react/jsx-runtime").JSX.Element;
14
12
  export {};
15
13
  //# sourceMappingURL=LegendItem.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"LegendItem.d.ts","sourceRoot":"","sources":["../../src/legend/LegendItem.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,KAAK,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAMlD,OAAO,EAAE,KAAK,aAAa,EAAuB,MAAM,sBAAsB,CAAC;AAI/E,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAIpD,UAAU,gBAAgB;IACtB,IAAI,EAAE,iBAAiB,CAAC;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,WAAW,EAAE,CAAC,IAAI,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,aAAa,CAAC;CAC7B;AAqFD,eAAO,MAAM,UAAU,mGAsGrB,CAAC"}
1
+ {"version":3,"file":"LegendItem.d.ts","sourceRoot":"","sources":["../../src/legend/LegendItem.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAE,KAAK,aAAa,EAAuB,MAAM,sBAAsB,CAAC;AAI/E,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAIpD,UAAU,gBAAgB;IACtB,IAAI,EAAE,iBAAiB,CAAC;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,WAAW,EAAE,CAAC,IAAI,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAC/C,SAAS,CAAC,EAAE,aAAa,CAAC;CAC7B;AAqFD,wBAAgB,UAAU,CAAC,EACvB,IAAI,EACJ,KAAK,EACL,KAAK,EACL,kBAA0B,EAC1B,WAAW,EACX,SAAS,EACZ,EAAE,gBAAgB,2CAgGlB"}
@@ -4,7 +4,7 @@ import { useCallback } from "react";
4
4
  import cx from "classnames";
5
5
  import { unescape } from "lodash-es";
6
6
  import { useIdPrefixed } from "@gooddata/sdk-ui-kit";
7
- import { withTheme } from "@gooddata/sdk-ui-theme-provider";
7
+ import { useTheme } from "@gooddata/sdk-ui-theme-provider";
8
8
  import { getDarkerColor, isPatternObject } from "../coloring/color.js";
9
9
  import { PatternFill } from "../coloring/PatternFill.js";
10
10
  import { LegendSeriesContextStore, useItemVisibility } from "./context.js";
@@ -75,7 +75,8 @@ function getIconStyle(type, chartFill, color, enableBorderRadius, isVisible, poi
75
75
  };
76
76
  }
77
77
  }
78
- export const LegendItem = withTheme(function LegendItem({ item, index, width, enableBorderRadius = false, onItemClick, theme, chartFill, }) {
78
+ export function LegendItem({ item, index, width, enableBorderRadius = false, onItemClick, chartFill, }) {
79
+ const theme = useTheme();
79
80
  const { isFocused, id } = LegendSeriesContextStore.useContextStore((ctx) => ({
80
81
  isFocused: ctx.focusedItem === item,
81
82
  id: ctx.makeItemId(item),
@@ -113,4 +114,4 @@ export const LegendItem = withTheme(function LegendItem({ item, index, width, en
113
114
  return (_jsxs("button", { ref: refCallback, "data-testid": "legend-item", role: "option", "aria-selected": item.isVisible, id: id, style: style, className: cx("series-item", { "series-item--isFocused": isFocused }), onClick: handleItemClick, "aria-labelledby": legendItemId, title: unescape(item.name), tabIndex: -1, children: [
114
115
  _jsx("div", { className: "series-icon", style: iconStyle, children: item.isVisible && isPatternFill && isPatternObject(item.color) ? (_jsx(PatternFill, { patternFill: item.color?.pattern })) : null }), _jsx("div", { id: legendItemId, className: "series-name", style: nameStyle, children: item.name })
115
116
  ] }));
116
- });
117
+ }
@@ -8,7 +8,6 @@
8
8
  * @packageDocumentation
9
9
  */
10
10
 
11
- import { ComponentType } from 'react';
12
11
  import { ContentRect } from 'react-measure';
13
12
  import { DataViewFacade } from '@gooddata/sdk-ui';
14
13
  import { IColor } from '@gooddata/sdk-model';
@@ -119,7 +118,7 @@ export declare type ChartFillType = "solid" | "pattern" | "outline";
119
118
  /**
120
119
  * @internal
121
120
  */
122
- export declare const ColorLegend: ComponentType<Omit<IColorLegendProps, "theme" | "themeIsLoading" | "themeStatus">>;
121
+ export declare function ColorLegend({ title, data, format, numericSymbols, size, position }: IColorLegendProps): JSX.Element | null;
123
122
 
124
123
  /**
125
124
  * @internal
@@ -398,7 +397,6 @@ export declare interface IColorLegendProps {
398
397
  position: string;
399
398
  size?: IColorLegendSize;
400
399
  format?: string;
401
- theme?: ITheme;
402
400
  title?: string;
403
401
  }
404
402
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gooddata/sdk-ui-vis-commons",
3
- "version": "11.53.0-alpha.0",
3
+ "version": "11.53.0-alpha.2",
4
4
  "description": "GoodData.UI SDK - common functionality for different types of visualizations",
5
5
  "license": "MIT",
6
6
  "author": "GoodData Corporation",
@@ -36,11 +36,11 @@
36
36
  "react-intl": "7.1.11",
37
37
  "react-measure": "^2.5.2",
38
38
  "tslib": "2.8.1",
39
- "@gooddata/sdk-model": "11.53.0-alpha.0",
40
- "@gooddata/sdk-backend-spi": "11.53.0-alpha.0",
41
- "@gooddata/sdk-ui": "11.53.0-alpha.0",
42
- "@gooddata/sdk-ui-kit": "11.53.0-alpha.0",
43
- "@gooddata/sdk-ui-theme-provider": "11.53.0-alpha.0"
39
+ "@gooddata/sdk-backend-spi": "11.53.0-alpha.2",
40
+ "@gooddata/sdk-model": "11.53.0-alpha.2",
41
+ "@gooddata/sdk-ui": "11.53.0-alpha.2",
42
+ "@gooddata/sdk-ui-kit": "11.53.0-alpha.2",
43
+ "@gooddata/sdk-ui-theme-provider": "11.53.0-alpha.2"
44
44
  },
45
45
  "devDependencies": {
46
46
  "@microsoft/api-documenter": "^7.17.0",
@@ -81,11 +81,11 @@
81
81
  "typescript": "5.9.3",
82
82
  "vitest": "4.1.8",
83
83
  "vitest-dom": "0.1.1",
84
- "@gooddata/eslint-config": "11.53.0-alpha.0",
85
- "@gooddata/oxlint-config": "11.53.0-alpha.0",
86
- "@gooddata/reference-workspace": "11.53.0-alpha.0",
87
- "@gooddata/sdk-backend-mockingbird": "11.53.0-alpha.0",
88
- "@gooddata/stylelint-config": "11.53.0-alpha.0"
84
+ "@gooddata/eslint-config": "11.53.0-alpha.2",
85
+ "@gooddata/reference-workspace": "11.53.0-alpha.2",
86
+ "@gooddata/oxlint-config": "11.53.0-alpha.2",
87
+ "@gooddata/sdk-backend-mockingbird": "11.53.0-alpha.2",
88
+ "@gooddata/stylelint-config": "11.53.0-alpha.2"
89
89
  },
90
90
  "peerDependencies": {
91
91
  "react": "^18.0.0 || ^19.0.0",