@leavepulse/ui 0.24.1 → 0.25.0

package/dist/chunks/LpProgress-DoIP4jQR.js

@@ -0,0 +1,198 @@
+import { defineComponent, ref, onBeforeUnmount, watch, computed, openBlock, createBlock, unref, normalizeStyle, withCtx, createElementBlock, createElementVNode, Fragment, createTextVNode, toDisplayString, createCommentVNode, createVNode, normalizeClass } from "vue";
+import { ProgressRoot, ProgressIndicator } from "reka-ui";
+import { prefersReducedMotion, easeOut } from "../composables/easing.js";
+import { useReveal } from "../composables/useReveal.js";
+import { _ as _sfc_main$1 } from "./LpNumberFlow-amWYaeuA.js";
+const _hoisted_1 = ["width", "height"];
+const _hoisted_2 = ["cx", "cy", "r", "stroke-width"];
+const _hoisted_3 = ["cx", "cy", "r", "stroke", "stroke-width", "stroke-dasharray"];
+const _hoisted_4 = {
+  key: 0,
+  class: "absolute font-mono text-[11px] font-medium text-ink"
+};
+const _hoisted_5 = {
+  key: 1,
+  class: "flex w-full flex-col gap-1"
+};
+const _hoisted_6 = { class: "flex items-baseline justify-between gap-2 text-xs" };
+const _hoisted_7 = { class: "text-muted" };
+const _hoisted_8 = { class: "font-mono tabular-nums text-muted-strong" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "LpProgress",
+  props: {
+    value: { default: 0 },
+    max: { default: 100 },
+    tone: { default: "brand" },
+    warnAt: { default: 0.8 },
+    dangerAt: { default: 0.9 },
+    title: {},
+    caption: { type: [Boolean, String] },
+    variant: { default: "bar" },
+    size: { default: 44 },
+    thickness: { default: 4 },
+    label: { type: [Boolean, String] },
+    animateOnMount: { type: Boolean, default: true },
+    duration: { default: 900 }
+  },
+  setup(__props) {
+    const props = __props;
+    const eased = ref(props.animateOnMount ? 0 : 1);
+    let raf = 0;
+    let from = props.animateOnMount ? 0 : props.value;
+    const runSweep = (ms) => {
+      if (raf) cancelAnimationFrame(raf);
+      if (prefersReducedMotion() || ms <= 0) {
+        eased.value = 1;
+        return;
+      }
+      const t0 = performance.now();
+      const step = (now) => {
+        const t = Math.min(1, (now - t0) / ms);
+        eased.value = easeOut(t);
+        raf = t < 1 ? requestAnimationFrame(step) : 0;
+      };
+      raf = requestAnimationFrame(step);
+    };
+    onBeforeUnmount(() => {
+      if (raf) cancelAnimationFrame(raf);
+    });
+    const { el: revealAnchor, revealed } = useReveal({ immediate: () => !props.animateOnMount });
+    const bindReveal = (instance) => {
+      revealAnchor.value = instance?.$el ?? null;
+    };
+    watch(revealed, (visible) => {
+      if (visible && props.animateOnMount) runSweep(props.duration);
+    }, { immediate: true });
+    watch(
+      () => [props.value, props.max],
+      () => {
+        from = shown.value;
+        runSweep(props.duration);
+      }
+    );
+    const shown = computed(() => from + (props.value - from) * eased.value);
+    const pct = computed(
+      () => Math.max(0, Math.min(100, shown.value / props.max * 100))
+    );
+    const paintedTone = computed(() => {
+      if (props.tone !== "auto") return props.tone;
+      const fraction = props.max > 0 ? props.value / props.max : 0;
+      if (fraction >= props.dangerAt) return "danger";
+      if (fraction >= props.warnAt) return "accent";
+      return "action";
+    });
+    const captionText = computed(() => {
+      if (props.caption === void 0 || props.caption === false) return "";
+      return typeof props.caption === "string" ? props.caption : `${Math.round(pct.value)}%`;
+    });
+    const bar = {
+      brand: "bg-brand",
+      action: "bg-action",
+      danger: "bg-danger",
+      accent: "bg-accent"
+    };
+    const stroke = {
+      brand: "var(--color-brand)",
+      action: "var(--color-action)",
+      danger: "var(--color-danger)",
+      accent: "var(--color-accent)"
+    };
+    const radius = computed(() => (props.size - props.thickness) / 2);
+    const circumference = computed(() => 2 * Math.PI * radius.value);
+    const dash = computed(() => {
+      const full = circumference.value;
+      const raw = pct.value / 100 * full;
+      if (pct.value >= 100) return full;
+      return Math.min(raw, full - props.thickness * 1.5);
+    });
+    const staticCaption = computed(
+      () => typeof props.label === "string" ? props.label : null
+    );
+    return (_ctx, _cache) => {
+      return __props.variant === "ring" ? (openBlock(), createBlock(unref(ProgressRoot), {
+        key: 0,
+        ref: bindReveal,
+        "model-value": __props.value,
+        max: __props.max,
+        class: "relative inline-flex shrink-0 items-center justify-center",
+        style: normalizeStyle({ width: `${__props.size}px`, height: `${__props.size}px` })
+      }, {
+        default: withCtx(() => [
+          (openBlock(), createElementBlock("svg", {
+            width: __props.size,
+            height: __props.size,
+            class: "-rotate-90"
+          }, [
+            createElementVNode("circle", {
+              cx: __props.size / 2,
+              cy: __props.size / 2,
+              r: radius.value,
+              fill: "none",
+              stroke: "var(--color-surface-soft)",
+              "stroke-width": __props.thickness
+            }, null, 8, _hoisted_2),
+            createElementVNode("circle", {
+              cx: __props.size / 2,
+              cy: __props.size / 2,
+              r: radius.value,
+              fill: "none",
+              stroke: stroke[paintedTone.value],
+              "stroke-width": __props.thickness,
+              "stroke-linecap": "round",
+              "stroke-dasharray": `${dash.value} ${circumference.value - dash.value}`
+            }, null, 8, _hoisted_3)
+          ], 8, _hoisted_1)),
+          __props.label !== false && __props.label !== void 0 ? (openBlock(), createElementBlock("span", _hoisted_4, [
+            staticCaption.value ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+              createTextVNode(toDisplayString(staticCaption.value), 1)
+            ], 64)) : (openBlock(), createBlock(_sfc_main$1, {
+              key: 1,
+              value: pct.value,
+              suffix: "%",
+              duration: 0,
+              "animate-on-mount": false,
+              style: { "--lp-nf-spin": "90ms" }
+            }, null, 8, ["value"]))
+          ])) : createCommentVNode("", true)
+        ]),
+        _: 1
+      }, 8, ["model-value", "max", "style"])) : __props.title || captionText.value ? (openBlock(), createElementBlock("div", _hoisted_5, [
+        createElementVNode("div", _hoisted_6, [
+          createElementVNode("span", _hoisted_7, toDisplayString(__props.title), 1),
+          createElementVNode("span", _hoisted_8, toDisplayString(captionText.value), 1)
+        ]),
+        createVNode(unref(ProgressRoot), {
+          ref: bindReveal,
+          "model-value": __props.value,
+          max: __props.max,
+          class: "h-1.5 w-full overflow-hidden rounded-pill bg-surface-soft"
+        }, {
+          default: withCtx(() => [
+            createVNode(unref(ProgressIndicator), {
+              class: normalizeClass(["h-full rounded-pill transition-colors duration-medium", bar[paintedTone.value]]),
+              style: normalizeStyle({ width: `${pct.value}%` })
+            }, null, 8, ["class", "style"])
+          ]),
+          _: 1
+        }, 8, ["model-value", "max"])
+      ])) : (openBlock(), createBlock(unref(ProgressRoot), {
+        key: 2,
+        ref: bindReveal,
+        "model-value": __props.value,
+        max: __props.max,
+        class: "h-1.5 w-full overflow-hidden rounded-pill bg-surface-soft"
+      }, {
+        default: withCtx(() => [
+          createVNode(unref(ProgressIndicator), {
+            class: normalizeClass(["h-full rounded-pill transition-colors duration-medium", bar[paintedTone.value]]),
+            style: normalizeStyle({ width: `${pct.value}%` })
+          }, null, 8, ["class", "style"])
+        ]),
+        _: 1
+      }, 8, ["model-value", "max"]));
+    };
+  }
+});
+export {
+  _sfc_main as _
+};

