@leavepulse/ui 0.12.0 → 0.14.6

package/dist/chunks/LpToaster-gDB1EaU3.js

@@ -0,0 +1,196 @@
+import { defineComponent, ref, watch, onBeforeUnmount, openBlock, createBlock, unref, withCtx, createElementBlock, Fragment, renderList, normalizeClass, createElementVNode, createVNode, createTextVNode, toDisplayString, createCommentVNode, withModifiers, normalizeStyle, Teleport } from "vue";
+import { ToastProvider, ToastRoot, ToastTitle, ToastDescription, ToastViewport } from "reka-ui";
+import { useToast } from "../composables/useToast.js";
+import { CLOSE_ICON } from "../components/dropdown.js";
+import { _ as _sfc_main$1 } from "./LpIcon-CCnX5_2j.js";
+const _hoisted_1 = { class: "flex items-start gap-3 p-3.5" };
+const _hoisted_2 = { class: "flex min-w-0 flex-1 flex-col gap-0.5" };
+const _hoisted_3 = ["onClick"];
+const _hoisted_4 = ["onClick"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "LpToaster",
+  setup(__props) {
+    const { queue, dismiss } = useToast();
+    const closing = ref(/* @__PURE__ */ new Set());
+    function beginClose(id) {
+      if (closing.value.has(id)) return;
+      closing.value = new Set(closing.value).add(id);
+      window.setTimeout(() => finishClose(id), 220);
+    }
+    function finishClose(id) {
+      if (!closing.value.has(id)) return;
+      const next = new Set(closing.value);
+      next.delete(id);
+      closing.value = next;
+      dismiss(id);
+    }
+    function onAnimEnd(e, id) {
+      if (e.animationName === "toast-out") finishClose(id);
+    }
+    const variantIcon = {
+      info: "lucide:info",
+      success: "lucide:circle-check",
+      warning: "lucide:triangle-alert",
+      error: "lucide:circle-x"
+    };
+    const variantColor = {
+      info: "text-brand",
+      success: "text-action",
+      warning: "text-accent",
+      error: "text-danger"
+    };
+    const variantBar = {
+      info: "bg-brand",
+      success: "bg-action",
+      warning: "bg-accent",
+      error: "bg-danger"
+    };
+    const pausedAt = /* @__PURE__ */ new Map();
+    const now = ref(Date.now());
+    let timer = null;
+    function startTimer() {
+      if (timer === null) timer = setInterval(() => now.value = Date.now(), 80);
+    }
+    function stopTimer() {
+      if (timer !== null) {
+        clearInterval(timer);
+        timer = null;
+      }
+    }
+    watch(
+      () => queue.length,
+      () => {
+        for (const id of pausedAt.keys()) {
+          if (!queue.some((t) => t.id === id)) pausedAt.delete(id);
+        }
+        if (closing.value.size) {
+          const live = new Set([...closing.value].filter((id) => queue.some((t) => t.id === id)));
+          if (live.size !== closing.value.size) closing.value = live;
+        }
+        if (queue.some((t) => t.dismissAt !== null)) startTimer();
+        else stopTimer();
+      },
+      { immediate: true }
+    );
+    onBeforeUnmount(stopTimer);
+    function onPause(t) {
+      pausedAt.set(t.id, now.value);
+    }
+    function onResume(t) {
+      const since = pausedAt.get(t.id);
+      if (since !== void 0 && t.dismissAt !== null) {
+        t.dismissAt += Date.now() - since;
+      }
+      pausedAt.delete(t.id);
+    }
+    function progress(t) {
+      if (!t.dismissAt || t.duration <= 0) return 0;
+      const at = pausedAt.get(t.id) ?? now.value;
+      const remaining = t.dismissAt - at;
+      return Math.max(0, Math.min(100, remaining / t.duration * 100));
+    }
+    async function runClick(t) {
+      if (t.onClick) {
+        await t.onClick();
+        beginClose(t.id);
+      }
+    }
+    async function runAction(t, action) {
+      await action.onClick();
+      beginClose(t.id);
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(ToastProvider), null, {
+        default: withCtx(() => [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(queue), (t) => {
+            return openBlock(), createBlock(unref(ToastRoot), {
+              key: t.id,
+              open: !closing.value.has(t.id),
+              duration: t.duration,
+              class: normalizeClass(["pointer-events-auto relative overflow-hidden rounded-card border border-line bg-surface-raised shadow-panel data-[state=open]:animate-[toast-in_200ms_var(--ease-emphasized)] data-[state=closed]:animate-[toast-out_140ms_ease]", { "cursor-pointer": t.onClick }]),
+              "onUpdate:open": (open) => !open && beginClose(t.id),
+              onAnimationend: (e) => onAnimEnd(e, t.id),
+              onPause: ($event) => onPause(t),
+              onResume: ($event) => onResume(t),
+              onClick: ($event) => runClick(t)
+            }, {
+              default: withCtx(() => [
+                createElementVNode("div", _hoisted_1, [
+                  createVNode(_sfc_main$1, {
+                    name: variantIcon[t.variant],
+                    size: 18,
+                    class: normalizeClass(["mt-0.5 shrink-0", variantColor[t.variant]])
+                  }, null, 8, ["name", "class"]),
+                  createElementVNode("div", _hoisted_2, [
+                    t.title ? (openBlock(), createBlock(unref(ToastTitle), {
+                      key: 0,
+                      class: "text-sm font-semibold text-ink"
+                    }, {
+                      default: withCtx(() => [
+                        createTextVNode(toDisplayString(t.title), 1)
+                      ]),
+                      _: 2
+                    }, 1024)) : createCommentVNode("", true),
+                    createVNode(unref(ToastDescription), { class: "break-words text-xs text-muted" }, {
+                      default: withCtx(() => [
+                        createTextVNode(toDisplayString(t.message), 1)
+                      ]),
+                      _: 2
+                    }, 1024),
+                    t.actions?.length ? (openBlock(), createElementBlock("div", {
+                      key: 1,
+                      class: "mt-2 flex flex-wrap gap-2",
+                      onClick: _cache[0] || (_cache[0] = withModifiers(() => {
+                      }, ["stop"]))
+                    }, [
+                      (openBlock(true), createElementBlock(Fragment, null, renderList(t.actions, (action, i) => {
+                        return openBlock(), createElementBlock("button", {
+                          key: i,
+                          type: "button",
+                          class: "inline-flex items-center gap-1.5 rounded-control border border-line bg-surface-soft px-2.5 py-1 text-xs font-medium text-ink outline-none transition-[border-color,background-color,scale] duration-[var(--duration-fast)] ease-[var(--ease-emphasized)] hover:border-line-strong hover:bg-surface-soft/70 active:scale-95 motion-reduce:active:scale-100 focus-visible:ring-2 focus-visible:ring-ring",
+                          onClick: ($event) => runAction(t, action)
+                        }, [
+                          action.icon ? (openBlock(), createBlock(_sfc_main$1, {
+                            key: 0,
+                            name: action.icon,
+                            size: 14
+                          }, null, 8, ["name"])) : createCommentVNode("", true),
+                          createTextVNode(" " + toDisplayString(action.label), 1)
+                        ], 8, _hoisted_3);
+                      }), 128))
+                    ])) : createCommentVNode("", true)
+                  ]),
+                  createElementVNode("button", {
+                    type: "button",
+                    class: "group -mr-1 -mt-1 rounded-md p-1 text-muted outline-none transition-colors duration-[var(--duration-fast)] hover:text-ink",
+                    "aria-label": "Dismiss",
+                    onClick: withModifiers(($event) => beginClose(t.id), ["stop"])
+                  }, [
+                    createVNode(_sfc_main$1, {
+                      name: "lucide:x",
+                      size: 16,
+                      class: normalizeClass(unref(CLOSE_ICON))
+                    }, null, 8, ["class"])
+                  ], 8, _hoisted_4)
+                ]),
+                t.dismissAt ? (openBlock(), createElementBlock("div", {
+                  key: 0,
+                  class: normalizeClass(["absolute inset-x-0 bottom-0 h-0.5 origin-left transition-transform duration-100 ease-linear motion-reduce:transition-none", variantBar[t.variant]]),
+                  style: normalizeStyle({ transform: `scaleX(${progress(t) / 100})` })
+                }, null, 6)) : createCommentVNode("", true)
+              ]),
+              _: 2
+            }, 1032, ["open", "duration", "class", "onUpdate:open", "onAnimationend", "onPause", "onResume", "onClick"]);
+          }), 128)),
+          (openBlock(), createBlock(Teleport, { to: "body" }, [
+            createVNode(unref(ToastViewport), { class: "fixed bottom-0 right-0 z-(--z-toast) flex w-[min(92vw,22rem)] flex-col gap-2 p-4 outline-none" })
+          ]))
+        ]),
+        _: 1
+      });
+    };
+  }
+});
+export {
+  _sfc_main as _
+};

