@max-ts/svelte 1.10.5 → 1.10.6

package/dist/assets/styles.css

@@ -3348,7 +3348,7 @@ img, picture, video, canvas {
   flex: 1;
   outline: none;
 }
-@keyframes styles_fadeIn__ly8gs70 {
+@keyframes styles_fadeIn__1ovcrev0 {
   0% {
     opacity: 0;
   }
@@ -3356,7 +3356,7 @@ img, picture, video, canvas {
     opacity: 1;
   }
 }
-@keyframes styles_fadeOut__ly8gs71 {
+@keyframes styles_fadeOut__1ovcrev1 {
   0% {
     opacity: 1;
   }
@@ -3364,7 +3364,7 @@ img, picture, video, canvas {
     opacity: 0;
   }
 }
-@keyframes styles_zoomIn__ly8gs72 {
+@keyframes styles_zoomIn__1ovcrev2 {
   0% {
     transform: scale(0.95);
     opacity: 0;
@@ -3374,7 +3374,7 @@ img, picture, video, canvas {
     opacity: 1;
   }
 }
-@keyframes styles_zoomOut__ly8gs73 {
+@keyframes styles_zoomOut__1ovcrev3 {
   0% {
     transform: scale(1);
     opacity: 1;
@@ -3384,7 +3384,7 @@ img, picture, video, canvas {
     opacity: 0;
   }
 }
-@keyframes styles_slideInFromTop__ly8gs74 {
+@keyframes styles_slideInFromTop__1ovcrev4 {
   0% {
     transform: translateY(8px);
     opacity: 0;
@@ -3394,7 +3394,7 @@ img, picture, video, canvas {
     opacity: 1;
   }
 }
-@keyframes styles_slideInFromBottom__ly8gs75 {
+@keyframes styles_slideInFromBottom__1ovcrev5 {
   0% {
     transform: translateY(-8px);
     opacity: 0;
@@ -3404,7 +3404,7 @@ img, picture, video, canvas {
     opacity: 1;
   }
 }
-@keyframes styles_slideInFromEnd__ly8gs76 {
+@keyframes styles_slideInFromEnd__1ovcrev6 {
   0% {
     transform: translateX(-8px);
     opacity: 0;
@@ -3414,7 +3414,7 @@ img, picture, video, canvas {
     opacity: 1;
   }
 }
-@keyframes styles_slideInFromStart__ly8gs77 {
+@keyframes styles_slideInFromStart__1ovcrev7 {
   0% {
     transform: translateX(8px);
     opacity: 0;
@@ -3424,7 +3424,7 @@ img, picture, video, canvas {
     opacity: 1;
   }
 }
-.styles_content__ly8gs78 {
+.styles_content__1ovcrev8 {
   z-index: 50;
   background-color: var(--colors-background-tooltip);
   color: var(--colors-background-paper);
@@ -3434,54 +3434,63 @@ img, picture, video, canvas {
   font-weight: var(--fontWeight-semibold);
   text-align: center;
   width: fit-content;
-  transform-origin: var(--bits-tooltip-content-transform-origin);
-  animation: styles_fadeIn__ly8gs70 150ms ease-out, styles_zoomIn__ly8gs72 150ms ease-out;
+  animation: styles_fadeIn__1ovcrev0 150ms ease-out, styles_zoomIn__1ovcrev2 150ms ease-out;
   text-wrap: balance;
   line-height: var(--lineHeight-none);
 }
-.styles_content__ly8gs78[data-state="closed"] {
-  animation: styles_fadeOut__ly8gs71 150ms ease-out, styles_zoomOut__ly8gs73 150ms ease-out;
+.styles_content__1ovcrev8[data-state="closed"] {
+  animation: styles_fadeOut__1ovcrev1 150ms ease-out, styles_zoomOut__1ovcrev3 150ms ease-out;
 }
-.styles_content__ly8gs78[data-side="bottom"] {
-  animation: styles_fadeIn__ly8gs70 150ms ease-out, styles_slideInFromTop__ly8gs74 150ms ease-out;
+.styles_content__1ovcrev8[data-side="bottom"] {
+  animation: styles_fadeIn__1ovcrev0 150ms ease-out, styles_slideInFromTop__1ovcrev4 150ms ease-out;
 }
-.styles_content__ly8gs78[data-side="left"] {
-  animation: styles_fadeIn__ly8gs70 150ms ease-out, styles_slideInFromEnd__ly8gs76 150ms ease-out;
+.styles_content__1ovcrev8[data-side="left"] {
+  animation: styles_fadeIn__1ovcrev0 150ms ease-out, styles_slideInFromEnd__1ovcrev6 150ms ease-out;
 }
-.styles_content__ly8gs78[data-side="right"] {
-  animation: styles_fadeIn__ly8gs70 150ms ease-out, styles_slideInFromStart__ly8gs77 150ms ease-out;
+.styles_content__1ovcrev8[data-side="right"] {
+  animation: styles_fadeIn__1ovcrev0 150ms ease-out, styles_slideInFromStart__1ovcrev7 150ms ease-out;
 }
-.styles_content__ly8gs78[data-side="top"] {
-  animation: styles_fadeIn__ly8gs70 150ms ease-out, styles_slideInFromBottom__ly8gs75 150ms ease-out;
+.styles_content__1ovcrev8[data-side="top"] {
+  animation: styles_fadeIn__1ovcrev0 150ms ease-out, styles_slideInFromBottom__1ovcrev5 150ms ease-out;
 }
-.styles_content__ly8gs78[data-side="bottom"][data-state="closed"] {
-  animation: styles_fadeOut__ly8gs71 150ms ease-out, styles_zoomOut__ly8gs73 150ms ease-out, styles_slideInFromTop__ly8gs74 150ms ease-out reverse;
+.styles_content__1ovcrev8[data-side="bottom"][data-state="closed"] {
+  animation: styles_fadeOut__1ovcrev1 150ms ease-out, styles_zoomOut__1ovcrev3 150ms ease-out, styles_slideInFromTop__1ovcrev4 150ms ease-out reverse;
 }
-.styles_content__ly8gs78[data-side="left"][data-state="closed"] {
-  animation: styles_fadeOut__ly8gs71 150ms ease-out, styles_zoomOut__ly8gs73 150ms ease-out, styles_slideInFromEnd__ly8gs76 150ms ease-out reverse;
+.styles_content__1ovcrev8[data-side="left"][data-state="closed"] {
+  animation: styles_fadeOut__1ovcrev1 150ms ease-out, styles_zoomOut__1ovcrev3 150ms ease-out, styles_slideInFromEnd__1ovcrev6 150ms ease-out reverse;
 }
-.styles_content__ly8gs78[data-side="right"][data-state="closed"] {
-  animation: styles_fadeOut__ly8gs71 150ms ease-out, styles_zoomOut__ly8gs73 150ms ease-out, styles_slideInFromStart__ly8gs77 150ms ease-out reverse;
+.styles_content__1ovcrev8[data-side="right"][data-state="closed"] {
+  animation: styles_fadeOut__1ovcrev1 150ms ease-out, styles_zoomOut__1ovcrev3 150ms ease-out, styles_slideInFromStart__1ovcrev7 150ms ease-out reverse;
 }
-.styles_content__ly8gs78[data-side="top"][data-state="closed"] {
-  animation: styles_fadeOut__ly8gs71 150ms ease-out, styles_zoomOut__ly8gs73 150ms ease-out, styles_slideInFromBottom__ly8gs75 150ms ease-out reverse;
+.styles_content__1ovcrev8[data-side="top"][data-state="closed"] {
+  animation: styles_fadeOut__1ovcrev1 150ms ease-out, styles_zoomOut__1ovcrev3 150ms ease-out, styles_slideInFromBottom__1ovcrev5 150ms ease-out reverse;
 }
-.styles_arrow__ly8gs79 {
+.styles_arrow__1ovcrev9 {
   fill: var(--colors-background-tooltip);
   width: 14px;
-  height: 14px;
+  height: 8px;
+  position: absolute;
+  pointer-events: none;
 }
-.styles_arrow__ly8gs79[data-side="top"] {
-  translate: 0 -5px;
+.styles_arrow__1ovcrev9[data-side="top"] {
+  bottom: 1px;
+  left: 50%;
+  transform: translateX(-50%) translateY(100%);
 }
-.styles_arrow__ly8gs79[data-side="bottom"] {
-  translate: 0 5px;
+.styles_arrow__1ovcrev9[data-side="bottom"] {
+  top: 1px;
+  left: 50%;
+  transform: translateX(-50%) translateY(-100%) rotate(180deg);
 }
-.styles_arrow__ly8gs79[data-side="right"] {
-  translate: 5px 0;
+.styles_arrow__1ovcrev9[data-side="left"] {
+  right: 4px;
+  top: 50%;
+  transform: translateY(-50%) translateX(100%) rotate(-90deg);
 }
-.styles_arrow__ly8gs79[data-side="left"] {
-  translate: -5px 0;
+.styles_arrow__1ovcrev9[data-side="right"] {
+  left: 4px;
+  top: 50%;
+  transform: translateY(-50%) translateX(-100%) rotate(90deg);
 }
 .styles_variants_h1__13e75lj0 {
   font-size: var(--fontSize-4xl);

package/dist/components/Portal/Portal.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { Snippet } from 'svelte';
+type $$ComponentProps = {
+    children?: Snippet;
+    target?: HTMLElement;
+    disabled?: boolean;
+};
+declare const Portal: import("svelte").Component<$$ComponentProps, {}, "">;
+type Portal = ReturnType<typeof Portal>;
+export default Portal;

package/dist/components/Portal/index.d.ts

@@ -0,0 +1 @@
+export { default as Portal } from './Portal.svelte';

package/dist/components/Tooltip/index.d.ts

@@ -1,2 +1,2 @@
 export { default as Tooltip } from './Tooltip.svelte';
-export type { TooltipProps } from './types';
+export type { TooltipAlign, TooltipProps, TooltipSide } from './types';

package/dist/components/Tooltip/types.d.ts

@@ -1,13 +1,16 @@
-import type { Tooltip } from 'bits-ui';
 import type { Snippet } from 'svelte';
-export type TooltipProps<Payload = never> = Tooltip.RootProps & {
+export type TooltipSide = 'top' | 'bottom' | 'left' | 'right';
+export type TooltipAlign = 'start' | 'center' | 'end';
+export type TooltipProps = {
+    open?: boolean;
+    delayDuration?: number;
     content?: Snippet<[]> | string;
+    children?: Snippet<[]>;
     arrow?: boolean;
-    align?: Tooltip.ContentProps['align'];
+    align?: TooltipAlign;
     sideOffset?: number;
     alignOffset?: number;
-    side?: Tooltip.ContentProps['side'];
+    side?: TooltipSide;
     class?: string;
     arrowClass?: string;
-    payload?: [Payload] extends [never] ? null : Payload | null;
 };

package/dist/components/index.d.ts

@@ -23,6 +23,7 @@ export { Item, type ItemProps, type ItemSize, type ItemVariant, } from './Item';
 export { Label } from './Label';
 export { Placeholder, type PlaceholderProps, type PlaceholderSize, } from './Placeholder';
 export { Popover, type PopoverProps } from './Popover';
+export { Portal } from './Portal';
 export { RangeInput, type RangeInputProps, type RangeInputSize, } from './RangeInput';
 export { ScalableContainer, type ScalableContainerProps, } from './ScalableContainer';
 export { Select } from './Select';
@@ -31,5 +32,5 @@ export { Slider, type SliderProps } from './Slider';
 export { SliderInput, type SliderInputProps } from './SliderInput';
 export { Spinner, type SpinnerSize } from './Spinner';
 export { Tabs, type TabsProps } from './Tabs';
-export { Tooltip, type TooltipProps } from './Tooltip';
+export { Tooltip, type TooltipAlign, type TooltipProps, type TooltipSide, } from './Tooltip';
 export { Typography, type TypographyAlign, type TypographyColor, type TypographyProps, type TypographyVariant, } from './Typography';

package/dist/components/index.js

@@ -27,6 +27,7 @@ import Input from "../src/components/Input/Input.js";
 import { InputGroup } from "../src/components/InputGroup/index.js";
 import { Item } from "../src/components/Item/index.js";
 import { Popover } from "../src/components/Popover/index.js";
+import Portal from "../src/components/Portal/Portal.js";
 import Slider from "../src/components/Slider/Slider.js";
 import RangeInput from "../src/components/RangeInput/RangeInput.js";
 import ScalableContainer from "../src/components/ScalableContainer/ScalableContainer.js";
@@ -34,4 +35,4 @@ import { Select } from "../src/components/Select/index.js";
 import SliderInput from "../src/components/SliderInput/SliderInput.js";
 import { Tabs } from "../src/components/Tabs/index.js";
 import Tooltip from "../src/components/Tooltip/Tooltip.js";
-export { Accordion, Alert, Badge, Button, ButtonGroup, Calendar, Card, Carousel, Checkbox, CircularProgress, ContentState, DataGrid, DataGridSortHeader, Dialog, Drawer, DropdownMenu_exports as DropdownMenu, Empty, Field, Input, InputGroup, Item, Label_1 as Label, Placeholder, Popover, RangeInput, ScalableContainer, Select, Separator, Slider, SliderInput, Spinner, Tabs, Tooltip, Typography, badgeVariants, buttonVariants };
+export { Accordion, Alert, Badge, Button, ButtonGroup, Calendar, Card, Carousel, Checkbox, CircularProgress, ContentState, DataGrid, DataGridSortHeader, Dialog, Drawer, DropdownMenu_exports as DropdownMenu, Empty, Field, Input, InputGroup, Item, Label_1 as Label, Placeholder, Popover, Portal, RangeInput, ScalableContainer, Select, Separator, Slider, SliderInput, Spinner, Tabs, Tooltip, Typography, badgeVariants, buttonVariants };

package/dist/src/components/Portal/Portal.js

@@ -0,0 +1,40 @@
+import "svelte/internal/disclose-version";
+import * as $ from "svelte/internal/client";
+//#region src/components/Portal/Portal.svelte
+var root_2 = $.from_html(`<div data-portal="" style="display: contents;"><!></div>`);
+function Portal($$anchor, $$props) {
+	$.push($$props, true);
+	let disabled = $.prop($$props, "disabled", 3, false);
+	let portalEl = $.state(void 0);
+	$.user_effect(() => {
+		if (!$.get(portalEl) || disabled()) return;
+		($$props.target ?? document.body).appendChild($.get(portalEl));
+		return () => {
+			$.get(portalEl)?.remove();
+		};
+	});
+	var fragment = $.comment();
+	var node = $.first_child(fragment);
+	var consequent = ($$anchor) => {
+		var fragment_1 = $.comment();
+		var node_1 = $.first_child(fragment_1);
+		$.snippet(node_1, () => $$props.children ?? $.noop);
+		$.append($$anchor, fragment_1);
+	};
+	var alternate = ($$anchor) => {
+		var div = root_2();
+		var node_2 = $.child(div);
+		$.snippet(node_2, () => $$props.children ?? $.noop);
+		$.reset(div);
+		$.bind_this(div, ($$value) => $.set(portalEl, $$value), () => $.get(portalEl));
+		$.append($$anchor, div);
+	};
+	$.if(node, ($$render) => {
+		if (disabled()) $$render(consequent);
+		else $$render(alternate, -1);
+	});
+	$.append($$anchor, fragment);
+	$.pop();
+}
+//#endregion
+export { Portal as default };

package/dist/src/components/Tooltip/Tooltip.js

@@ -1,109 +1,186 @@
-import Content from "./Content/Content.js";
-import Provider from "./Provider/Provider.js";
-import Trigger from "./Trigger/Trigger.js";
+import Portal from "../Portal/Portal.js";
+import __default__ from "./styles.css.js";
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
-import { Tooltip } from "bits-ui";
+import { tick, untrack } from "svelte";
 //#region src/components/Tooltip/Tooltip.svelte
-var root_2 = $.from_html(`<!> <!>`, 1);
-function Tooltip$1($$anchor, $$props) {
+var root_5 = $.from_svg(`<svg viewBox="0 0 7.68 4.35" xmlns="http://www.w3.org/2000/svg"><path d="m 0.52372243,0.10910656 c -0.1676883,0 -0.3188698,0.10099765 -0.38304509,0.25594925 -0.0641698,0.1548964 -0.0287017,0.3332318 0.0898753,0.4518088 L 3.5473966,4.1337031 c 0.077725,0.07778 0.1832001,0.1214516 0.2931533,0.1214516 0.1099531,0 0.2154286,-0.043672 0.2932085,-0.1214516 L 7.4505968,0.81686461 c 0.118577,-0.118577 0.1540119,-0.2969124 0.089831,-0.4518088 C 7.476247,0.21010421 7.3251098,0.10910656 7.1573882,0.10910656 Z" fill="inherit"></path></svg>`);
+var root_2 = $.from_html(`<div role="tooltip" data-slot="tooltip-content"><!> <!></div>`);
+var root = $.from_html(`<span style="display: contents;" data-slot="tooltip-trigger"><!></span> <!>`, 1);
+function Tooltip($$anchor, $$props) {
 	$.push($$props, true);
-	let open = $.prop($$props, "open", 15, false), alignOffset = $.prop($$props, "alignOffset", 3, 0), sideOffset = $.prop($$props, "sideOffset", 3, 4), side = $.prop($$props, "side", 3, "top"), triggerId = $.prop($$props, "triggerId", 3, null), payload = $.prop($$props, "payload", 3, null), restProps = $.rest_props($$props, [
-		"$$slots",
-		"$$events",
-		"$$legacy",
-		"open",
-		"children",
-		"content",
-		"class",
-		"alignOffset",
-		"sideOffset",
-		"side",
-		"arrow",
-		"arrowClass",
-		"triggerId",
-		"payload"
-	]);
-	Provider($$anchor, {
-		children: ($$anchor, $$slotProps) => {
-			var fragment_1 = $.comment();
-			var node = $.first_child(fragment_1);
-			$.component(node, () => Tooltip.Root, ($$anchor, TooltipPrimitive_Root) => {
-				TooltipPrimitive_Root($$anchor, $.spread_props(() => restProps, {
-					get open() {
-						return open();
-					},
-					set open($$value) {
-						open($$value);
-					},
-					children: ($$anchor, $$slotProps) => {
-						var fragment_2 = root_2();
-						var node_1 = $.first_child(fragment_2);
-						Trigger(node_1, {
-							children: ($$anchor, $$slotProps) => {
-								var fragment_3 = $.comment();
-								var node_2 = $.first_child(fragment_3);
-								$.snippet(node_2, () => $$props.children ?? $.noop, () => ({
-									open: open(),
-									triggerId: triggerId(),
-									payload: payload()
-								}));
-								$.append($$anchor, fragment_3);
-							},
-							$$slots: { default: true }
-						});
-						Content($.sibling(node_1, 2), {
-							get class() {
-								return $$props.class;
-							},
-							get alignOffset() {
-								return alignOffset();
-							},
-							get sideOffset() {
-								return sideOffset();
-							},
-							get arrowClass() {
-								return $$props.arrowClass;
-							},
-							get side() {
-								return side();
-							},
-							get arrow() {
-								return $$props.arrow;
-							},
-							hideWhenDetached: true,
-							children: ($$anchor, $$slotProps) => {
-								var fragment_4 = $.comment();
-								var node_4 = $.first_child(fragment_4);
-								var consequent = ($$anchor) => {
-									var text = $.text();
-									$.template_effect(() => $.set_text(text, $$props.content));
-									$.append($$anchor, text);
-								};
-								var alternate = ($$anchor) => {
-									var fragment_6 = $.comment();
-									var node_5 = $.first_child(fragment_6);
-									$.snippet(node_5, () => $$props.content ?? $.noop);
-									$.append($$anchor, fragment_6);
-								};
-								$.if(node_4, ($$render) => {
-									if (typeof $$props.content === "string") $$render(consequent);
-									else $$render(alternate, -1);
-								});
-								$.append($$anchor, fragment_4);
-							},
-							$$slots: { default: true }
-						});
-						$.append($$anchor, fragment_2);
-					},
-					$$slots: { default: true }
-				}));
-			});
-			$.append($$anchor, fragment_1);
-		},
-		$$slots: { default: true }
+	const ANIMATION_DURATION = 150;
+	let open = $.prop($$props, "open", 15, false), alignOffset = $.prop($$props, "alignOffset", 3, 0), sideOffset = $.prop($$props, "sideOffset", 3, 10), side = $.prop($$props, "side", 3, "top"), align = $.prop($$props, "align", 3, "center"), arrow = $.prop($$props, "arrow", 3, false), delayDuration = $.prop($$props, "delayDuration", 3, 200);
+	let triggerEl;
+	let contentEl = $.state(void 0);
+	let visible = $.state(false);
+	let delayTimer;
+	let closeTimer;
+	let position = $.state({
+		top: 0,
+		left: 0
 	});
+	const tooltipId = `tooltip-${Math.random().toString(36).slice(2, 11)}`;
+	function updatePosition() {
+		if (!triggerEl || !$.get(contentEl)) return;
+		const triggerRect = triggerEl.getBoundingClientRect();
+		const contentRect = $.get(contentEl).getBoundingClientRect();
+		let top = 0;
+		let left = 0;
+		switch (side()) {
+			case "top":
+				top = triggerRect.top - contentRect.height - sideOffset();
+				left = triggerRect.left + (triggerRect.width - contentRect.width) / 2;
+				break;
+			case "bottom":
+				top = triggerRect.bottom + sideOffset();
+				left = triggerRect.left + (triggerRect.width - contentRect.width) / 2;
+				break;
+			case "left":
+				top = triggerRect.top + (triggerRect.height - contentRect.height) / 2;
+				left = triggerRect.left - contentRect.width - sideOffset();
+				break;
+			case "right":
+				top = triggerRect.top + (triggerRect.height - contentRect.height) / 2;
+				left = triggerRect.right + sideOffset();
+				break;
+		}
+		if (side() === "top" || side() === "bottom") if (align() === "start") left = triggerRect.left + alignOffset();
+		else if (align() === "end") left = triggerRect.right - contentRect.width - alignOffset();
+		else left += alignOffset();
+		else if (align() === "start") top = triggerRect.top + alignOffset();
+		else if (align() === "end") top = triggerRect.bottom - contentRect.height - alignOffset();
+		else top += alignOffset();
+		$.set(position, {
+			top,
+			left
+		});
+	}
+	function show() {
+		clearTimeout(closeTimer);
+		clearTimeout(delayTimer);
+		delayTimer = setTimeout(async () => {
+			open(true);
+		}, delayDuration());
+	}
+	function hide() {
+		clearTimeout(delayTimer);
+		open(false);
+	}
+	function handleKeydown(event) {
+		if (event.key === "Escape" && open()) hide();
+	}
+	$.user_effect(() => {
+		if (open()) {
+			clearTimeout(closeTimer);
+			$.set(visible, true);
+			tick().then(updatePosition);
+		} else if (untrack(() => $.get(visible))) closeTimer = setTimeout(() => {
+			$.set(visible, false);
+		}, ANIMATION_DURATION);
+	});
+	$.user_effect(() => {
+		if (!open()) return;
+		window.addEventListener("scroll", updatePosition, true);
+		window.addEventListener("resize", updatePosition);
+		return () => {
+			window.removeEventListener("scroll", updatePosition, true);
+			window.removeEventListener("resize", updatePosition);
+		};
+	});
+	$.user_effect(() => {
+		return () => {
+			clearTimeout(delayTimer);
+			clearTimeout(closeTimer);
+		};
+	});
+	function attachTrigger(node) {
+		const el = node.firstElementChild;
+		if (!el) return;
+		triggerEl = el;
+		el.addEventListener("mouseenter", show);
+		el.addEventListener("mouseleave", hide);
+		el.addEventListener("focusin", show);
+		el.addEventListener("focusout", hide);
+		el.setAttribute("aria-describedby", tooltipId);
+		return () => {
+			el.removeEventListener("mouseenter", show);
+			el.removeEventListener("mouseleave", hide);
+			el.removeEventListener("focusin", show);
+			el.removeEventListener("focusout", hide);
+			el.removeAttribute("aria-describedby");
+			triggerEl = void 0;
+		};
+	}
+	var fragment = root();
+	$.event("keydown", $.window, handleKeydown);
+	var span = $.first_child(fragment);
+	var node_1 = $.child(span);
+	$.snippet(node_1, () => $$props.children ?? $.noop);
+	$.reset(span);
+	$.attach(span, () => attachTrigger);
+	var node_2 = $.sibling(span, 2);
+	var consequent_2 = ($$anchor) => {
+		Portal($$anchor, {
+			children: ($$anchor, $$slotProps) => {
+				var div = root_2();
+				let styles_1;
+				var node_3 = $.child(div);
+				var consequent = ($$anchor) => {
+					var text = $.text();
+					$.template_effect(() => $.set_text(text, $$props.content));
+					$.append($$anchor, text);
+				};
+				var alternate = ($$anchor) => {
+					var fragment_3 = $.comment();
+					var node_4 = $.first_child(fragment_3);
+					$.snippet(node_4, () => $$props.content ?? $.noop);
+					$.append($$anchor, fragment_3);
+				};
+				$.if(node_3, ($$render) => {
+					if (typeof $$props.content === "string") $$render(consequent);
+					else $$render(alternate, -1);
+				});
+				var node_5 = $.sibling(node_3, 2);
+				var consequent_1 = ($$anchor) => {
+					var svg = root_5();
+					$.template_effect(() => {
+						$.set_class(svg, 0, $.clsx([__default__.arrow, $$props.arrowClass]));
+						$.set_attribute(svg, "data-side", side());
+					});
+					$.append($$anchor, svg);
+				};
+				$.if(node_5, ($$render) => {
+					if (arrow()) $$render(consequent_1);
+				});
+				$.reset(div);
+				$.bind_this(div, ($$value) => $.set(contentEl, $$value), () => $.get(contentEl));
+				$.template_effect(() => {
+					$.set_attribute(div, "id", tooltipId);
+					$.set_attribute(div, "data-state", open() ? "open" : "closed");
+					$.set_attribute(div, "data-side", side());
+					$.set_class(div, 1, $.clsx([__default__.content, $$props.class]));
+					styles_1 = $.set_style(div, "", styles_1, {
+						position: "fixed",
+						top: `${$.get(position).top ?? ""}px`,
+						left: `${$.get(position).left ?? ""}px`
+					});
+				});
+				$.event("mouseenter", div, () => {
+					clearTimeout(closeTimer);
+					clearTimeout(delayTimer);
+				});
+				$.event("mouseleave", div, hide);
+				$.append($$anchor, div);
+			},
+			$$slots: { default: true }
+		});
+	};
+	$.if(node_2, ($$render) => {
+		if ($.get(visible)) $$render(consequent_2);
+	});
+	$.append($$anchor, fragment);
 	$.pop();
 }
 //#endregion
-export { Tooltip$1 as default };
+export { Tooltip as default };

package/dist/src/components/Tooltip/index.d.ts

@@ -1,2 +1,2 @@
 import Tooltip from "./Tooltip.js";
-import { TooltipProps } from "./types.js";
+import { TooltipAlign, TooltipProps, TooltipSide } from "./types.js";

package/dist/src/components/Tooltip/styles.css.js

@@ -0,0 +1,7 @@
+//#region src/components/Tooltip/styles.css.ts
+var __default__ = {
+	content: "styles_content__1ovcrev8",
+	arrow: "styles_arrow__1ovcrev9"
+};
+//#endregion
+export { __default__ as default };

package/dist/src/components/Tooltip/types.d.ts

@@ -1,17 +1,20 @@
-import { Tooltip } from "bits-ui";
 import { Snippet } from "svelte";
 
 //#region src/components/Tooltip/types.d.ts
-type TooltipProps<Payload = never> = Tooltip.RootProps & {
+type TooltipSide = 'top' | 'bottom' | 'left' | 'right';
+type TooltipAlign = 'start' | 'center' | 'end';
+type TooltipProps = {
+  open?: boolean;
+  delayDuration?: number;
   content?: Snippet<[]> | string;
+  children?: Snippet<[]>;
   arrow?: boolean;
-  align?: Tooltip.ContentProps['align'];
+  align?: TooltipAlign;
   sideOffset?: number;
   alignOffset?: number;
-  side?: Tooltip.ContentProps['side'];
+  side?: TooltipSide;
   class?: string;
   arrowClass?: string;
-  payload?: [Payload] extends [never] ? null : Payload | null;
 };
 //#endregion
-export { TooltipProps };
+export { TooltipAlign, TooltipProps, TooltipSide };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@max-ts/svelte",
-  "version": "1.10.5",
+  "version": "1.10.6",
   "type": "module",
   "description": "Svelte component library.",
   "author": "Tsepelev Maksim",

package/dist/components/Tooltip/Content/Content.svelte.d.ts

@@ -1,12 +0,0 @@
-import { Tooltip as TooltipPrimitive } from 'bits-ui';
-import type { ComponentProps } from 'svelte';
-import type { WithoutChildrenOrChild } from '../../../types.ts';
-import { Portal } from '../Portal';
-type $$ComponentProps = TooltipPrimitive.ContentProps & {
-    arrowClass?: string;
-    arrow?: boolean;
-    portalProps?: WithoutChildrenOrChild<ComponentProps<typeof Portal>>;
-};
-declare const Content: import("svelte").Component<$$ComponentProps, {}, "ref">;
-type Content = ReturnType<typeof Content>;
-export default Content;

package/dist/components/Tooltip/Content/index.d.ts

@@ -1 +0,0 @@
-export { default as Content } from './Content.svelte';

package/dist/components/Tooltip/Portal/Portal.svelte.d.ts

@@ -1,4 +0,0 @@
-import { Tooltip as TooltipPrimitive } from 'bits-ui';
-declare const Portal: import("svelte").Component<TooltipPrimitive.PortalProps, {}, "">;
-type Portal = ReturnType<typeof Portal>;
-export default Portal;

package/dist/components/Tooltip/Portal/index.d.ts

@@ -1,2 +0,0 @@
-import Portal from './Portal.svelte';
-export { Portal };

package/dist/components/Tooltip/Provider/Provider.svelte.d.ts

@@ -1,4 +0,0 @@
-import { Tooltip as TooltipPrimitive } from 'bits-ui';
-declare const Provider: import("svelte").Component<TooltipPrimitive.ProviderProps, {}, "">;
-type Provider = ReturnType<typeof Provider>;
-export default Provider;

package/dist/components/Tooltip/Provider/index.d.ts

@@ -1,2 +0,0 @@
-import Provider from './Provider.svelte';
-export { Provider };

package/dist/components/Tooltip/Trigger/Trigger.svelte.d.ts

@@ -1,4 +0,0 @@
-import { Tooltip as TooltipPrimitive } from 'bits-ui';
-declare const Trigger: import("svelte").Component<TooltipPrimitive.TriggerProps, {}, "ref">;
-type Trigger = ReturnType<typeof Trigger>;
-export default Trigger;

package/dist/components/Tooltip/Trigger/index.d.ts

@@ -1 +0,0 @@
-export { default as Trigger } from './Trigger.svelte';

package/dist/src/components/Tooltip/Content/Content.js

@@ -1,94 +0,0 @@
-import Portal from "../Portal/Portal.js";
-import __default__ from "./styles.css.js";
-import "svelte/internal/disclose-version";
-import * as $ from "svelte/internal/client";
-import { Tooltip } from "bits-ui";
-//#region src/components/Tooltip/Content/Content.svelte
-var root_4 = $.from_svg(`<svg><path d="m 0.52372243,0.10910656 c -0.1676883,0 -0.3188698,0.10099765 -0.38304509,0.25594925 -0.0641698,0.1548964 -0.0287017,0.3332318 0.0898753,0.4518088 L 3.5473966,4.1337031 c 0.077725,0.07778 0.1832001,0.1214516 0.2931533,0.1214516 0.1099531,0 0.2154286,-0.043672 0.2932085,-0.1214516 L 7.4505968,0.81686461 c 0.118577,-0.118577 0.1540119,-0.2969124 0.089831,-0.4518088 C 7.476247,0.21010421 7.3251098,0.10910656 7.1573882,0.10910656 Z" fill="inherit"></path></svg>`);
-var root_2 = $.from_html(`<!> <!>`, 1);
-function Content($$anchor, $$props) {
-	$.push($$props, true);
-	let ref = $.prop($$props, "ref", 15, null), sideOffset = $.prop($$props, "sideOffset", 3, 0), side = $.prop($$props, "side", 3, "top"), restProps = $.rest_props($$props, [
-		"$$slots",
-		"$$events",
-		"$$legacy",
-		"ref",
-		"class",
-		"sideOffset",
-		"side",
-		"children",
-		"arrowClass",
-		"portalProps",
-		"arrow"
-	]);
-	Portal($$anchor, $.spread_props(() => $$props.portalProps, {
-		children: ($$anchor, $$slotProps) => {
-			var fragment_1 = $.comment();
-			var node = $.first_child(fragment_1);
-			{
-				let $0 = $.derived(() => [__default__.content, $$props.class]);
-				$.component(node, () => Tooltip.Content, ($$anchor, TooltipPrimitive_Content) => {
-					TooltipPrimitive_Content($$anchor, $.spread_props({
-						"data-slot": "tooltip-content",
-						get sideOffset() {
-							return sideOffset();
-						},
-						get side() {
-							return side();
-						},
-						get class() {
-							return $.get($0);
-						}
-					}, () => restProps, {
-						get ref() {
-							return ref();
-						},
-						set ref($$value) {
-							ref($$value);
-						},
-						children: ($$anchor, $$slotProps) => {
-							var fragment_2 = root_2();
-							var node_1 = $.first_child(fragment_2);
-							$.snippet(node_1, () => $$props.children ?? $.noop);
-							var node_2 = $.sibling(node_1, 2);
-							var consequent = ($$anchor) => {
-								var fragment_3 = $.comment();
-								var node_3 = $.first_child(fragment_3);
-								{
-									const child = ($$anchor, $$arg0) => {
-										let props = () => $$arg0?.().props;
-										var svg = root_4();
-										$.attribute_effect(svg, () => ({
-											class: [__default__.arrow, $$props.arrowClass],
-											viewBox: "0 0 7.68 4.35",
-											xmlns: "http://www.w3.org/2000/svg",
-											...props()
-										}));
-										$.append($$anchor, svg);
-									};
-									$.component(node_3, () => Tooltip.Arrow, ($$anchor, TooltipPrimitive_Arrow) => {
-										TooltipPrimitive_Arrow($$anchor, {
-											child,
-											$$slots: { child: true }
-										});
-									});
-								}
-								$.append($$anchor, fragment_3);
-							};
-							$.if(node_2, ($$render) => {
-								if ($$props.arrow) $$render(consequent);
-							});
-							$.append($$anchor, fragment_2);
-						},
-						$$slots: { default: true }
-					}));
-				});
-			}
-			$.append($$anchor, fragment_1);
-		},
-		$$slots: { default: true }
-	}));
-	$.pop();
-}
-//#endregion
-export { Content as default };

package/dist/src/components/Tooltip/Content/styles.css.js

@@ -1,7 +0,0 @@
-//#region src/components/Tooltip/Content/styles.css.ts
-var __default__ = {
-	content: "styles_content__ly8gs78",
-	arrow: "styles_arrow__ly8gs79"
-};
-//#endregion
-export { __default__ as default };

package/dist/src/components/Tooltip/Portal/Portal.js

@@ -1,19 +0,0 @@
-import "svelte/internal/disclose-version";
-import * as $ from "svelte/internal/client";
-import { Tooltip } from "bits-ui";
-//#region src/components/Tooltip/Portal/Portal.svelte
-function Portal($$anchor, $$props) {
-	let restProps = $.rest_props($$props, [
-		"$$slots",
-		"$$events",
-		"$$legacy"
-	]);
-	var fragment = $.comment();
-	var node = $.first_child(fragment);
-	$.component(node, () => Tooltip.Portal, ($$anchor, TooltipPrimitive_Portal) => {
-		TooltipPrimitive_Portal($$anchor, $.spread_props(() => restProps));
-	});
-	$.append($$anchor, fragment);
-}
-//#endregion
-export { Portal as default };

package/dist/src/components/Tooltip/Provider/Provider.js

@@ -1,19 +0,0 @@
-import "svelte/internal/disclose-version";
-import * as $ from "svelte/internal/client";
-import { Tooltip } from "bits-ui";
-//#region src/components/Tooltip/Provider/Provider.svelte
-function Provider($$anchor, $$props) {
-	let restProps = $.rest_props($$props, [
-		"$$slots",
-		"$$events",
-		"$$legacy"
-	]);
-	var fragment = $.comment();
-	var node = $.first_child(fragment);
-	$.component(node, () => Tooltip.Provider, ($$anchor, TooltipPrimitive_Provider) => {
-		TooltipPrimitive_Provider($$anchor, $.spread_props(() => restProps));
-	});
-	$.append($$anchor, fragment);
-}
-//#endregion
-export { Provider as default };

package/dist/src/components/Tooltip/Trigger/Trigger.js

@@ -1,29 +0,0 @@
-import "svelte/internal/disclose-version";
-import * as $ from "svelte/internal/client";
-import { Tooltip } from "bits-ui";
-//#region src/components/Tooltip/Trigger/Trigger.svelte
-function Trigger($$anchor, $$props) {
-	$.push($$props, true);
-	let ref = $.prop($$props, "ref", 15, null), restProps = $.rest_props($$props, [
-		"$$slots",
-		"$$events",
-		"$$legacy",
-		"ref"
-	]);
-	var fragment = $.comment();
-	var node = $.first_child(fragment);
-	$.component(node, () => Tooltip.Trigger, ($$anchor, TooltipPrimitive_Trigger) => {
-		TooltipPrimitive_Trigger($$anchor, $.spread_props({ "data-slot": "tooltip-trigger" }, () => restProps, {
-			get ref() {
-				return ref();
-			},
-			set ref($$value) {
-				ref($$value);
-			}
-		}));
-	});
-	$.append($$anchor, fragment);
-	$.pop();
-}
-//#endregion
-export { Trigger as default };