package/dist/chunks/LpRollingText-CM5gkSeF.js

@@ -0,0 +1,50 @@
+import { defineComponent, computed, openBlock, createElementBlock, normalizeStyle, normalizeClass, createVNode, Transition, withCtx, renderSlot, createTextVNode, toDisplayString } from "vue";
+import '../assets/LpRollingText-CR1mb0Vt.css';const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "LpRollingText",
+  props: {
+    value: {},
+    mode: { default: "slide" },
+    direction: { default: "up" },
+    duration: { default: 320 },
+    align: { default: "center" }
+  },
+  setup(__props) {
+    const props = __props;
+    const key = computed(() => String(props.value));
+    const name = computed(
+      () => props.mode === "flip" ? "lp-roll-flip" : `lp-roll-${props.direction}`
+    );
+    const justify = computed(
+      () => ({ start: "justify-start", center: "justify-center", end: "justify-end" })[props.align]
+    );
+    const style = computed(() => ({
+      "--lp-roll-duration": `${props.duration}ms`,
+      // The leaving copy is taken out of flow so both can occupy the same line;
+      // without this the box would grow to hold two lines mid-transition.
+      "--lp-roll-perspective": props.mode === "flip" ? "300px" : "none"
+    }));
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("span", {
+        class: normalizeClass(["lp-roll relative inline-flex overflow-hidden align-bottom", justify.value]),
+        style: normalizeStyle(style.value)
+      }, [
+        createVNode(Transition, { name: name.value }, {
+          default: withCtx(() => [
+            (openBlock(), createElementBlock("span", {
+              key: key.value,
+              class: "lp-roll__item"
+            }, [
+              renderSlot(_ctx.$slots, "default", { value: __props.value }, () => [
+                createTextVNode(toDisplayString(__props.value), 1)
+              ])
+            ]))
+          ]),
+          _: 3
+        }, 8, ["name"])
+      ], 6);
+    };
+  }
+});
+export {
+  _sfc_main as _
+};