package/dist/chunks/LpTooltip-CIwoRCag.js

@@ -0,0 +1,49 @@
+import { defineComponent, openBlock, createBlock, unref, withCtx, createVNode, renderSlot, normalizeClass, createTextVNode, toDisplayString } from "vue";
+import { TooltipProvider, TooltipRoot, TooltipTrigger, TooltipPortal, TooltipContent } from "reka-ui";
+import { PANEL_SURFACE, TOOLTIP_ANIM } from "../components/dropdown.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "LpTooltip",
+  props: {
+    content: {},
+    sideOffset: {}
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(TooltipProvider), { "delay-duration": 200 }, {
+        default: withCtx(() => [
+          createVNode(unref(TooltipRoot), null, {
+            default: withCtx(() => [
+              createVNode(unref(TooltipTrigger), { "as-child": "" }, {
+                default: withCtx(() => [
+                  renderSlot(_ctx.$slots, "default")
+                ]),
+                _: 3
+              }),
+              createVNode(unref(TooltipPortal), null, {
+                default: withCtx(() => [
+                  createVNode(unref(TooltipContent), {
+                    "side-offset": __props.sideOffset ?? 6,
+                    class: normalizeClass([unref(PANEL_SURFACE), unref(TOOLTIP_ANIM), "z-(--z-tooltip) px-2.5 py-1.5 text-xs text-ink"])
+                  }, {
+                    default: withCtx(() => [
+                      renderSlot(_ctx.$slots, "content", {}, () => [
+                        createTextVNode(toDisplayString(__props.content), 1)
+                      ])
+                    ]),
+                    _: 3
+                  }, 8, ["side-offset", "class"])
+                ]),
+                _: 3
+              })
+            ]),
+            _: 3
+          })
+        ]),
+        _: 3
+      });
+    };
+  }
+});
+export {
+  _sfc_main as _
+};

