From 9900bc745273e94482e0436f5d446f1ba17bbd90 Mon Sep 17 00:00:00 2001 From: Alec Lloyd Probert <55991794+graphieros@users.noreply.github.com> Date: Sat, 3 Oct 2026 17:01:32 +0000 Subject: [PATCH 1/3] chore(deps): bump vue-data-ui from 3.25.13 to 3.26.1 (#3301) Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com> --- app/components/Chart/SplitSparkline.vue | 19 ++++++++-- app/components/Package/TrendsChart.vue | 17 ++++++++- .../Package/WeeklyDownloadStats.vue | 8 ++++ i18n/locales/en.json | 4 ++ i18n/locales/fr-FR.json | 38 +++++++++++++++++++ i18n/schema.json | 12 ++++++ package.json | 2 +- pnpm-lock.yaml | 17 ++++++--- pnpm-workspace.yaml | 2 +- shared/utils/trends-chart.ts | 4 ++ 10 files changed, 110 insertions(+), 13 deletions(-) diff --git a/app/components/Chart/SplitSparkline.vue b/app/components/Chart/SplitSparkline.vue index e3fb33a826..9cb6761efd 100644 --- a/app/components/Chart/SplitSparkline.vue +++ b/app/components/Chart/SplitSparkline.vue @@ -59,7 +59,7 @@ const { colors } = useColors(rootEl) const isDarkMode = computed(() => resolvedMode.value === 'dark') -const selectedIndex = ref(null) +const selectedIndex = ref() const isInteracting = ref(false) function isLargeSeries(seriesIndex: number): boolean { @@ -149,7 +149,7 @@ function startInteraction() { function resetHover() { isInteracting.value = false - selectedIndex.value = null + selectedIndex.value = undefined step.value += 1 // required to reset all chart instances } @@ -175,6 +175,7 @@ const configs = computed(() => { : (lightenColor(seriesColor, 0.5) ?? seriesColor) // palette uses hex colours return { + useCursorPointer: true, a11y: { translations: { keyboardNavigation: $t( @@ -230,6 +231,7 @@ const configs = computed(() => { }, line: { color: seriesColor, + strokeWidth: 1, dashIndices, dashArray: 3, cutNullValues: false, @@ -252,14 +254,24 @@ const configs = computed(() => { }, padding: { left: 0, - right: 0, + right: 24, top: 0, bottom: 0, }, + // Drag to zoom + zoom: { + show: true, + resetButton: { + title: $t('package.trends.sparkline_zoom_reset.title'), + ariaLabel: $t('package.trends.sparkline_zoom_reset.aria_label'), + }, + }, }, } }) }) + +const zoomState = ref(null)