package/dist/chunks/LpSparkline-C6xQ2dwv.js

@@ -0,0 +1,175 @@
+import { defineComponent, computed, openBlock, createElementBlock, createElementVNode, createCommentVNode, normalizeStyle, normalizeClass } from "vue";
+import { useReveal } from "../composables/useReveal.js";
+import { normalise, extent, linePath, areaPath } from "../components/chart.js";
+import '../assets/LpSparkline-0mKTq7pb.css';const _hoisted_1 = ["width", "height", "viewBox", "aria-label"];
+const _hoisted_2 = { key: 0 };
+const _hoisted_3 = ["stop-color"];
+const _hoisted_4 = ["stop-color"];
+const _hoisted_5 = ["d", "fill"];
+const _hoisted_6 = ["d", "stroke"];
+const _hoisted_7 = ["cx", "cy", "fill"];
+const _hoisted_8 = ["aria-label"];
+const PAD = 2;
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "LpSparkline",
+  props: {
+    data: {},
+    width: { default: 84 },
+    height: { default: 24 },
+    color: {},
+    tone: { default: "brand" },
+    area: { type: Boolean },
+    smooth: { default: 0.9 },
+    showLast: { type: Boolean },
+    min: {},
+    max: {},
+    ariaLabel: {},
+    animate: { type: Boolean, default: true },
+    duration: { default: 900 }
+  },
+  setup(__props) {
+    const props = __props;
+    const TONE = {
+      brand: "var(--color-brand)",
+      action: "var(--color-action)",
+      danger: "var(--color-danger)",
+      accent: "var(--color-accent)",
+      muted: "var(--color-muted)"
+    };
+    const stroke = computed(() => props.color ?? TONE[props.tone]);
+    const series = computed(() => normalise([{ name: "s", data: props.data }]));
+    const box = computed(() => ({
+      width: props.width,
+      height: props.height,
+      left: PAD,
+      right: PAD,
+      top: PAD,
+      bottom: PAD
+    }));
+    const bounds = computed(() => {
+      const auto = extent(series.value, false);
+      return { min: props.min ?? auto.min, max: props.max ?? auto.max };
+    });
+    const geo = computed(() => ({
+      min: bounds.value.min,
+      max: bounds.value.max,
+      box: box.value,
+      count: props.data.length,
+      banded: false
+    }));
+    const d = computed(() => linePath(series.value[0].values, geo.value, props.smooth));
+    const fill = computed(
+      () => props.area ? areaPath(series.value[0].values, geo.value, props.smooth) : ""
+    );
+    const lastPoint = computed(() => {
+      const values = series.value[0].values;
+      for (let i = values.length - 1; i >= 0; i--) {
+        const v = values[i];
+        if (v == null) continue;
+        const span = bounds.value.max - bounds.value.min || 1;
+        const w = props.width - PAD * 2;
+        const h = props.height - PAD * 2;
+        return {
+          x: props.data.length <= 1 ? PAD + w / 2 : PAD + w / (props.data.length - 1) * i,
+          y: PAD + h - (v - bounds.value.min) / span * h,
+          v
+        };
+      }
+      return null;
+    });
+    const hasData = computed(() => series.value[0].values.some((v) => v != null));
+    const label = computed(() => {
+      if (props.ariaLabel) return props.ariaLabel;
+      const values = series.value[0].values.filter((v) => v != null);
+      if (!values.length) return "No data";
+      const first = values[0];
+      const last = values[values.length - 1];
+      const dir = last > first ? "trending up" : last < first ? "trending down" : "flat";
+      return `${dir}, latest ${last}`;
+    });
+    const pathLength = computed(() => {
+      const n = Math.max(1, props.data.length - 1);
+      const segment = Math.hypot((props.width - PAD * 2) / n, props.height - PAD * 2);
+      return Math.ceil(segment * n + 4);
+    });
+    const { el, revealed } = useReveal({ immediate: () => !props.animate });
+    const revealStyle = computed(
+      () => props.animate ? {
+        "--lp-spark-len": `${pathLength.value}`,
+        "--lp-spark-dur": `${props.duration}ms`
+      } : void 0
+    );
+    const revealClass = computed(() => props.animate && !revealed.value ? "lp-spark--waiting" : "");
+    const gradientId = `lp-spark-${Math.random().toString(36).slice(2, 9)}`;
+    return (_ctx, _cache) => {
+      return hasData.value ? (openBlock(), createElementBlock("svg", {
+        key: 0,
+        ref_key: "el",
+        ref: el,
+        width: __props.width,
+        height: __props.height,
+        viewBox: `0 0 ${__props.width} ${__props.height}`,
+        role: "img",
+        "aria-label": label.value,
+        class: "shrink-0 overflow-visible"
+      }, [
+        __props.area ? (openBlock(), createElementBlock("defs", _hoisted_2, [
+          createElementVNode("linearGradient", {
+            id: gradientId,
+            x1: "0",
+            y1: "0",
+            x2: "0",
+            y2: "1"
+          }, [
+            createElementVNode("stop", {
+              offset: "0%",
+              "stop-color": stroke.value,
+              "stop-opacity": "0.3"
+            }, null, 8, _hoisted_3),
+            createElementVNode("stop", {
+              offset: "100%",
+              "stop-color": stroke.value,
+              "stop-opacity": "0.02"
+            }, null, 8, _hoisted_4)
+          ])
+        ])) : createCommentVNode("", true),
+        __props.area ? (openBlock(), createElementBlock("path", {
+          key: 1,
+          d: fill.value,
+          fill: `url(#${gradientId})`,
+          class: normalizeClass(["lp-spark__area", revealClass.value]),
+          style: normalizeStyle(revealStyle.value)
+        }, null, 14, _hoisted_5)) : createCommentVNode("", true),
+        createElementVNode("path", {
+          d: d.value,
+          fill: "none",
+          stroke: stroke.value,
+          "stroke-width": "1.5",
+          "stroke-linecap": "round",
+          "stroke-linejoin": "round",
+          "vector-effect": "non-scaling-stroke",
+          class: normalizeClass(["lp-spark__line", revealClass.value]),
+          style: normalizeStyle(revealStyle.value)
+        }, null, 14, _hoisted_6),
+        __props.showLast && lastPoint.value ? (openBlock(), createElementBlock("circle", {
+          key: 2,
+          cx: lastPoint.value.x,
+          cy: lastPoint.value.y,
+          r: "2",
+          fill: stroke.value,
+          class: normalizeClass(["lp-spark__dot", revealClass.value]),
+          style: normalizeStyle(revealStyle.value)
+        }, null, 14, _hoisted_7)) : createCommentVNode("", true)
+      ], 8, _hoisted_1)) : (openBlock(), createElementBlock("span", {
+        key: 1,
+        class: "inline-block shrink-0 rounded-pill bg-surface-soft",
+        style: normalizeStyle({ width: `${__props.width}px`, height: "2px" }),
+        role: "img",
+        "aria-label": label.value
+      }, null, 12, _hoisted_8));
+    };
+  }
+});
+export {
+  _sfc_main as _
+};