package/dist/chunks/LpTopologyCanvas-DVwyQfKa.js

@@ -0,0 +1,237 @@
+import { defineComponent, markRaw, computed, watch, openBlock, createBlock, unref, withCtx, createVNode, createElementVNode, createElementBlock, Fragment, renderList, createTextVNode, toDisplayString, createCommentVNode } from "vue";
+import { Background } from "@vue-flow/background";
+import { Controls } from "@vue-flow/controls";
+import { MarkerType, useVueFlow, VueFlow, SelectionMode, Panel } from "@vue-flow/core";
+import { MiniMap } from "@vue-flow/minimap";
+import { _ as _sfc_main$3 } from "./LpInfraNode-C_PHcthC.js";
+import { _ as _sfc_main$1 } from "./LpLaneNode-HtnQf2FF.js";
+import { _ as _sfc_main$2 } from "./LpServiceNode-Dc-Ut5RS.js";
+const _hoisted_1 = { class: "flex flex-col gap-1.5 rounded-card border border-line bg-surface-overlay/90 px-3 py-2 text-[11px] backdrop-blur" };
+const _hoisted_2 = {
+  width: "22",
+  height: "6",
+  class: "shrink-0",
+  "aria-hidden": "true"
+};
+const _hoisted_3 = ["stroke", "stroke-width", "stroke-dasharray"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "LpTopologyCanvas",
+  props: {
+    nodes: {},
+    edges: {},
+    connectable: { type: Boolean, default: false },
+    selectable: { type: Boolean, default: false },
+    legend: { type: Boolean, default: true },
+    lanes: { default: () => [] }
+  },
+  emits: ["connect", "node-select", "node-contextmenu", "edge-contextmenu", "pane-click", "selection-change", "update:nodes", "node-drag-stop", "viewport-change"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const nodeTypes = {
+      infra: markRaw(_sfc_main$3),
+      service: markRaw(_sfc_main$2),
+      lane: markRaw(_sfc_main$1)
+    };
+    const laneNodes = computed(
+      () => props.lanes.map(
+        (l) => ({
+          id: `lane-${l.id}`,
+          type: "lane",
+          position: { x: l.x, y: l.y },
+          data: { label: l.label, accent: l.accent, width: l.width, height: l.height },
+          selectable: false,
+          draggable: false,
+          connectable: false,
+          focusable: false,
+          zIndex: 0
+        })
+      )
+    );
+    const graphNodes = computed(
+      () => props.nodes.map((n) => {
+        const type = n.type ?? "infra";
+        const node = {
+          id: n.id,
+          type,
+          position: n.position,
+          data: n.data,
+          zIndex: 1,
+          ...n.parent ? { parentNode: n.parent } : {}
+        };
+        if (type === "group") {
+          node.style = {
+            width: `${n.width ?? 260}px`,
+            height: `${n.height ?? 160}px`,
+            background: "color-mix(in srgb, var(--color-surface-soft) 60%, transparent)",
+            border: "1px solid var(--color-line)",
+            borderRadius: "var(--radius-card)",
+            opacity: n.data.dimmed ? "0.35" : "1",
+            transition: "opacity var(--duration-fast)"
+          };
+          node.label = n.label ?? n.data.name;
+        }
+        return node;
+      })
+    );
+    const flowNodes = computed(() => [
+      ...laneNodes.value,
+      ...graphNodes.value
+    ]);
+    function edgeCategory(e) {
+      return e.category ?? (e.kind === "depends_on" ? "structural" : "network");
+    }
+    const CATEGORY_COLOR = {
+      network: "var(--color-brand)",
+      structural: "var(--color-accent)"
+    };
+    function edgeColor(cat, o) {
+      return o === "drift" ? "var(--color-danger)" : CATEGORY_COLOR[cat];
+    }
+    function edgeDash(cat, o) {
+      if (o !== "applied") return "6 5";
+      return cat === "structural" ? "1 6" : "0";
+    }
+    const flowEdges = computed(
+      () => props.edges.map((e) => {
+        const obs = e.observed ?? "applied";
+        const cat = edgeCategory(e);
+        const color = edgeColor(cat, obs);
+        return {
+          id: e.id,
+          source: e.source,
+          target: e.target,
+          type: "default",
+          animated: obs !== "applied",
+          label: e.kind,
+          labelBgStyle: { fill: "var(--color-surface)" },
+          labelStyle: { fill: "var(--color-muted-strong)", fontSize: "10px" },
+          style: {
+            stroke: color,
+            strokeWidth: cat === "structural" ? 1.5 : 2,
+            strokeDasharray: edgeDash(cat, obs),
+            strokeLinecap: "round"
+          },
+          markerEnd: { type: MarkerType.ArrowClosed, color }
+        };
+      })
+    );
+    const {
+      onNodeClick,
+      onNodeContextMenu,
+      onEdgeContextMenu,
+      onPaneClick,
+      onConnect,
+      onNodeDragStop,
+      onMoveEnd,
+      getSelectedNodes,
+      fitView,
+      setViewport
+    } = useVueFlow();
+    onNodeClick(({ node }) => emit("node-select", node.id));
+    onNodeDragStop(
+      ({ node }) => emit("node-drag-stop", { id: node.id, position: { ...node.position } })
+    );
+    onMoveEnd(({ flowTransform }) => {
+      if (flowTransform)
+        emit("viewport-change", {
+          zoom: flowTransform.zoom,
+          x: flowTransform.x,
+          y: flowTransform.y
+        });
+    });
+    watch(
+      () => getSelectedNodes.value.map((n) => n.id),
+      (ids) => emit("selection-change", ids)
+    );
+    onNodeContextMenu(({ node, event }) => {
+      const e = event;
+      e.preventDefault?.();
+      emit("node-contextmenu", { id: node.id, x: e.clientX, y: e.clientY });
+    });
+    const legendItems = [
+      { label: "Network", color: CATEGORY_COLOR.network, width: 2, dash: "0" },
+      { label: "Depends-on", color: CATEGORY_COLOR.structural, width: 1.5, dash: "1 5" },
+      { label: "Pending", color: "var(--color-brand)", width: 2, dash: "6 5" },
+      { label: "Drift", color: "var(--color-danger)", width: 2, dash: "6 5" }
+    ];
+    onEdgeContextMenu(({ edge, event }) => {
+      const e = event;
+      e.preventDefault?.();
+      emit("edge-contextmenu", { id: edge.id, x: e.clientX, y: e.clientY });
+    });
+    onPaneClick(() => emit("pane-click"));
+    onConnect((conn) => emit("connect", conn));
+    async function applyViewport(v) {
+      await setViewport({ x: v.x, y: v.y, zoom: v.zoom });
+    }
+    __expose({ fitView, setViewport: applyViewport });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(VueFlow), {
+        nodes: flowNodes.value,
+        edges: flowEdges.value,
+        "node-types": nodeTypes,
+        "nodes-connectable": __props.connectable,
+        "selection-on-drag": __props.selectable,
+        "pan-on-drag": __props.selectable ? [1, 2] : true,
+        "selection-key-code": __props.selectable ? true : null,
+        "multi-selection-key-code": "Shift",
+        "selection-mode": unref(SelectionMode).Partial,
+        "default-viewport": { zoom: 0.9 },
+        "min-zoom": 0.3,
+        "max-zoom": 2,
+        "fit-view-on-init": "",
+        class: "lp-topology"
+      }, {
+        default: withCtx(() => [
+          createVNode(unref(Background), {
+            gap: 22,
+            size: 1.4,
+            "pattern-color": "var(--color-line-strong)"
+          }),
+          createVNode(unref(MiniMap), {
+            pannable: "",
+            zoomable: "",
+            "node-color": "var(--color-surface-soft)",
+            "mask-color": "rgba(0,0,0,0.55)"
+          }),
+          createVNode(unref(Controls)),
+          __props.legend ? (openBlock(), createBlock(unref(Panel), {
+            key: 0,
+            position: "top-right"
+          }, {
+            default: withCtx(() => [
+              createElementVNode("div", _hoisted_1, [
+                (openBlock(), createElementBlock(Fragment, null, renderList(legendItems, (l) => {
+                  return createElementVNode("div", {
+                    key: l.label,
+                    class: "flex items-center gap-2 text-muted"
+                  }, [
+                    (openBlock(), createElementBlock("svg", _hoisted_2, [
+                      createElementVNode("line", {
+                        x1: "0",
+                        y1: "3",
+                        x2: "22",
+                        y2: "3",
+                        stroke: l.color,
+                        "stroke-width": l.width,
+                        "stroke-dasharray": l.dash,
+                        "stroke-linecap": "round"
+                      }, null, 8, _hoisted_3)
+                    ])),
+                    createTextVNode(" " + toDisplayString(l.label), 1)
+                  ]);
+                }), 64))
+              ])
+            ]),
+            _: 1
+          })) : createCommentVNode("", true)
+        ]),
+        _: 1
+      }, 8, ["nodes", "edges", "nodes-connectable", "selection-on-drag", "pan-on-drag", "selection-key-code", "selection-mode"]);
+    };
+  }
+});
+export {
+  _sfc_main as _
+};

