@kiva/kv-components 3.102.3 → 3.102.4
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 +11 -0
- package/package.json +2 -2
- package/vue/KvPieChart.vue +7 -2
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,17 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [3.102.4](https://github.com/kiva/kv-ui-elements/compare/@kiva/kv-components@3.102.3...@kiva/kv-components@3.102.4) (2024-10-04)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Bug Fixes
|
|
10
|
+
|
|
11
|
+
* pie chart not animating in vue 3 ([c15efec](https://github.com/kiva/kv-ui-elements/commit/c15efec2cebf39fcafaa0eb533bd6ef8ffab2d6d))
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
|
|
6
17
|
## [3.102.3](https://github.com/kiva/kv-ui-elements/compare/@kiva/kv-components@3.102.2...@kiva/kv-components@3.102.3) (2024-09-30)
|
|
7
18
|
|
|
8
19
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kiva/kv-components",
|
|
3
|
-
"version": "3.102.
|
|
3
|
+
"version": "3.102.4",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
@@ -83,5 +83,5 @@
|
|
|
83
83
|
"optional": true
|
|
84
84
|
}
|
|
85
85
|
},
|
|
86
|
-
"gitHead": "
|
|
86
|
+
"gitHead": "9d819f1b11475de5c5f728409069c241f399cc0f"
|
|
87
87
|
}
|
package/vue/KvPieChart.vue
CHANGED
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
v-for="(slice, index) in slices"
|
|
24
24
|
:key="index"
|
|
25
25
|
class="tw-origin-center tw-transition-transform"
|
|
26
|
-
:style="
|
|
26
|
+
:style="isSliceActive(slice) ? { transform: 'scale(1.1)' } : {}"
|
|
27
27
|
:d="slice.path"
|
|
28
28
|
:stroke="slice.color"
|
|
29
29
|
:stroke-width="lineWidth"
|
|
@@ -174,7 +174,7 @@ export default {
|
|
|
174
174
|
const end = start + value.percent;
|
|
175
175
|
const [startX, startY] = circumPointFromAngle(cX, cY, r, start * Math.PI * 2);
|
|
176
176
|
let path = `M ${startX},${startY} `;
|
|
177
|
-
if (value.percent
|
|
177
|
+
if (value.percent > 0.99) {
|
|
178
178
|
// Draw a full circle in two arcs
|
|
179
179
|
const [midX, midY] = circumPointFromAngle(cX, cY, r, (start + end) * Math.PI);
|
|
180
180
|
path += `A ${r},${r} 0 0,1 ${midX},${midY} `;
|
|
@@ -210,6 +210,10 @@ export default {
|
|
|
210
210
|
}
|
|
211
211
|
};
|
|
212
212
|
|
|
213
|
+
const isSliceActive = (slice) => {
|
|
214
|
+
return activeSlice.value === slice;
|
|
215
|
+
};
|
|
216
|
+
|
|
213
217
|
const setActiveSlice = (slice) => {
|
|
214
218
|
activeSlice.value = slice;
|
|
215
219
|
emit('click', slice.label);
|
|
@@ -228,6 +232,7 @@ export default {
|
|
|
228
232
|
pageCount,
|
|
229
233
|
prevPage,
|
|
230
234
|
nextPage,
|
|
235
|
+
isSliceActive,
|
|
231
236
|
setActiveSlice,
|
|
232
237
|
};
|
|
233
238
|
},
|