Merge pull request #15 from script-development/fix/toast-container-fragment

fix(toast): wrap container in single root element

Author: Goosterhof

packages/toast/CHANGELOG.md

@@ -0,0 +1,7 @@
+# @script-development/fs-toast
+
+## 0.1.1
+
+### Patch Changes
+
+- Fix ToastContainerComponent rendering a fragment instead of a single root element. Vue drops fallthrough attributes on fragment components, so positioning classes applied directly on `<component :is="ToastContainerComponent" />` were silently lost. The container now wraps toasts in a `<div>`, enabling proper attribute inheritance.

packages/toast/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@script-development/fs-toast",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "Component-agnostic toast queue service for Vue 3 — FIFO management, you bring the component",
   "license": "UNLICENSED",
   "repository": {

packages/toast/src/index.ts

@@ -54,7 +54,11 @@ export const createToastService = <C extends Component>(
   const ToastContainerComponent = defineComponent({
     name: "ToastContainer",
     render() {
-      return toasts.value.map((toast) => toast.node);
+      return h(
+        "div",
+        null,
+        toasts.value.map((toast) => toast.node),
+      );
     },
   });