package/dist/chunks/{LpStat-CdbEFOvn.js → LpStat-CDanpzU0.js}

@@ -1,5 +1,6 @@
-import { defineComponent, computed, openBlock, createElementBlock, createElementVNode, createCommentVNode, createBlock, toDisplayString, normalizeClass, createVNode, createTextVNode } from "vue";
+import { defineComponent, computed, openBlock, createElementBlock, createElementVNode, createCommentVNode, createBlock, toDisplayString, Fragment, createTextVNode, normalizeClass, createVNode, renderSlot } from "vue";
 import { _ as _sfc_main$1 } from "./LpIcon-CCnX5_2j.js";
+import { _ as _sfc_main$2 } from "./LpNumberFlow-amWYaeuA.js";
 const _hoisted_1 = { class: "flex flex-col gap-2" };
 const _hoisted_2 = { class: "flex items-center gap-2" };
 const _hoisted_3 = {
@@ -10,6 +11,10 @@ const _hoisted_4 = { class: "text-[11px] font-semibold uppercase tracking-[0.08e
 const _hoisted_5 = { class: "flex items-baseline gap-2" };
 const _hoisted_6 = { class: "font-mono text-3xl font-medium tracking-tight text-ink" };
 const _hoisted_7 = {
+  key: 1,
+  class: "ml-3 self-center"
+};
+const _hoisted_8 = {
   key: 0,
   class: "text-sm text-muted"
 };
@@ -18,6 +23,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   props: {
     label: {},
     value: {},
+    compact: { type: Boolean },
+    grouped: { type: Boolean },
+    decimals: { default: 0 },
+    prefix: {},
+    valueSuffix: {},
     hint: {},
     icon: {},
     online: { type: Boolean },
@@ -53,6 +63,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       return props.delta;
     });
     const showDelta = computed(() => props.delta != null);
+    const deltaDecimals = computed(() => {
+      if (typeof props.delta !== "number") return 0;
+      const [, fraction] = String(props.delta).split(".");
+      return Math.min(fraction?.length ?? 0, 4);
+    });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1, [
         createElementVNode("div", _hoisted_2, [
@@ -66,7 +81,19 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           createElementVNode("span", _hoisted_4, toDisplayString(__props.label), 1)
         ]),
         createElementVNode("div", _hoisted_5, [
-          createElementVNode("span", _hoisted_6, toDisplayString(__props.value), 1),
+          createElementVNode("span", _hoisted_6, [
+            typeof __props.value === "number" ? (openBlock(), createBlock(_sfc_main$2, {
+              key: 0,
+              value: __props.value,
+              compact: __props.compact,
+              grouped: __props.grouped,
+              decimals: __props.decimals,
+              prefix: __props.prefix,
+              suffix: __props.valueSuffix
+            }, null, 8, ["value", "compact", "grouped", "decimals", "prefix", "suffix"])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+              createTextVNode(toDisplayString(__props.value), 1)
+            ], 64))
+          ]),
           showDelta.value ? (openBlock(), createElementBlock("span", {
             key: 0,
             class: normalizeClass(["inline-flex items-center gap-0.5 text-sm font-medium tabular-nums", trendColor.value])
@@ -75,10 +102,21 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               name: trendIcon.value,
               size: 14
             }, null, 8, ["name"]),
-            createTextVNode(" " + toDisplayString(deltaText.value), 1)
-          ], 2)) : createCommentVNode("", true)
+            typeof __props.delta === "number" ? (openBlock(), createBlock(_sfc_main$2, {
+              key: 0,
+              value: __props.delta,
+              decimals: deltaDecimals.value,
+              prefix: __props.delta > 0 ? "+" : "",
+              suffix: __props.deltaSuffix
+            }, null, 8, ["value", "decimals", "prefix", "suffix"])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+              createTextVNode(toDisplayString(deltaText.value), 1)
+            ], 64))
+          ], 2)) : createCommentVNode("", true),
+          _ctx.$slots.trend ? (openBlock(), createElementBlock("span", _hoisted_7, [
+            renderSlot(_ctx.$slots, "trend")
+          ])) : createCommentVNode("", true)
         ]),
