feat(carousel): add swipeThreshold input and improve swipe navigation #187

[intermetric]

Summary by CodeRabbit

• New Features

  • Carousel swipes now settle more predictably, accounting for the release position, reachable stops, and quick flicks.
  • Added a configurable swipe threshold, defaulting to 0.3, to control how far users must drag to advance.
  • Canceled gestures return the carousel to its starting position; very short drags stay on the current stop.

• Tests

  • Expanded coverage for swipe thresholds, flicks, cancellation, release movement, and fractional endpoints.

[coderabbitai]

Important

• 🔍 Trigger review

This repository does not receive automatic reviews because it has fewer than 10 stars.

⚙️ Run configuration

Configuration used: Repository: TEDI-Design-System/angular/.coderabbit.yaml

Review profile: CHILL

Plan: Advanced

Run ID: 39ae8b99-1ce9-450d-8f3b-e8121e273556

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 66.67% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 3 functions across 3 files.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Title check	✅ Passed	The title clearly identifies the main changes: adding the swipeThreshold input and improving carousel swipe navigation.

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[github-actions]

♿ Accessibility — ✅ no blocking violations

No accessibility violations in the components changed by this PR.

🔕 Known issues — 19 stories marked todo (warn only)

Stories

• TEDI-Ready/Components/Form/DateField — Open For Visual Test
• TEDI-Ready/Content/Calendar — Availability, Day Statuses, Header Variants, Multiple Selected Dates, No Controls, Range, With Footer, With Weeks Count
• TEDI-Ready/Content/TextGroup — Types
• TEDI-Ready/Layout/Header — Logged In With Sidenav
• TEDI-Ready/Layout/SideNav — Collapsible Toggle, Default, Medium Sidenav Items, Second Level Menu Items, Second Level Menu Items Parents Are Links, Small Sidenav Items, Third Level Menu Items, Third Level Menu Items Parents Are Links

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.

📢 Thoughts on this report? Let us know!

[airikej]

good change, maybe add swipeThreshold to reacts carousel too in the future?

[intermetric]

@airikej

good change, maybe add swipeThreshold to reacts carousel too in the future?

Yup, makes sense. Created an issue: TEDI-Design-System/react#941.

[ly-tempel-bitweb]

MIN_SWIPE_DISTANCE is 10px for every input type. It's reasonable as a touch value, but a mouse drag is more precise, so the carousel can feel sticky with a pointer.
onPointerDown gets a PointerEvent, so we could read ev.pointerType and keep 10 only for touch.
Or is the single value intentional?

[github-actions]

🎨 Chromatic

No visual changes.

Built from 10089bf. Commits pushed after this are not covered; approve again to rebuild.

View the build