package/dist/chunks/LpUptimeBar-CB366k0O.js

@@ -0,0 +1,127 @@
+import { defineComponent, computed, openBlock, createElementBlock, toDisplayString, createTextVNode, createElementVNode, createCommentVNode, createVNode, unref, withCtx, Fragment, renderList, createBlock, normalizeStyle, normalizeClass } from "vue";
+import { TooltipProvider, TooltipRoot, TooltipTrigger, TooltipPortal, TooltipContent } from "reka-ui";
+import { PANEL_SURFACE, TOOLTIP_ANIM } from "../components/dropdown.js";
+const _hoisted_1 = { class: "flex flex-col gap-1.5" };
+const _hoisted_2 = {
+  key: 0,
+  class: "flex items-baseline justify-between gap-3 text-xs"
+};
+const _hoisted_3 = {
+  key: 0,
+  class: "font-medium text-ink"
+};
+const _hoisted_4 = { key: 1 };
+const _hoisted_5 = {
+  key: 2,
+  class: "tabular-nums text-muted-strong"
+};
+const _hoisted_6 = { class: "flex h-7 items-stretch gap-0.5" };
+const _hoisted_7 = ["aria-label"];
+const _hoisted_8 = { class: "flex items-center gap-1.5" };
+const _hoisted_9 = {
+  key: 1,
+  class: "flex items-center justify-between text-xs text-muted"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "LpUptimeBar",
+  props: {
+    segments: {},
+    startLabel: {},
+    endLabel: {},
+    showUptime: { type: Boolean, default: true },
+    title: {},
+    colors: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const defaultColor = {
+      operational: "var(--color-brand)",
+      degraded: "var(--color-accent)",
+      down: "var(--color-danger)",
+      maintenance: "var(--color-action)",
+      empty: "var(--color-surface-soft)"
+    };
+    const colorFor = (status) => props.colors?.[status] ?? defaultColor[status];
+    const statusLabel = {
+      operational: "Operational",
+      degraded: "Degraded",
+      down: "Down",
+      maintenance: "Maintenance",
+      empty: "No data"
+    };
+    const uptimePct = computed(() => {
+      const tracked = props.segments.filter((s) => s.status !== "empty");
+      if (!tracked.length) return null;
+      const up = tracked.filter((s) => s.status === "operational" || s.status === "maintenance").length;
+      return up / tracked.length * 100;
+    });
+    const uptimeText = computed(() => {
+      const v = uptimePct.value;
+      if (v == null) return "—";
+      return `${Number(v.toFixed(2))}%`;
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        __props.showUptime || __props.title ? (openBlock(), createElementBlock("div", _hoisted_2, [
+          __props.title ? (openBlock(), createElementBlock("span", _hoisted_3, toDisplayString(__props.title), 1)) : (openBlock(), createElementBlock("span", _hoisted_4)),
+          __props.showUptime ? (openBlock(), createElementBlock("span", _hoisted_5, [
+            createTextVNode(toDisplayString(uptimeText.value), 1),
+            _cache[0] || (_cache[0] = createElementVNode("span", { class: "text-muted" }, " uptime", -1))
+          ])) : createCommentVNode("", true)
+        ])) : createCommentVNode("", true),
+        createVNode(unref(TooltipProvider), { "delay-duration": 120 }, {
+          default: withCtx(() => [
+            createElementVNode("div", _hoisted_6, [
+              (openBlock(true), createElementBlock(Fragment, null, renderList(__props.segments, (seg, i) => {
+                return openBlock(), createBlock(unref(TooltipRoot), { key: i }, {
+                  default: withCtx(() => [
+                    createVNode(unref(TooltipTrigger), { "as-child": "" }, {
+                      default: withCtx(() => [
+                        createElementVNode("button", {
+                          type: "button",
+                          class: normalizeClass(["min-w-0 flex-1 rounded-xs outline-none transition-[scale,opacity] duration-150 hover:scale-y-110 focus-visible:ring-2 focus-visible:ring-ring", seg.status === "empty" ? "opacity-50" : ""]),
+                          style: normalizeStyle({ backgroundColor: colorFor(seg.status) }),
+                          "aria-label": seg.label ?? statusLabel[seg.status]
+                        }, null, 14, _hoisted_7)
+                      ]),
+                      _: 2
+                    }, 1024),
+                    createVNode(unref(TooltipPortal), null, {
+                      default: withCtx(() => [
+                        createVNode(unref(TooltipContent), {
+                          "side-offset": 6,
+                          class: normalizeClass([unref(PANEL_SURFACE), unref(TOOLTIP_ANIM), "z-(--z-tooltip) px-2.5 py-1.5 text-xs text-ink"])
+                        }, {
+                          default: withCtx(() => [
+                            createElementVNode("span", _hoisted_8, [
+                              createElementVNode("span", {
+                                class: "size-1.5 shrink-0 rounded-full",
+                                style: normalizeStyle({ backgroundColor: colorFor(seg.status) })
+                              }, null, 4),
+                              createTextVNode(" " + toDisplayString(seg.label ?? statusLabel[seg.status]), 1)
+                            ])
+                          ]),
+                          _: 2
+                        }, 1032, ["class"])
+                      ]),
+                      _: 2
+                    }, 1024)
+                  ]),
+                  _: 2
+                }, 1024);
+              }), 128))
+            ])
+          ]),
+          _: 1
+        }),
+        __props.startLabel || __props.endLabel ? (openBlock(), createElementBlock("div", _hoisted_9, [
+          createElementVNode("span", null, toDisplayString(__props.startLabel), 1),
+          createElementVNode("span", null, toDisplayString(__props.endLabel), 1)
+        ])) : createCommentVNode("", true)
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as _
+};

package/dist/component-names.d.ts

@@ -1 +1 @@
-export declare const COMPONENT_NAMES: readonly ["LayoutCanvas", "LayoutNode", "LpAlert", "LpAppShell", "LpAutocomplete", "LpAvatar", "LpBadge", "LpBreadcrumbs", "LpButton", "LpCalendar", "LpCard", "LpCheckbox", "LpCodeBlock", "LpCommandPalette", "LpConfirmDialog", "LpContextMenu", "LpDatePicker", "LpDisclosure", "LpDivider", "LpDrawer", "LpDropdownMenu", "LpEmptyState", "LpFormField", "LpIcon", "LpInfraNode", "LpInput", "LpLaneNode", "LpLink", "LpLogViewer", "LpModal", "LpNotificationBell", "LpNumberField", "LpOtpInput", "LpPagination", "LpPasswordInput", "LpPhoneInput", "LpPopover", "LpProgress", "LpRadio", "LpRadioGroup", "LpScrollArea", "LpSegmented", "LpSelect", "LpServiceNode", "LpSidebar", "LpSidebarNav", "LpSkeleton", "LpSlider", "LpStat", "LpStepper", "LpSwitch", "LpTable", "LpTableOfContents", "LpTabs", "LpTextarea", "LpThemeSwitcher", "LpToaster", "LpTooltip", "LpTopologyCanvas", "LpUptimeBar"];
+export declare const COMPONENT_NAMES: readonly ["LayoutCanvas", "LayoutNode", "LpAlert", "LpAppShell", "LpAutocomplete", "LpAvatar", "LpBadge", "LpBreadcrumbs", "LpButton", "LpCalendar", "LpCard", "LpCheckbox", "LpCodeBlock", "LpCommandPalette", "LpConfirmDialog", "LpContextMenu", "LpDatePicker", "LpDisclosure", "LpDivider", "LpDrawer", "LpDropdownMenu", "LpEmptyState", "LpFormField", "LpIcon", "LpInfraNode", "LpInput", "LpLaneNode", "LpLink", "LpLogViewer", "LpModal", "LpNotificationBell", "LpNumberField", "LpOtpInput", "LpPagination", "LpPasswordInput", "LpPhoneInput", "LpPopover", "LpProgress", "LpRadio", "LpRadioGroup", "LpScrollArea", "LpSegmented", "LpSelect", "LpServiceNode", "LpSidebar", "LpSidebarNav", "LpSkeleton", "LpSlider", "LpStat", "LpStepper", "LpSwitch", "LpTable", "LpTableOfContents", "LpTabs", "LpTextarea", "LpThemeSwitcher", "LpTilt", "LpToaster", "LpTooltip", "LpTopologyCanvas", "LpUptimeBar"];

package/dist/components/LayoutCanvas.vue.js

@@ -0,0 +1,4 @@
+import { _ as _sfc_main } from "../chunks/LayoutCanvas-Dd20boUG.js";
+export {
+  _sfc_main as default
+};

package/dist/components/LayoutNode.vue.js

@@ -0,0 +1,4 @@
+import { _ as _sfc_main } from "../chunks/LayoutNode-DGpZA9LX.js";
+export {
+  _sfc_main as default
+};

package/dist/components/LpAlert.vue.js

@@ -0,0 +1,4 @@
+import { _ as _sfc_main } from "../chunks/LpAlert-BAYHDSS1.js";
+export {
+  _sfc_main as default
+};

package/dist/components/LpAppShell.vue.js

@@ -0,0 +1,4 @@
+import { _ as _sfc_main } from "../chunks/LpAppShell-DBTsNQaM.js";
+export {
+  _sfc_main as default
+};

package/dist/components/LpAutocomplete.vue.js

@@ -0,0 +1,4 @@
+import { _ as _sfc_main } from "../chunks/LpAutocomplete-B9uoCs4t.js";
+export {
+  _sfc_main as default
+};

package/dist/components/LpAvatar.vue.js

@@ -0,0 +1,4 @@
+import { _ as _sfc_main } from "../chunks/LpAvatar-B1Ez0ZAx.js";
+export {
+  _sfc_main as default
+};

package/dist/components/LpBadge.vue.js

@@ -0,0 +1,4 @@
+import { _ as _sfc_main } from "../chunks/LpBadge-CXzBPnwO.js";
+export {
+  _sfc_main as default
+};

package/dist/components/LpBreadcrumbs.vue.js

@@ -0,0 +1,4 @@
+import { _ as _sfc_main } from "../chunks/LpBreadcrumbs-B7Aqatzw.js";
+export {
+  _sfc_main as default
+};

package/dist/components/LpButton.vue.js

@@ -0,0 +1,4 @@
+import { _ as _sfc_main } from "../chunks/LpButton-5VXXCjwF.js";
+export {
+  _sfc_main as default
+};

package/dist/components/LpCalendar.vue.js

@@ -0,0 +1,4 @@
+import { _ as _sfc_main } from "../chunks/LpCalendar-B7ZL0ty3.js";
+export {
+  _sfc_main as default
+};