-        __props.hint ? (openBlock(), createElementBlock("span", _hoisted_7, toDisplayString(__props.hint), 1)) : createCommentVNode("", true)
+        __props.hint ? (openBlock(), createElementBlock("span", _hoisted_8, toDisplayString(__props.hint), 1)) : createCommentVNode("", true)
       ]);
     };
   }

package/dist/chunks/{LpThemeSwitcher-BgpJgrnP.js → LpThemeSwitcher-7mAK6bI7.js}

@@ -1,4 +1,5 @@
 import { computed, readonly, shallowRef, defineComponent, onMounted, openBlock, createBlock, withCtx, createElementVNode, normalizeClass, createElementBlock, normalizeStyle, createVNode, toDisplayString, createCommentVNode } from "vue";
+import { prefersReducedMotion, easingToken } from "../composables/easing.js";
 import { _ as _sfc_main$1 } from "./LpContextMenu-D0mzXqA7.js";
 import { _ as _sfc_main$2 } from "./LpIcon-CCnX5_2j.js";
 const sharedShape = { radiusControl: 8, radiusCard: 14, radiusPill: 9999 };
@@ -383,9 +384,6 @@ function applyTheme(theme, root = document.documentElement) {
   root.style.colorScheme = theme.mode;
   detectBackdropFilter(root);
 }
