@svadmin/ui 0.38.2 → 0.38.5

package/dist/components/ui/sheet/sheet-content.svelte

@@ -2,13 +2,10 @@
 	import { cn, type WithElementRef } from "../../../utils.js";
 	import type { HTMLAttributes } from "svelte/elements";
 
-	type Props = WithElementRef<HTMLAttributes<HTMLDivElement>> & {
-		side?: "left" | "right";
-	};
+	type Props = WithElementRef<HTMLAttributes<HTMLDivElement>>;
 
 	let {
 		ref = $bindable(null),
-		side = "right",
 		class: className,
 		children,
 		...restProps

package/dist/components/ui/sheet/sheet-content.svelte.d.ts

@@ -1,8 +1,6 @@
 import { type WithElementRef } from "../../../utils.js";
 import type { HTMLAttributes } from "svelte/elements";
-type Props = WithElementRef<HTMLAttributes<HTMLDivElement>> & {
-    side?: "left" | "right";
-};
+type Props = WithElementRef<HTMLAttributes<HTMLDivElement>>;
 declare const SheetContent: import("svelte").Component<Props, {}, "ref">;
 type SheetContent = ReturnType<typeof SheetContent>;
 export default SheetContent;

package/dist/components/ui/tabs/tabs-content.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
 	import { cn, type WithElementRef } from "../../../utils.js";
 	import type { HTMLAttributes } from "svelte/elements";
+	import { getTabsContext } from "./tabs-context.svelte.js";
 
 	type Props = WithElementRef<HTMLAttributes<HTMLDivElement>> & {
 		value: string;
@@ -10,14 +11,17 @@
 	let {
 		ref = $bindable(null),
 		value,
-		active = false,
+		active,
 		class: className,
 		children,
 		...restProps
 	}: Props = $props();
+
+	const tabs = getTabsContext();
+	const isActive = $derived(active ?? tabs.value === value);
 </script>
 
-{#if active}
+{#if isActive}
 	<div
 		bind:this={ref}
 		data-slot="tabs-content"

package/dist/components/ui/tabs/tabs-context.svelte.d.ts

@@ -0,0 +1,5 @@
+export interface TabsContextValue {
+    readonly value: string;
+    select: (value: string) => void;
+}
+export declare const getTabsContext: () => TabsContextValue, setTabsContext: (context: TabsContextValue) => TabsContextValue;

package/dist/components/ui/tabs/tabs-context.svelte.js

@@ -0,0 +1,2 @@
+import { createContext } from 'svelte';
+export const [getTabsContext, setTabsContext] = createContext();

package/dist/components/ui/tabs/tabs-trigger.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
 	import { cn, type WithElementRef } from "../../../utils.js";
 	import type { HTMLButtonAttributes } from "svelte/elements";
+	import { getTabsContext } from "./tabs-context.svelte.js";
 
 	type Props = WithElementRef<HTMLButtonAttributes, HTMLButtonElement> & {
 		value: string;
@@ -10,11 +11,52 @@
 	let {
 		ref = $bindable(null),
 		value,
-		active = false,
+		active,
+		onclick,
+		onkeydown,
+		tabindex,
 		class: className,
 		children,
 		...restProps
 	}: Props = $props();
+
+	const tabs = getTabsContext();
+	const isActive = $derived(active ?? tabs.value === value);
+	type ButtonMouseEvent = MouseEvent & { currentTarget: EventTarget & HTMLButtonElement };
+	type ButtonKeyboardEvent = KeyboardEvent & { currentTarget: EventTarget & HTMLButtonElement };
+
+	function handleClick(event: ButtonMouseEvent) {
+		onclick?.(event);
+		if (!event.defaultPrevented) tabs.select(value);
+	}
+
+	function handleKeydown(event: ButtonKeyboardEvent) {
+		onkeydown?.(event);
+		if (event.defaultPrevented) return;
+
+		const keys = ["ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown", "Home", "End"];
+		if (!keys.includes(event.key)) return;
+
+		const tabList = event.currentTarget.closest('[role="tablist"]');
+		if (!tabList) return;
+		const triggers: HTMLButtonElement[] = Array.from(
+			tabList.querySelectorAll<HTMLButtonElement>('[role="tab"]:not(:disabled)')
+		);
+		const currentIndex = triggers.indexOf(event.currentTarget);
+		if (currentIndex === -1 || triggers.length === 0) return;
+
+		const nextIndex = event.key === "Home"
+			? 0
+			: event.key === "End"
+				? triggers.length - 1
+				: event.key === "ArrowRight" || event.key === "ArrowDown"
+					? (currentIndex + 1) % triggers.length
+					: (currentIndex - 1 + triggers.length) % triggers.length;
+
+		event.preventDefault();
+		triggers[nextIndex]?.focus();
+		triggers[nextIndex]?.click();
+	}
 </script>
 
 <button
@@ -22,16 +64,19 @@
 	type="button"
 	role="tab"
 	data-slot="tabs-trigger"
-	data-state={active ? "active" : "inactive"}
-	aria-selected={active}
+	data-state={isActive ? "active" : "inactive"}
+	aria-selected={isActive}
+	tabindex={tabindex ?? (isActive ? 0 : -1)}
 	class={cn(
 		"inline-flex items-center justify-center gap-1.5 whitespace-nowrap rounded-md px-2.5 py-1 text-sm font-medium transition-all outline-none focus-visible:ring-2 focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 [&_svg]:size-4 [&_svg]:shrink-0",
-		active
+		isActive
 			? "bg-background text-foreground shadow-sm"
 			: "text-muted-foreground hover:text-foreground",
 		className
 	)}
 	{...restProps}
+	onclick={handleClick}
+	onkeydown={handleKeydown}
 >
 	{@render children?.()}
 </button>

package/dist/components/ui/tabs/tabs.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
-/* eslint-disable no-useless-assignment */
 	import { cn, type WithElementRef } from "../../../utils.js";
 	import type { HTMLAttributes } from "svelte/elements";
+	import { setTabsContext } from "./tabs-context.svelte.js";
 
 	type Props = WithElementRef<HTMLAttributes<HTMLDivElement>> & {
 		value?: string;
@@ -16,6 +16,17 @@
 		children,
 		...restProps
 	}: Props = $props();
+
+	setTabsContext({
+		get value() {
+			return value;
+		},
+		select(nextValue) {
+			if (nextValue === value) return;
+			value = nextValue;
+			onValueChange?.(nextValue);
+		},
+	});
 </script>
 
 <div

package/dist/components/ui/tooltip/index.d.ts

@@ -3,4 +3,7 @@ import Trigger from "./tooltip-trigger.svelte";
 import Content from "./tooltip-content.svelte";
 import Provider from "./tooltip-provider.svelte";
 import Portal from "./tooltip-portal.svelte";
-export { Root, Trigger, Content, Provider, Portal, Root as Tooltip, Content as TooltipContent, Trigger as TooltipTrigger, Provider as TooltipProvider, Portal as TooltipPortal, };
+import { Tooltip as TooltipPrimitive } from "bits-ui";
+declare const createTether: typeof TooltipPrimitive.createTether;
+type Tether<Payload = never> = TooltipPrimitive.Tether<Payload>;
+export { Root, Trigger, Content, Provider, Portal, createTether, type Tether, Root as Tooltip, Content as TooltipContent, Trigger as TooltipTrigger, Provider as TooltipProvider, Portal as TooltipPortal, };

package/dist/components/ui/tooltip/index.js

@@ -3,6 +3,8 @@ import Trigger from "./tooltip-trigger.svelte";
 import Content from "./tooltip-content.svelte";
 import Provider from "./tooltip-provider.svelte";
 import Portal from "./tooltip-portal.svelte";
-export { Root, Trigger, Content, Provider, Portal, 
+import { Tooltip as TooltipPrimitive } from "bits-ui";
+const createTether = TooltipPrimitive.createTether;
+export { Root, Trigger, Content, Provider, Portal, createTether, 
 //
 Root as Tooltip, Content as TooltipContent, Trigger as TooltipTrigger, Provider as TooltipProvider, Portal as TooltipPortal, };

package/dist/components/ui/tooltip/tooltip-content.svelte

@@ -1,52 +1,325 @@
 <script lang="ts">
+	import {
+		arrow,
+		autoUpdate,
+		computePosition,
+		flip,
+		hide,
+		limitShift,
+		offset,
+		shift,
+		type Boundary,
+		type Padding,
+		type Placement,
+		type ReferenceElement,
+		type Strategy,
+	} from "@floating-ui/dom";
 	import { Tooltip as TooltipPrimitive } from "bits-ui";
+	import { onDestroy, type ComponentProps, type Snippet } from "svelte";
+	import { createAttachmentKey } from "svelte/attachments";
+	import type { HTMLAttributes } from "svelte/elements";
 	import { cn } from "../../../utils.js";
+	import { getTooltipLayerContext } from "./tooltip-context.svelte.js";
+	import {
+		registerTooltipLayer,
+		type TooltipLayerBehavior,
+	} from "./tooltip-layer-registry.svelte.js";
 	import TooltipPortal from "./tooltip-portal.svelte";
-	import type { ComponentProps } from "svelte";
 	import type { WithoutChildrenOrChild } from "../../../utils.js";
 
+	type Side = "top" | "right" | "bottom" | "left";
+	type Align = "start" | "center" | "end";
+	type OutsideBehavior = TooltipLayerBehavior;
+	type EscapeBehavior = TooltipLayerBehavior;
+	type ContentPointerHandler = NonNullable<HTMLAttributes<HTMLDivElement>["onpointerenter"]>;
+	type ContentPointerEvent = Parameters<ContentPointerHandler>[0];
+	type TooltipContentChildProps = {
+		props: Record<PropertyKey, unknown>;
+		wrapperProps: Record<string, unknown>;
+		open: boolean;
+	};
+	type TooltipContentProps = Omit<
+		HTMLAttributes<HTMLDivElement>,
+		"children" | "class" | "id" | "style"
+	> & {
+		ref?: HTMLDivElement | null;
+		class?: string;
+		id?: string;
+		style?: TooltipPrimitive.ContentProps["style"];
+		dir?: TooltipPrimitive.ContentProps["dir"];
+		side?: Side;
+		sideOffset?: number;
+		align?: Align;
+		alignOffset?: number;
+		arrowPadding?: Padding;
+		avoidCollisions?: boolean;
+		collisionBoundary?: Boundary;
+		collisionPadding?: Padding;
+		customAnchor?: ReferenceElement | string | null;
+		sticky?: "partial" | "always";
+		strategy?: Strategy;
+		updatePositionStrategy?: "optimized" | "always";
+		hideWhenDetached?: boolean;
+		forceMount?: boolean;
+		onPlaced?: () => void;
+		onInteractOutside?: (event: PointerEvent) => void;
+		onFocusOutside?: (event: FocusEvent) => void;
+		interactOutsideBehavior?: OutsideBehavior;
+		onEscapeKeydown?: (event: KeyboardEvent) => void;
+		escapeKeydownBehavior?: EscapeBehavior;
+		children?: Snippet;
+		child?: Snippet<[TooltipContentChildProps]>;
+		arrowClasses?: string;
+		portalProps?: WithoutChildrenOrChild<ComponentProps<typeof TooltipPortal>>;
+	};
+
 	let {
 		ref = $bindable(null),
 		class: className,
-		sideOffset = 0,
+		id,
+		style,
+		dir,
 		side = "top",
+		sideOffset = 0,
+		align = "center",
+		alignOffset = 0,
+		arrowPadding = 0,
+		avoidCollisions = true,
+		collisionBoundary,
+		collisionPadding = 0,
+		customAnchor,
+		sticky = "partial",
+		strategy = "fixed",
+		updatePositionStrategy = "optimized",
+		hideWhenDetached = false,
+		forceMount = false,
+		onPlaced,
+		onInteractOutside,
+		onFocusOutside,
+		interactOutsideBehavior = "close",
+		onEscapeKeydown,
+		escapeKeydownBehavior = "close",
+		onpointerenter,
+		onpointerleave,
 		children,
+		child,
 		arrowClasses,
 		portalProps,
-		...restProps
-	}: TooltipPrimitive.ContentProps & {
-		arrowClasses?: string;
-		portalProps?: WithoutChildrenOrChild<ComponentProps<typeof TooltipPortal>>;
-	} = $props();
-</script>
+		...domProps
+	}: TooltipContentProps = $props();
+
+	const tooltip = getTooltipLayerContext();
+	const unregisterContentId = tooltip.registerContentId(() => id ?? tooltip.defaultContentId);
+	let x = $state(-10_000);
+	let y = $state(-10_000);
+	let resolvedSide = $state<Side>("top");
+	let arrowX = $state<number | undefined>();
+	let arrowY = $state<number | undefined>();
+	let arrowStaticSide = $state<Side>("bottom");
+	let referenceHidden = $state(false);
+	let positioned = $state(false);
+	let arrowRef: HTMLDivElement | null = $state(null);
+	let destroyed = false;
+	let positionGeneration = 0;
+	const contentAttachmentKey = createAttachmentKey();
 
-<TooltipPortal {...portalProps}>
-	<TooltipPrimitive.Content
-		bind:ref
-		data-slot="tooltip-content"
-		{sideOffset}
-		{side}
-		class={cn(
-			"data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-xs has-data-[slot=kbd]:pr-1.5 **:data-[slot=kbd]:relative **:data-[slot=kbd]:isolate **:data-[slot=kbd]:z-50 **:data-[slot=kbd]:rounded-sm bg-primary text-primary-foreground z-50 w-fit max-w-xs origin-(--bits-tooltip-content-transform-origin)",
+	const contentId = $derived(id ?? tooltip.defaultContentId);
+	const placement = $derived<Placement>(align === "center" ? side : `${side}-${align}`);
+	const arrowStyle = $derived(
+		[
+			arrowX === undefined ? undefined : `left: ${arrowX}px`,
+			arrowY === undefined ? undefined : `top: ${arrowY}px`,
+			`${arrowStaticSide}: -5px`,
+		]
+			.filter(Boolean)
+			.join("; ")
+	);
+	const contentClass = $derived(
+		cn(
+			"animate-in fade-in-0 zoom-in-95 inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-xs has-data-[slot=kbd]:pr-1.5 **:data-[slot=kbd]:relative **:data-[slot=kbd]:isolate **:data-[slot=kbd]:z-50 **:data-[slot=kbd]:rounded-sm bg-primary text-primary-foreground z-50 w-fit max-w-xs",
 			className
-		)}
-		{...restProps}
-	>
-		{@render children?.()}
-		<TooltipPrimitive.Arrow>
-			{#snippet child({ props })}
+		)
+	);
+	function serializeStyle(value: TooltipPrimitive.ContentProps["style"]) {
+		if (!value) return "";
+		if (typeof value === "string") return value.trim().replace(/;$/, "");
+		return Object.entries(value)
+			.filter(([, propertyValue]) => propertyValue !== null && propertyValue !== undefined)
+			.map(([property, propertyValue]) => {
+				const cssProperty = property.startsWith("--")
+					? property
+					: property.replace(/[A-Z]/g, (match) => `-${match.toLowerCase()}`);
+				return `${cssProperty}: ${String(propertyValue)}`;
+			})
+			.join("; ");
+	}
+	const contentStyle = $derived(
+		[
+			serializeStyle(style),
+			`position: ${strategy}`,
+			`left: ${x}px`,
+			`top: ${y}px`,
+			`visibility: ${(tooltip.open || tooltip.presenceStatus === "ending") && positioned && !referenceHidden ? "visible" : "hidden"}`,
+			`pointer-events: ${tooltip.open && !tooltip.disableHoverableContent ? "auto" : "none"}`,
+		]
+			.filter(Boolean)
+			.join("; ")
+	);
+
+	function attachContent(node: HTMLDivElement) {
+		ref = node;
+		tooltip.setContentNode(node);
+		return () => {
+			if (ref === node) ref = null;
+			tooltip.setContentNode(null);
+		};
+	}
+
+	const contentProps = $derived.by(
+		() =>
+			({
+				...domProps,
+				[contentAttachmentKey]: attachContent,
+				id: contentId,
+				role: "tooltip",
+				"data-slot": "tooltip-content",
+				"data-state": tooltip.open ? "instant-open" : "closed",
+				"data-starting-style": tooltip.presenceStatus === "starting" ? "" : undefined,
+				"data-ending-style": tooltip.presenceStatus === "ending" ? "" : undefined,
+				"data-side": resolvedSide,
+				"aria-hidden": !tooltip.open,
+				dir,
+				style: contentStyle,
+				class: contentClass,
+				onpointerenter: handlePointerEnter,
+				onpointerleave: handlePointerLeave,
+			}) satisfies Record<PropertyKey, unknown>
+	);
+	const wrapperProps = $derived({ style: "display: contents" });
+
+	function getAnchor(): ReferenceElement | null {
+		if (typeof customAnchor === "string") return document.querySelector(customAnchor);
+		return customAnchor ?? tooltip.trigger;
+	}
+
+	function handlePointerEnter(event: ContentPointerEvent) {
+		tooltip.cancelScheduledClose();
+		onpointerenter?.(event);
+	}
+
+	function handlePointerLeave(event: ContentPointerEvent) {
+		onpointerleave?.(event);
+		if (!event.defaultPrevented) tooltip.scheduleClose();
+	}
+
+	$effect(() => {
+		const anchor = getAnchor();
+		const floating = ref;
+		const arrowElement = arrowRef;
+		if (!tooltip.open || !anchor || !floating || destroyed) return;
+
+		let active = true;
+		positioned = false;
+		const update = async () => {
+			const generation = ++positionGeneration;
+			const result = await computePosition(anchor, floating, {
+				placement,
+				strategy,
+				middleware: [
+					offset({ mainAxis: sideOffset, alignmentAxis: alignOffset || undefined }),
+					avoidCollisions && flip({ boundary: collisionBoundary, padding: collisionPadding }),
+					avoidCollisions &&
+						shift({
+							boundary: collisionBoundary,
+							padding: collisionPadding,
+							limiter: sticky === "partial" ? limitShift() : undefined,
+						}),
+					arrowElement && arrow({ element: arrowElement, padding: arrowPadding }),
+					hideWhenDetached && hide({ boundary: collisionBoundary, padding: collisionPadding }),
+				],
+			});
+
+			if (
+				!active ||
+				destroyed ||
+				generation !== positionGeneration ||
+				ref !== floating ||
+				!tooltip.open
+			) {
+				return;
+			}
+
+			x = result.x;
+			y = result.y;
+			resolvedSide = result.placement.split("-")[0] as Side;
+			arrowX = result.middlewareData.arrow?.x;
+			arrowY = result.middlewareData.arrow?.y;
+			arrowStaticSide = {
+				top: "bottom",
+				right: "left",
+				bottom: "top",
+				left: "right",
+			}[resolvedSide] as Side;
+			referenceHidden = Boolean(result.middlewareData.hide?.referenceHidden);
+			positioned = true;
+			onPlaced?.();
+		};
+
+		const stopAutoUpdate = autoUpdate(anchor, floating, () => void update(), {
+			animationFrame: updatePositionStrategy === "always",
+		});
+
+		return () => {
+			active = false;
+			positionGeneration += 1;
+			stopAutoUpdate();
+		};
+	});
+
+	$effect(() => {
+		const floating = ref;
+		if (!tooltip.open || !floating || destroyed) return;
+
+		const ownerDocument = floating.ownerDocument;
+		const NodeConstructor = ownerDocument.defaultView?.Node;
+		return registerTooltipLayer(ownerDocument, {
+			containsTarget: (target) => {
+				if (!NodeConstructor || !(target instanceof NodeConstructor)) return false;
+				return floating.contains(target) || Boolean(tooltip.trigger?.contains(target));
+			},
+			getInteractOutsideBehavior: () => interactOutsideBehavior,
+			getEscapeKeydownBehavior: () => escapeKeydownBehavior,
+			onInteractOutside: (event) => onInteractOutside?.(event),
+			onFocusOutside: (event) => onFocusOutside?.(event),
+			onEscapeKeydown: (event) => onEscapeKeydown?.(event),
+			close: () => tooltip.close(),
+		});
+	});
+
+	onDestroy(() => {
+		destroyed = true;
+		positionGeneration += 1;
+		unregisterContentId();
+		ref = null;
+		arrowRef = null;
+	});
+</script>
+
+{#if tooltip.shouldRender || forceMount}
+	<TooltipPortal {...portalProps}>
+		{#if child}
+			{@render child({ props: contentProps, wrapperProps, open: tooltip.open })}
+		{:else}
+			<div {...contentProps}>
+				{@render children?.()}
 				<div
-					class={cn(
-						"size-2.5 translate-y-[calc(-50%-2px)] rotate-45 rounded-[2px] bg-primary fill-primary z-50",
-						"data-[side=top]:translate-x-1/2 data-[side=top]:translate-y-[calc(-50%+2px)]",
-						"data-[side=bottom]:-translate-x-1/2 data-[side=bottom]:-translate-y-[calc(-50%+1px)]",
-						"data-[side=right]:translate-x-[calc(50%+2px)] data-[side=right]:translate-y-1/2",
-						"data-[side=left]:-translate-y-[calc(50%-3px)]",
-						arrowClasses
-					)}
-					{...props}
+					bind:this={arrowRef}
+					aria-hidden="true"
+					data-side={resolvedSide}
+					style={arrowStyle}
+					class={cn("absolute size-2.5 rotate-45 rounded-[2px] bg-primary -z-10", arrowClasses)}
 				></div>
-			{/snippet}
-		</TooltipPrimitive.Arrow>
-	</TooltipPrimitive.Content>
-</TooltipPortal>
+			</div>
+		{/if}
+	</TooltipPortal>
+{/if}

package/dist/components/ui/tooltip/tooltip-content.svelte.d.ts

@@ -1,11 +1,50 @@
+import { type Boundary, type Padding, type ReferenceElement, type Strategy } from "@floating-ui/dom";
 import { Tooltip as TooltipPrimitive } from "bits-ui";
+import { type ComponentProps, type Snippet } from "svelte";
+import type { HTMLAttributes } from "svelte/elements";
+import { type TooltipLayerBehavior } from "./tooltip-layer-registry.svelte.js";
 import TooltipPortal from "./tooltip-portal.svelte";
-import type { ComponentProps } from "svelte";
 import type { WithoutChildrenOrChild } from "../../../utils.js";
-type $$ComponentProps = TooltipPrimitive.ContentProps & {
+type Side = "top" | "right" | "bottom" | "left";
+type Align = "start" | "center" | "end";
+type OutsideBehavior = TooltipLayerBehavior;
+type EscapeBehavior = TooltipLayerBehavior;
+type TooltipContentChildProps = {
+    props: Record<PropertyKey, unknown>;
+    wrapperProps: Record<string, unknown>;
+    open: boolean;
+};
+type TooltipContentProps = Omit<HTMLAttributes<HTMLDivElement>, "children" | "class" | "id" | "style"> & {
+    ref?: HTMLDivElement | null;
+    class?: string;
+    id?: string;
+    style?: TooltipPrimitive.ContentProps["style"];
+    dir?: TooltipPrimitive.ContentProps["dir"];
+    side?: Side;
+    sideOffset?: number;
+    align?: Align;
+    alignOffset?: number;
+    arrowPadding?: Padding;
+    avoidCollisions?: boolean;
+    collisionBoundary?: Boundary;
+    collisionPadding?: Padding;
+    customAnchor?: ReferenceElement | string | null;
+    sticky?: "partial" | "always";
+    strategy?: Strategy;
+    updatePositionStrategy?: "optimized" | "always";
+    hideWhenDetached?: boolean;
+    forceMount?: boolean;
+    onPlaced?: () => void;
+    onInteractOutside?: (event: PointerEvent) => void;
+    onFocusOutside?: (event: FocusEvent) => void;
+    interactOutsideBehavior?: OutsideBehavior;
+    onEscapeKeydown?: (event: KeyboardEvent) => void;
+    escapeKeydownBehavior?: EscapeBehavior;
+    children?: Snippet;
+    child?: Snippet<[TooltipContentChildProps]>;
     arrowClasses?: string;
     portalProps?: WithoutChildrenOrChild<ComponentProps<typeof TooltipPortal>>;
 };
-declare const TooltipContent: import("svelte").Component<$$ComponentProps, {}, "ref">;
+declare const TooltipContent: import("svelte").Component<TooltipContentProps, {}, "ref">;
 type TooltipContent = ReturnType<typeof TooltipContent>;
 export default TooltipContent;

package/dist/components/ui/tooltip/tooltip-context.svelte.d.ts

@@ -0,0 +1,37 @@
+import { Tooltip as TooltipPrimitive } from 'bits-ui';
+type TriggerReader = () => HTMLElement | null;
+type ContentIdReader = () => string;
+type TooltipTether = TooltipPrimitive.Tether<unknown>;
+type PresenceStatus = 'starting' | 'ending' | undefined;
+export declare class TooltipLayerContext {
+    #private;
+    readonly defaultContentId: string;
+    shouldRender: boolean;
+    presenceStatus: PresenceStatus;
+    constructor(defaultContentId: string, readOpen: () => boolean, writeOpen: (open: boolean) => void, readDisableHoverableContent: () => boolean, readActiveTriggerId: () => string | null, readExternalTrigger?: (triggerId: string) => HTMLElement | null, readOnOpenChangeComplete?: () => ((open: boolean) => void) | undefined);
+    get open(): boolean;
+    get trigger(): HTMLElement | null;
+    get activeTriggerId(): string | null;
+    get contentId(): string;
+    get disableHoverableContent(): boolean;
+    close(): void;
+    scheduleClose(delay?: number): void;
+    cancelScheduledClose(): void;
+    destroy(): void;
+    setContentNode(node: HTMLElement | null): void;
+    transitionPresence(open: boolean): void;
+    registerTrigger(triggerId: string, readTrigger: TriggerReader): () => void;
+    isActiveTrigger(triggerId: string): boolean;
+    registerContentId(readContentId: ContentIdReader): () => void;
+}
+export declare const getTooltipLayerContext: () => TooltipLayerContext, setTooltipLayerContext: (context: TooltipLayerContext) => TooltipLayerContext;
+export declare function tryGetTooltipLayerContext(): TooltipLayerContext | undefined;
+export declare class TooltipTetherBridge {
+    #private;
+    layer: TooltipLayerContext | null;
+    registerLayer(layer: TooltipLayerContext): () => void;
+    registerTrigger(triggerId: string, readTrigger: TriggerReader): () => void;
+    getTrigger(triggerId: string): HTMLElement | null;
+}
+export declare function getTooltipTetherBridge(tether: TooltipTether): TooltipTetherBridge;
+export {};