[MultiSelect] stop propagation of onclose event when removing items

[tyforcode]

🔗 Related issue (optional)

Closes #1948

---

📑 Description

When MultiSelect is used inside of a Modal, the Modal's onclose event is incorrectly triggered when an item is removed from MultiSelect. These items use the Badge component who's internal close() function bubbles up by default.

This PR remediates this by stopping propagation of the onclose event on the container of the MultiSelect component

---

🔍 PR Type

• Bug fix
• Feature
• Documentation
• Refactor / Code cleanup
• Build / Tooling
• Other (please describe)

---

🚦 PR Status

• Draft (work in progress, not ready for review)
• Ready for review ✅

---

✅ Checklist

• My code follows the existing code style
• I have run pnpm lint && pnpm check && pnpm test:e2e and all tests pass
• CoderabbitAI review has been completed and actionable suggestions were reviewed
• I have updated documentation if my changes require it
• My PR is based on the latest main branch (not the published npm version)
• I have checked accessibility where applicable (ARIA, keyboard nav, etc.)
• I have reviewed the rendered component in the browser

---

🧪 Screenshots / Demos (optional)

---

⚠️ Breaking Changes (optional)

---

ℹ️ Additional Information

Summary by CodeRabbit

• Bug Fixes
  • Fixed an issue where closing items in MultiSelect components could inadvertently trigger close handlers in parent elements.

[vercel]

Someone is attempting to deploy a commit to the Bergside Team on Vercel.

A member of the Team first needs to authorize it.

[coderabbitai]

📝 Walkthrough

Walkthrough

MultiSelect's root element now explicitly stops onclose events from propagating beyond the component container using onclose={(e) => e.stopPropagation()}. This prevents badge item removal from triggering unintended close handlers on parent components such as modals.

Changes

Event Propagation Control

Layer / File(s)	Summary
Stop onclose event propagation src/lib/forms/select/MultiSelect.svelte	Root element adds an onclose handler that calls e.stopPropagation(), preventing close events triggered by removing selected items from bubbling to parent components.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~5 minutes

Possibly related PRs

• themesberg/flowbite-svelte#1431: Modifies MultiSelect event handling on the root container to prevent child interactions from triggering unintended dropdown behavior.
• themesberg/flowbite-svelte#1922: Directly related changes to MultiSelect's open/close lifecycle event handling to prevent unintended Modal closure when items are removed.

Poem

🐰 A badge's farewell no longer rings,
Through Modal walls in echoing strings,
StopPropagation's gentle hand,
Keeps close events where they should stand!

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly summarizes the main change: stopping propagation of the onclose event in MultiSelect when removing items, which directly addresses the issue.
Linked Issues check	✅ Passed	The code changes directly address issue #1948 by stopping propagation of the onclose event on the MultiSelect container, preventing the Modal's onclose handler from being triggered when items are removed.
Out of Scope Changes check	✅ Passed	All changes are focused solely on fixing the event propagation issue in MultiSelect, with no unrelated modifications to other components or functionality.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Description check	✅ Passed	The PR description is comprehensive and follows the template structure, including a clear issue reference, detailed problem description, bug fix classification, completed checklist, and status marking.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

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 and usage tips.}