-function prefersReducedMotion() {
-  return typeof window !== "undefined" && window.matchMedia?.("(prefers-reduced-motion: reduce)").matches === true;
-}
 function applyThemeWithTransition(theme, origin, root = document.documentElement, durationMs = 480) {
   const doc = document;
   if (typeof doc.startViewTransition !== "function" || prefersReducedMotion()) {
@@ -406,7 +404,7 @@ function applyThemeWithTransition(theme, origin, root = document.documentElement
       },
       {
         duration: durationMs,
-        easing: "cubic-bezier(0.2, 0, 0, 1)",
+        easing: easingToken("ease-emphasized"),
         // Hold the fully-shrunk circle after the keyframes end. Without it the
         // old snapshot snaps back to its default (un-clipped) state for the one
         // frame between animation-end and the browser tearing down the

package/dist/chunks/LpTooltip-hCLPAqMG.js

@@ -0,0 +1,131 @@
+import { defineComponent, ref, watch, onBeforeUnmount, openBlock, createBlock, unref, withCtx, createVNode, renderSlot, normalizeStyle, normalizeClass, createTextVNode, toDisplayString } from "vue";
+import { TooltipProvider, TooltipRoot, TooltipTrigger, TooltipPortal, TooltipContent } from "reka-ui";
+import { springStep, springSettled } from "../composables/usePillTransition.js";
+import { PANEL_SURFACE, TOOLTIP_ANIM } from "../components/dropdown.js";
+import '../assets/LpTooltip-B61SYd4K.css';const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "LpTooltip",
+  props: {
+    content: {},
+    sideOffset: {},
+    side: { default: "top" },
+    label: { type: Boolean },
+    delay: { default: 200 },
+    showOnPointerFocus: { type: Boolean },
+    followCursor: { type: Boolean },
+    disabled: { type: Boolean }
+  },
+  setup(__props) {
+    const props = __props;
+    const target = { x: 0, y: 0 };
+    const offset = ref({ x: 0, y: 0 });
+    let sx = { value: 0, velocity: 0 };
+    let sy = { value: 0, velocity: 0 };
+    let frame = 0;
+    let lastFrame = 0;
+    const settle = (now) => {
+      const dt = lastFrame ? (now - lastFrame) / 1e3 : 1 / 60;
+      lastFrame = now;
+      frame = 0;
+      sx = springStep(sx, target.x, "float", dt);
+      sy = springStep(sy, target.y, "float", dt);
+      if (springSettled(sx, target.x) && springSettled(sy, target.y)) {
+        sx = { value: target.x, velocity: 0 };
+        sy = { value: target.y, velocity: 0 };
+        offset.value = { x: target.x, y: target.y };
+        lastFrame = 0;
+        return;
+      }
+      offset.value = { x: sx.value, y: sy.value };
+      frame = requestAnimationFrame(settle);
+    };
+    const onPointerMove = (e) => {
+      if (!props.followCursor) return;
+      const el = e.currentTarget;
+      if (!el) return;
+      const rect = el.getBoundingClientRect();
+      const halfX = props.side === "left" || props.side === "right" ? rect.width / 2 : 0;
+      const dirX = props.side === "right" ? -1 : 1;
+      target.x = e.clientX - (rect.left + rect.width / 2) + halfX * dirX;
+      const half = props.side === "top" || props.side === "bottom" ? rect.height / 2 : 0;
+      const dir = props.side === "bottom" ? -1 : 1;
+      target.y = e.clientY - (rect.top + rect.height / 2) + half * dir;
+      if (!frame) frame = requestAnimationFrame(settle);
+    };
+    const open = ref(false);
+    const wanted = ref(false);
+    const onOpenChange = (next) => {
+      wanted.value = next;
+      open.value = next && !props.disabled;
+      if (!open.value || !props.followCursor) return;
+      offset.value = { x: target.x, y: target.y };
+      sx = { value: target.x, velocity: 0 };
+      sy = { value: target.y, velocity: 0 };
+      lastFrame = 0;
+    };
+    watch(
+      () => props.disabled,
+      (off) => {
+        if (off) open.value = false;
+        else if (wanted.value) open.value = true;
+      }
+    );
+    onBeforeUnmount(() => {
+      if (frame) cancelAnimationFrame(frame);
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(TooltipProvider), { "delay-duration": __props.delay }, {
+        default: withCtx(() => [
+          createVNode(unref(TooltipRoot), {
+            open: open.value,
+            "ignore-non-keyboard-focus": !__props.showOnPointerFocus,
+            "disable-hoverable-content": __props.followCursor,
+            "disable-closing-trigger": __props.followCursor,
+            "onUpdate:open": onOpenChange
+          }, {
+            default: withCtx(() => [
+              createVNode(unref(TooltipTrigger), {
+                "as-child": "",
+                "aria-label": __props.label ? __props.content : void 0,
+                onPointermove: onPointerMove
+              }, {
+                default: withCtx(() => [
+                  renderSlot(_ctx.$slots, "default")
+                ]),
+                _: 3
+              }, 8, ["aria-label"]),
+              createVNode(unref(TooltipPortal), null, {
+                default: withCtx(() => [
+                  createVNode(unref(TooltipContent), {
+                    side: __props.side,
+                    "side-offset": __props.sideOffset ?? 6,
+                    "collision-padding": 8,
+                    "data-lp-follow": __props.followCursor ? "" : void 0,
+                    class: normalizeClass([
+                      unref(PANEL_SURFACE),
+                      unref(TOOLTIP_ANIM),
+                      "z-(--z-tooltip) max-w-[min(20rem,90vw)] px-2.5 py-1.5 text-xs text-ink"
+                    ]),
+                    style: normalizeStyle(__props.followCursor ? { translate: `${offset.value.x}px ${offset.value.y}px` } : void 0)
+                  }, {
+                    default: withCtx(() => [
+                      renderSlot(_ctx.$slots, "content", {}, () => [
+                        createTextVNode(toDisplayString(__props.content), 1)
+                      ])
+                    ]),
+                    _: 3
+                  }, 8, ["side", "side-offset", "data-lp-follow", "class", "style"])
+                ]),
+                _: 3
+              })
+            ]),
+            _: 3
+          }, 8, ["open", "ignore-non-keyboard-focus", "disable-hoverable-content", "disable-closing-trigger"])
+        ]),
+        _: 3
+      }, 8, ["delay-duration"]);
+    };
+  }
+});
+export {
+  _sfc_main as _
+};