@retoo/borda 0.1.0 → 0.1.1

package/dist/borda.cjs.js

@@ -8442,11 +8442,9 @@ function useTooltipPosition({ getTargetElement, getTooltipElement, getPlacement,
 	const padding = /* @__PURE__ */ user_derived(getPadding);
 	const autoPlacement = /* @__PURE__ */ user_derived(getAutoPlacement);
 	const arrowSide = /* @__PURE__ */ user_derived(getArrowSide);
-	user_effect(() => {
+	/** Reads the live target/tooltip rects and writes the resolved position into state. */
+	function recompute() {
 		if (!get(target) || !get(tooltip)) return;
-		/** Re-run on scroll so auto-flip/shift recompute against the live viewport. */
-		scroll.x;
-		scroll.y;
 		const layout = useTooltipLayout({
 			target: get(target),
 			tooltip: get(tooltip),
@@ -8465,6 +8463,19 @@ function useTooltipPosition({ getTargetElement, getTooltipElement, getPlacement,
 		set(left, layout.position.left, true);
 		set(effectivePlacement, layout.placement, true);
 		set(arrowOffset, layout.arrowOffset, true);
+	}
+	user_effect(() => {
+		if (!get(tooltip)) return;
+		/** Re-run when the tooltip's own size changes (e.g. an image finishes loading). */
+		const observer = new ResizeObserver(recompute);
+		observer.observe(get(tooltip));
+		return () => observer.disconnect();
+	});
+	user_effect(() => {
+		/** Re-run on scroll so auto-flip/shift recompute against the live viewport. */
+		scroll.x;
+		scroll.y;
+		recompute();
 	});
 	return {
 		get top() {
@@ -8949,9 +8960,8 @@ function Borda($$anchor, $$props) {
 		getDuration: () => $$props.animation.overlay.transitionDuration
 	});
 	useFocusTrap({ getContainer: () => get(bordaContainer)?.getElements()?.root ?? null });
-	const size = /* @__PURE__ */ user_derived(() => $$props.config.size);
-	const shape = /* @__PURE__ */ user_derived(() => $$props.config.shape);
 	const rootClasses = /* @__PURE__ */ user_derived(() => ["rb"]);
+	/** Container chrome isn't per-step content, so it always tracks the live config. */
 	const containerProps = /* @__PURE__ */ user_derived(() => ({
 		...$$props.config.container,
 		customClasses: {
@@ -8959,13 +8969,6 @@ function Borda($$anchor, $$props) {
 			root: [$$props.config.container?.customClasses?.root, containerAnimator.classes]
 		}
 	}));
-	const tourOverlayProps = /* @__PURE__ */ user_derived(() => $$props.config.tourOverlay);
-	const tourTooltipProps = /* @__PURE__ */ user_derived(() => $$props.config.tourTooltip);
-	const tourImageProps = /* @__PURE__ */ user_derived(() => $$props.config.tourImage);
-	const tourButtonsProps = /* @__PURE__ */ user_derived(() => $$props.config.tourButtons);
-	const tourProgressProps = /* @__PURE__ */ user_derived(() => $$props.config.tourProgress);
-	const tourSkipProps = /* @__PURE__ */ user_derived(() => $$props.config.tourSkip);
-	const closeButtonProps = /* @__PURE__ */ user_derived(() => $$props.config.closeButton);
 	const tourTooltipAnimation = /* @__PURE__ */ user_derived(() => $$props.animation.isEnabled ? $$props.animation.tooltip : false);
 	const isAnimated = /* @__PURE__ */ user_derived(() => $$props.animation.isEnabled);
 	const hasGlide = /* @__PURE__ */ user_derived(() => $$props.animation.tooltip.transition === BordaTooltipTransition.GLIDE);
@@ -8973,7 +8976,22 @@ function Borda($$anchor, $$props) {
 	const isStepSettling = /* @__PURE__ */ user_derived(() => $$props.scroll.isScrolling || overlayTransition.isActive);
 	/** In fade mode, hide the tooltip while the step settles, then fade it in at the new position. */
 	const isHidden = /* @__PURE__ */ user_derived(() => !get(hasGlide) && get(isAnimated) && get(isStepSettling) && !get(isShownOnScroll));
-	const step = /* @__PURE__ */ user_derived(() => $$props.controller.step);
+	/** Seeded once from the initial step so the first render has content; kept in sync by the effect below. */
+	let displayed = /* @__PURE__ */ state(proxy({
+		step: untrack(() => $$props.controller.step),
+		target: untrack(() => $$props.controller.currentTarget),
+		currentStep: untrack(() => $$props.controller.currentStep),
+		config: untrack(() => $$props.config)
+	}));
+	const size = /* @__PURE__ */ user_derived(() => get(displayed).config.size);
+	const shape = /* @__PURE__ */ user_derived(() => get(displayed).config.shape);
+	const tourOverlayProps = /* @__PURE__ */ user_derived(() => get(displayed).config.tourOverlay);
+	const tourTooltipProps = /* @__PURE__ */ user_derived(() => get(displayed).config.tourTooltip);
+	const tourImageProps = /* @__PURE__ */ user_derived(() => get(displayed).config.tourImage);
+	const tourButtonsProps = /* @__PURE__ */ user_derived(() => get(displayed).config.tourButtons);
+	const tourProgressProps = /* @__PURE__ */ user_derived(() => get(displayed).config.tourProgress);
+	const tourSkipProps = /* @__PURE__ */ user_derived(() => get(displayed).config.tourSkip);
+	const closeButtonProps = /* @__PURE__ */ user_derived(() => get(displayed).config.closeButton);
 	const tourComponents = /* @__PURE__ */ user_derived(() => {
 		const components = get(bordaTour)?.getComponents();
 		return {
@@ -9005,6 +9023,34 @@ function Borda($$anchor, $$props) {
 		if ($$props.config.visibility?.isHidden) return;
 		$$props.scroll.scrollTo($$props.controller.currentTarget);
 	});
+	user_effect(() => {
+		if (!get(isHidden)) {
+			set(displayed, {
+				step: $$props.controller.step,
+				target: $$props.controller.currentTarget,
+				currentStep: $$props.controller.currentStep,
+				config: $$props.config
+			}, true);
+			return;
+		}
+		/**
+		* `step`/`currentTarget`/`currentStep`/`config` (incl. per-step overrides
+		* like `tourProgress`) are live and swap the instant the step index
+		* changes, so binding the tooltip/overlay to them directly would render
+		* the new step's content immediately — visible for a frame before the
+		* fade-out even starts. Keep showing the outgoing step's snapshot while
+		* it fades out, and only swap once it's actually invisible.
+		*/
+		const timeoutId = setTimeout(() => {
+			set(displayed, {
+				step: $$props.controller.step,
+				target: $$props.controller.currentTarget,
+				currentStep: $$props.controller.currentStep,
+				config: $$props.config
+			}, true);
+		}, $$props.animation.tooltip.exitDuration);
+		return () => clearTimeout(timeoutId);
+	});
 	onMount(() => {
 		$$props.mount();
 	});
@@ -9024,7 +9070,7 @@ function Borda($$anchor, $$props) {
 				var consequent = ($$anchor) => {
 					bind_this(BordaTourOverlay($$anchor, spread_props({
 						get targetElement() {
-							return $$props.controller.currentTarget;
+							return get(displayed).target;
 						},
 						get isAnimated() {
 							return get(isAnimated);
@@ -9038,13 +9084,13 @@ function Borda($$anchor, $$props) {
 				var consequent_1 = ($$anchor) => {
 					bind_this(BordaTour($$anchor, {
 						get step() {
-							return get(step);
+							return get(displayed).step;
 						},
 						get currentTarget() {
-							return $$props.controller.currentTarget;
+							return get(displayed).target;
 						},
 						get currentStep() {
-							return $$props.controller.currentStep;
+							return get(displayed).currentStep;
 						},
 						get totalSteps() {
 							return $$props.controller.totalSteps;
@@ -9108,7 +9154,7 @@ function Borda($$anchor, $$props) {
 				append($$anchor, fragment_1);
 			};
 			if_block(node_1, ($$render) => {
-				if ($$props.controller.currentTarget && get(step)) $$render(consequent_2);
+				if ($$props.controller.currentTarget && $$props.controller.step) $$render(consequent_2);
 			});
 			append($$anchor, fragment);
 		},
@@ -9286,7 +9332,7 @@ function useBorda() {
 	}
 	return {
 		NAME: "@retoo/borda",
-		VERSION: "0.1.0",
+		VERSION: "0.1.1",
 		mount: mount$1,
 		unmount: unmount$1,
 		highlight: useBordaHighlight(mount$1).highlight

package/dist/borda.es.js

@@ -8441,11 +8441,9 @@ function useTooltipPosition({ getTargetElement, getTooltipElement, getPlacement,
 	const padding = /* @__PURE__ */ user_derived(getPadding);
 	const autoPlacement = /* @__PURE__ */ user_derived(getAutoPlacement);
 	const arrowSide = /* @__PURE__ */ user_derived(getArrowSide);
-	user_effect(() => {
+	/** Reads the live target/tooltip rects and writes the resolved position into state. */
+	function recompute() {
 		if (!get(target) || !get(tooltip)) return;
-		/** Re-run on scroll so auto-flip/shift recompute against the live viewport. */
-		scroll.x;
-		scroll.y;
 		const layout = useTooltipLayout({
 			target: get(target),
 			tooltip: get(tooltip),
@@ -8464,6 +8462,19 @@ function useTooltipPosition({ getTargetElement, getTooltipElement, getPlacement,
 		set(left, layout.position.left, true);
 		set(effectivePlacement, layout.placement, true);
 		set(arrowOffset, layout.arrowOffset, true);
+	}
+	user_effect(() => {
+		if (!get(tooltip)) return;
+		/** Re-run when the tooltip's own size changes (e.g. an image finishes loading). */
+		const observer = new ResizeObserver(recompute);
+		observer.observe(get(tooltip));
+		return () => observer.disconnect();
+	});
+	user_effect(() => {
+		/** Re-run on scroll so auto-flip/shift recompute against the live viewport. */
+		scroll.x;
+		scroll.y;
+		recompute();
 	});
 	return {
 		get top() {
@@ -8948,9 +8959,8 @@ function Borda($$anchor, $$props) {
 		getDuration: () => $$props.animation.overlay.transitionDuration
 	});
 	useFocusTrap({ getContainer: () => get(bordaContainer)?.getElements()?.root ?? null });
-	const size = /* @__PURE__ */ user_derived(() => $$props.config.size);
-	const shape = /* @__PURE__ */ user_derived(() => $$props.config.shape);
 	const rootClasses = /* @__PURE__ */ user_derived(() => ["rb"]);
+	/** Container chrome isn't per-step content, so it always tracks the live config. */
 	const containerProps = /* @__PURE__ */ user_derived(() => ({
 		...$$props.config.container,
 		customClasses: {
@@ -8958,13 +8968,6 @@ function Borda($$anchor, $$props) {
 			root: [$$props.config.container?.customClasses?.root, containerAnimator.classes]
 		}
 	}));
-	const tourOverlayProps = /* @__PURE__ */ user_derived(() => $$props.config.tourOverlay);
-	const tourTooltipProps = /* @__PURE__ */ user_derived(() => $$props.config.tourTooltip);
-	const tourImageProps = /* @__PURE__ */ user_derived(() => $$props.config.tourImage);
-	const tourButtonsProps = /* @__PURE__ */ user_derived(() => $$props.config.tourButtons);
-	const tourProgressProps = /* @__PURE__ */ user_derived(() => $$props.config.tourProgress);
-	const tourSkipProps = /* @__PURE__ */ user_derived(() => $$props.config.tourSkip);
-	const closeButtonProps = /* @__PURE__ */ user_derived(() => $$props.config.closeButton);
 	const tourTooltipAnimation = /* @__PURE__ */ user_derived(() => $$props.animation.isEnabled ? $$props.animation.tooltip : false);
 	const isAnimated = /* @__PURE__ */ user_derived(() => $$props.animation.isEnabled);
 	const hasGlide = /* @__PURE__ */ user_derived(() => $$props.animation.tooltip.transition === BordaTooltipTransition.GLIDE);
@@ -8972,7 +8975,22 @@ function Borda($$anchor, $$props) {
 	const isStepSettling = /* @__PURE__ */ user_derived(() => $$props.scroll.isScrolling || overlayTransition.isActive);
 	/** In fade mode, hide the tooltip while the step settles, then fade it in at the new position. */
 	const isHidden = /* @__PURE__ */ user_derived(() => !get(hasGlide) && get(isAnimated) && get(isStepSettling) && !get(isShownOnScroll));
-	const step = /* @__PURE__ */ user_derived(() => $$props.controller.step);
+	/** Seeded once from the initial step so the first render has content; kept in sync by the effect below. */
+	let displayed = /* @__PURE__ */ state(proxy({
+		step: untrack(() => $$props.controller.step),
+		target: untrack(() => $$props.controller.currentTarget),
+		currentStep: untrack(() => $$props.controller.currentStep),
+		config: untrack(() => $$props.config)
+	}));
+	const size = /* @__PURE__ */ user_derived(() => get(displayed).config.size);
+	const shape = /* @__PURE__ */ user_derived(() => get(displayed).config.shape);
+	const tourOverlayProps = /* @__PURE__ */ user_derived(() => get(displayed).config.tourOverlay);
+	const tourTooltipProps = /* @__PURE__ */ user_derived(() => get(displayed).config.tourTooltip);
+	const tourImageProps = /* @__PURE__ */ user_derived(() => get(displayed).config.tourImage);
+	const tourButtonsProps = /* @__PURE__ */ user_derived(() => get(displayed).config.tourButtons);
+	const tourProgressProps = /* @__PURE__ */ user_derived(() => get(displayed).config.tourProgress);
+	const tourSkipProps = /* @__PURE__ */ user_derived(() => get(displayed).config.tourSkip);
+	const closeButtonProps = /* @__PURE__ */ user_derived(() => get(displayed).config.closeButton);
 	const tourComponents = /* @__PURE__ */ user_derived(() => {
 		const components = get(bordaTour)?.getComponents();
 		return {
@@ -9004,6 +9022,34 @@ function Borda($$anchor, $$props) {
 		if ($$props.config.visibility?.isHidden) return;
 		$$props.scroll.scrollTo($$props.controller.currentTarget);
 	});
+	user_effect(() => {
+		if (!get(isHidden)) {
+			set(displayed, {
+				step: $$props.controller.step,
+				target: $$props.controller.currentTarget,
+				currentStep: $$props.controller.currentStep,
+				config: $$props.config
+			}, true);
+			return;
+		}
+		/**
+		* `step`/`currentTarget`/`currentStep`/`config` (incl. per-step overrides
+		* like `tourProgress`) are live and swap the instant the step index
+		* changes, so binding the tooltip/overlay to them directly would render
+		* the new step's content immediately — visible for a frame before the
+		* fade-out even starts. Keep showing the outgoing step's snapshot while
+		* it fades out, and only swap once it's actually invisible.
+		*/
+		const timeoutId = setTimeout(() => {
+			set(displayed, {
+				step: $$props.controller.step,
+				target: $$props.controller.currentTarget,
+				currentStep: $$props.controller.currentStep,
+				config: $$props.config
+			}, true);
+		}, $$props.animation.tooltip.exitDuration);
+		return () => clearTimeout(timeoutId);
+	});
 	onMount(() => {
 		$$props.mount();
 	});
@@ -9023,7 +9069,7 @@ function Borda($$anchor, $$props) {
 				var consequent = ($$anchor) => {
 					bind_this(BordaTourOverlay($$anchor, spread_props({
 						get targetElement() {
-							return $$props.controller.currentTarget;
+							return get(displayed).target;
 						},
 						get isAnimated() {
 							return get(isAnimated);
@@ -9037,13 +9083,13 @@ function Borda($$anchor, $$props) {
 				var consequent_1 = ($$anchor) => {
 					bind_this(BordaTour($$anchor, {
 						get step() {
-							return get(step);
+							return get(displayed).step;
 						},
 						get currentTarget() {
-							return $$props.controller.currentTarget;
+							return get(displayed).target;
 						},
 						get currentStep() {
-							return $$props.controller.currentStep;
+							return get(displayed).currentStep;
 						},
 						get totalSteps() {
 							return $$props.controller.totalSteps;
@@ -9107,7 +9153,7 @@ function Borda($$anchor, $$props) {
 				append($$anchor, fragment_1);
 			};
 			if_block(node_1, ($$render) => {
-				if ($$props.controller.currentTarget && get(step)) $$render(consequent_2);
+				if ($$props.controller.currentTarget && $$props.controller.step) $$render(consequent_2);
 			});
 			append($$anchor, fragment);
 		},
@@ -9285,7 +9331,7 @@ function useBorda() {
 	}
 	return {
 		NAME: "@retoo/borda",
-		VERSION: "0.1.0",
+		VERSION: "0.1.1",
 		mount: mount$1,
 		unmount: unmount$1,
 		highlight: useBordaHighlight(mount$1).highlight

package/dist/borda.min.cjs.js

@@ -3652,9 +3652,8 @@ function Si({ getTargetElement: e, getTooltipElement: t, getPlacement: n, getPad
 		return e = n(), fo.has(e) ? e : io.BOTTOM_START;
 		var e;
 	}), m = Oe(o), _ = Oe(i), b = Oe(r), y = Oe(s), T = Oe(a);
-	return Dt(() => {
+	function w() {
 		if (!wn(h) || !wn(v)) return;
-		p.x, p.y;
 		const e = Ei({
 			target: wn(h),
 			tooltip: wn(v),
@@ -3670,6 +3669,13 @@ function Si({ getTargetElement: e, getTooltipElement: t, getPlacement: n, getPad
 			}
 		});
 		rt(l, e.position.top, !0), rt(u, e.position.left, !0), rt(c, e.placement, !0), rt(f, e.arrowOffset, !0);
+	}
+	return Dt(() => {
+		if (!wn(v)) return;
+		const e = new ResizeObserver(w);
+		return e.observe(wn(v)), () => e.disconnect();
+	}), Dt(() => {
+		p.x, p.y, w();
 	}), {
 		get top() {
 			return wn(l);
@@ -4272,13 +4278,20 @@ function Di(e, t) {
 		getDuration: () => t.animation.overlay.transitionDuration
 	});
 	eo({ getContainer: () => wn(n)?.getElements()?.root ?? null });
-	const a = Oe(() => t.config.size), l = Oe(() => t.config.shape), u = Oe(() => ["rb"]), c = Oe(() => ({
+	const a = Oe(() => ["rb"]), l = Oe(() => ({
 		...t.config.container,
 		customClasses: {
 			...t.config.container?.customClasses,
 			root: [t.config.container?.customClasses?.root, i.classes]
 		}
-	})), f = Oe(() => t.config.tourOverlay), d = Oe(() => t.config.tourTooltip), p = Oe(() => t.config.tourImage), h = Oe(() => t.config.tourButtons), v = Oe(() => t.config.tourProgress), g = Oe(() => t.config.tourSkip), m = Oe(() => t.config.closeButton), _ = Oe(() => !!t.animation.isEnabled && t.animation.tooltip), b = Oe(() => t.animation.isEnabled), y = Oe(() => t.animation.tooltip.transition === So.GLIDE), T = Oe(() => t.animation.tooltip.appearance === Eo.DURING_SCROLL), w = Oe(() => t.scroll.isScrolling || s.isActive), E = Oe(() => !wn(y) && wn(b) && wn(w) && !wn(T)), S = Oe(() => t.controller.step), O = Oe(() => {
+	})), u = Oe(() => !!t.animation.isEnabled && t.animation.tooltip), c = Oe(() => t.animation.isEnabled), f = Oe(() => t.animation.tooltip.transition === So.GLIDE), d = Oe(() => t.animation.tooltip.appearance === Eo.DURING_SCROLL), p = Oe(() => t.scroll.isScrolling || s.isActive), h = Oe(() => !wn(f) && wn(c) && wn(p) && !wn(d));
+	let v = tt(lt({
+		step: On(() => t.controller.step),
+		target: On(() => t.controller.currentTarget),
+		currentStep: On(() => t.controller.currentStep),
+		config: On(() => t.config)
+	}));
+	const g = Oe(() => wn(v).config.size), m = Oe(() => wn(v).config.shape), _ = Oe(() => wn(v).config.tourOverlay), b = Oe(() => wn(v).config.tourTooltip), y = Oe(() => wn(v).config.tourImage), T = Oe(() => wn(v).config.tourButtons), w = Oe(() => wn(v).config.tourProgress), E = Oe(() => wn(v).config.tourSkip), S = Oe(() => wn(v).config.closeButton), O = Oe(() => {
 		const e = wn(o)?.getComponents();
 		return {
 			tourTooltip: e?.tourTooltip ?? null,
@@ -4305,6 +4318,22 @@ function Di(e, t) {
 	var C;
 	Dt(() => {
 		t.config.visibility?.isHidden || t.scroll.scrollTo(t.controller.currentTarget);
+	}), Dt(() => {
+		if (!wn(h)) return void rt(v, {
+			step: t.controller.step,
+			target: t.controller.currentTarget,
+			currentStep: t.controller.currentStep,
+			config: t.config
+		}, !0);
+		const e = setTimeout(() => {
+			rt(v, {
+				step: t.controller.step,
+				target: t.controller.currentTarget,
+				currentStep: t.controller.currentStep,
+				config: t.config
+			}, !0);
+		}, t.animation.tooltip.exitDuration);
+		return () => clearTimeout(e);
 	}), ir(() => {
 		t.mount();
 	}), C = () => {
@@ -4326,9 +4355,9 @@ function Di(e, t) {
 		}), G(s), Fr(s, (e) => rt(n, e), () => wn(n)), It(() => {
 			Mr(s, "id", t.id), yr(s, 1, gr(wn(r))), wr(s, wn(o));
 		}), Fn(e, s), re(i);
-	}(bt(k), Vr(() => wn(c), {
+	}(bt(k), Vr(() => wn(l), {
 		children: (e, n) => {
-			var i = jn(), s = yt(i), u = (e) => {
+			var i = jn(), s = yt(i), a = (e) => {
 				var n = Ai(), i = yt(n), s = (e) => {
 					Fr(function(e, t) {
 						ne(t, !0);
@@ -4370,26 +4399,26 @@ function Di(e, t) {
 						}), Fn(e, y), re(b);
 					}(e, Vr({
 						get targetElement() {
-							return t.controller.currentTarget;
+							return wn(v).target;
 						},
 						get isAnimated() {
-							return wn(b);
+							return wn(c);
 						}
-					}, () => wn(f))), (e) => rt(r, e, !0), () => wn(r));
+					}, () => wn(_))), (e) => rt(r, e, !0), () => wn(r));
 				};
 				sr(i, (e) => {
-					!1 !== wn(f) && e(s);
+					!1 !== wn(_) && e(s);
 				});
-				var u = Tt(i, 2), c = (e) => {
+				var a = Tt(i, 2), l = (e) => {
 					Fr(ki(e, {
 						get step() {
-							return wn(S);
+							return wn(v).step;
 						},
 						get currentTarget() {
-							return t.controller.currentTarget;
+							return wn(v).target;
 						},
 						get currentStep() {
-							return t.controller.currentStep;
+							return wn(v).currentStep;
 						},
 						get totalSteps() {
 							return t.controller.totalSteps;
@@ -4398,37 +4427,37 @@ function Di(e, t) {
 							return t.skip.isSkipped;
 						},
 						get isHidden() {
-							return wn(E);
+							return wn(h);
 						},
 						get hasGlide() {
-							return wn(y);
+							return wn(f);
 						},
 						get tourTooltipAnimation() {
-							return wn(_);
+							return wn(u);
 						},
 						get size() {
-							return wn(a);
+							return wn(g);
 						},
 						get shape() {
-							return wn(l);
+							return wn(m);
 						},
 						get tourTooltipProps() {
-							return wn(d);
+							return wn(b);
 						},
 						get tourImageProps() {
-							return wn(p);
+							return wn(y);
 						},
 						get tourButtonsProps() {
-							return wn(h);
+							return wn(T);
 						},
 						get tourProgressProps() {
-							return wn(v);
+							return wn(w);
 						},
 						get closeButtonProps() {
-							return wn(m);
+							return wn(S);
 						},
 						get tourSkipProps() {
-							return wn(g);
+							return wn(E);
 						},
 						get onNext() {
 							return t.controller.next;
@@ -4447,16 +4476,16 @@ function Di(e, t) {
 						}
 					}), (e) => rt(o, e, !0), () => wn(o));
 				};
-				sr(u, (e) => {
-					!1 !== wn(d) && e(c);
+				sr(a, (e) => {
+					!1 !== wn(b) && e(l);
 				}), Fn(e, n);
 			};
 			sr(s, (e) => {
-				t.controller.currentTarget && wn(S) && e(u);
+				t.controller.currentTarget && t.controller.step && e(a);
 			}), Fn(e, i);
 		},
 		$$slots: { default: !0 }
-	})), (e) => rt(n, e, !0), () => wn(n)), G(k), It(() => yr(k, 1, gr(wn(u)))), Fn(e, k), re(N);
+	})), (e) => rt(n, e, !0), () => wn(n)), G(k), It(() => yr(k, 1, gr(wn(a)))), Fn(e, k), re(N);
 }
 function Li() {
 	const e = /* @__PURE__ */ new WeakMap(), t = /* @__PURE__ */ new WeakSet();
@@ -4549,7 +4578,7 @@ function Li() {
 	}
 	return {
 		NAME: "@retoo/borda",
-		VERSION: "0.1.0",
+		VERSION: "0.1.1",
 		mount: n,
 		unmount: r,
 		highlight: Po(n).highlight