@carbon/charts-vue 1.16.2 → 1.16.3
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/CHANGELOG.md +9 -0
- package/README.md +17 -11
- package/dist/index.mjs +8 -12
- package/dist/index.mjs.map +1 -1
- package/package.json +3 -3
- package/telemetry.yml +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,15 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file. See
|
|
4
4
|
[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## 1.16.3 (2024-06-03)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @carbon/charts-vue
|
|
9
|
+
|
|
10
|
+
# Change Log
|
|
11
|
+
|
|
12
|
+
All notable changes to this project will be documented in this file. See
|
|
13
|
+
[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
14
|
+
|
|
6
15
|
## 1.16.2 (2024-06-03)
|
|
7
16
|
|
|
8
17
|
**Note:** Version bump only for package @carbon/charts-vue
|
package/README.md
CHANGED
|
@@ -1,8 +1,11 @@
|
|
|
1
1
|
# Carbon Charts Vue
|
|
2
2
|
|
|
3
|
-
Carbon Charts Vue is a thin Vue.js wrapper around the vanilla JavaScript `@carbon/charts` component
|
|
3
|
+
Carbon Charts Vue is a thin Vue.js wrapper around the vanilla JavaScript `@carbon/charts` component
|
|
4
|
+
library. The charts are based on D3.js, a peer dependency. This version is for Vue.js ^3.3.0. For
|
|
5
|
+
Vue.js 2.x support, please use `@carbon/charts-vue@latest`.
|
|
4
6
|
|
|
5
|
-
The required styles should be imported from `@carbon/charts-vue/styles.css`. Additional
|
|
7
|
+
The required styles should be imported from `@carbon/charts-vue/styles.css`. Additional
|
|
8
|
+
documentation is provided in the Storybook demos.
|
|
6
9
|
|
|
7
10
|
**[Storybook demos](https://charts.carbondesignsystem.com/vue)**
|
|
8
11
|
|
|
@@ -20,8 +23,7 @@ Run the following command using [npm](https://www.npmjs.com/):
|
|
|
20
23
|
npm install -S @carbon/charts-vue d3 d3-cloud d3-sankey
|
|
21
24
|
```
|
|
22
25
|
|
|
23
|
-
If you prefer [Yarn](https://yarnpkg.com/en/), use the following command
|
|
24
|
-
instead:
|
|
26
|
+
If you prefer [Yarn](https://yarnpkg.com/en/), use the following command instead:
|
|
25
27
|
|
|
26
28
|
```bash
|
|
27
29
|
yarn add @carbon/charts-vue d3 d3-cloud d3-sankey
|
|
@@ -29,17 +31,22 @@ yarn add @carbon/charts-vue d3 d3-cloud d3-sankey
|
|
|
29
31
|
|
|
30
32
|
## Step-by-step instructions
|
|
31
33
|
|
|
32
|
-
Read
|
|
34
|
+
Read
|
|
35
|
+
[Getting Started](https://charts.carbondesignsystem.com/?path=/docs/docs-getting-started-vue--docs)
|
|
33
36
|
|
|
34
37
|
## Storybook and StackBlitz Examples
|
|
35
38
|
|
|
36
39
|
[Sample use cases can be seen here](https://charts.carbondesignsystem.com/vue).
|
|
37
40
|
|
|
38
|
-
**When opening the link above**, click on the **Edit on StackBlitz** button for each demo to see an
|
|
41
|
+
**When opening the link above**, click on the **Edit on StackBlitz** button for each demo to see an
|
|
42
|
+
isolated project showing you how to reproduce the demo.
|
|
39
43
|
|
|
40
44
|
## Charting data & options
|
|
41
45
|
|
|
42
|
-
Although new charts will be introduced in the future (such as a choropleth), data and options follow
|
|
46
|
+
Although new charts will be introduced in the future (such as a choropleth), data and options follow
|
|
47
|
+
the same model for all charts with minor exceptions. For example, in the case of a donut chart,
|
|
48
|
+
you're able to pass in an additional field called `center` in your options to configure the donut
|
|
49
|
+
center.
|
|
43
50
|
|
|
44
51
|
For instructions on using the **tabular data format**, see
|
|
45
52
|
[here](https://charts.carbondesignsystem.com/vue/?path=/docs/docs-tutorials-tabular-data-format--docs)
|
|
@@ -49,9 +56,8 @@ Customizable options (specific to chart type) can be found
|
|
|
49
56
|
|
|
50
57
|
## <picture><source height="20" width="20" media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/ibm-telemetry/telemetry-js/main/docs/images/ibm-telemetry-dark.svg"><source height="20" width="20" media="(prefers-color-scheme: light)" srcset="https://raw.githubusercontent.com/ibm-telemetry/telemetry-js/main/docs/images/ibm-telemetry-light.svg"><img height="20" width="20" alt="IBM Telemetry" src="https://raw.githubusercontent.com/ibm-telemetry/telemetry-js/main/docs/images/ibm-telemetry-light.svg"></picture> IBM Telemetry
|
|
51
58
|
|
|
52
|
-
This package uses IBM Telemetry to collect metrics data. By installing this
|
|
53
|
-
|
|
54
|
-
see
|
|
59
|
+
This package uses IBM Telemetry to collect metrics data. By installing this package as a dependency
|
|
60
|
+
you are agreeing to telemetry collection. To opt out, see
|
|
55
61
|
[Opting out of IBM Telemetry data collection](https://github.com/ibm-telemetry/telemetry-js/tree/main#opting-out-of-ibm-telemetry-data-collection).
|
|
56
62
|
For more information on the data being collected, please see the
|
|
57
|
-
[IBM Telemetry documentation](https://github.com/ibm-telemetry/telemetry-js/tree/main#ibm-telemetry-collection-basics).
|
|
63
|
+
[IBM Telemetry documentation](https://github.com/ibm-telemetry/telemetry-js/tree/main#ibm-telemetry-collection-basics).
|
package/dist/index.mjs
CHANGED
|
@@ -13628,7 +13628,12 @@ const Us = (e) => Tu.sanitize(e, {
|
|
|
13628
13628
|
}
|
|
13629
13629
|
// special button config for overflow button
|
|
13630
13630
|
getOverflowButtonConfig() {
|
|
13631
|
-
const { moreOptions: t } = x(
|
|
13631
|
+
const { moreOptions: t } = x(
|
|
13632
|
+
this.model.getOptions(),
|
|
13633
|
+
"locale",
|
|
13634
|
+
"translations",
|
|
13635
|
+
"toolbar"
|
|
13636
|
+
);
|
|
13632
13637
|
return {
|
|
13633
13638
|
id: "toolbar-overflow-menu",
|
|
13634
13639
|
title: t,
|
|
@@ -13652,12 +13657,7 @@ const Us = (e) => Tu.sanitize(e, {
|
|
|
13652
13657
|
makeFullScreen: d,
|
|
13653
13658
|
exitFullScreen: h,
|
|
13654
13659
|
showAsTable: f
|
|
13655
|
-
} = x(
|
|
13656
|
-
i,
|
|
13657
|
-
"locale",
|
|
13658
|
-
"translations",
|
|
13659
|
-
"toolbar"
|
|
13660
|
-
);
|
|
13660
|
+
} = x(i, "locale", "translations", "toolbar");
|
|
13661
13661
|
let p;
|
|
13662
13662
|
switch (t) {
|
|
13663
13663
|
case Et.ZOOM_IN:
|
|
@@ -15552,11 +15552,7 @@ class Cu extends dt {
|
|
|
15552
15552
|
d,
|
|
15553
15553
|
() => this.services.domUtils.getElementOffset(m)
|
|
15554
15554
|
);
|
|
15555
|
-
v = this.addOffsetByPlacement(
|
|
15556
|
-
v,
|
|
15557
|
-
d,
|
|
15558
|
-
f
|
|
15559
|
-
), this.positionService.setElement(s, v);
|
|
15555
|
+
v = this.addOffsetByPlacement(v, d, f), this.positionService.setElement(s, v);
|
|
15560
15556
|
return;
|
|
15561
15557
|
}
|
|
15562
15558
|
let p = x(t, "detail", "mousePosition");
|