@leavepulse/ui 0.12.0 → 0.14.6

package/dist/chunks/LpSelect-DznhPEWX.js

@@ -0,0 +1,222 @@
+import { defineComponent, computed, ref, openBlock, createBlock, unref, withCtx, createVNode, normalizeClass, createElementBlock, toDisplayString, withModifiers, createCommentVNode, createTextVNode, Fragment, renderList, normalizeStyle, createElementVNode } from "vue";
+import { ComboboxRoot, ComboboxAnchor, ComboboxTrigger, ComboboxPortal, ComboboxContent, ComboboxInput, ComboboxViewport, ComboboxEmpty, ComboboxItem, ComboboxItemIndicator } from "reka-ui";
+import { POPOVER_PANEL, OPTION_ITEM } from "../components/dropdown.js";
+import { _ as _sfc_main$1 } from "./LpIcon-CCnX5_2j.js";
+const _hoisted_1 = {
+  key: 0,
+  class: "truncate"
+};
+const _hoisted_2 = {
+  key: 1,
+  class: "truncate text-muted"
+};
+const _hoisted_3 = {
+  key: 0,
+  class: "border-b border-line p-2"
+};
+const _hoisted_4 = {
+  key: 0,
+  class: "px-3 py-4 text-center text-sm italic text-muted"
+};
+const _hoisted_5 = { class: "flex flex-col" };
+const _hoisted_6 = {
+  key: 0,
+  class: "text-xs text-muted"
+};
+const EMPTY_SENTINEL = "\0__lp_empty__";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "LpSelect",
+  props: {
+    modelValue: {},
+    options: {},
+    placeholder: { default: "Select…" },
+    searchPlaceholder: { default: "Search…" },
+    searchable: { type: Boolean, default: false },
+    multiple: { type: Boolean, default: false },
+    clearable: { type: Boolean, default: false },
+    disabled: { type: Boolean, default: false },
+    emptyText: { default: "Nothing found" },
+    searchTerm: { default: void 0 },
+    loading: { type: Boolean, default: false },
+    loadingText: { default: "Searching…" },
+    size: { default: "md" }
+  },
+  emits: ["update:modelValue", "change", "update:searchTerm"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const SIZE_HEIGHT = {
+      sm: "h-(--size-control-sm)",
+      md: "h-(--size-control-md)",
+      lg: "h-(--size-control-lg)"
+    };
+    const anchorHeight = computed(() => SIZE_HEIGHT[props.size]);
+    const emit = __emit;
+    const serverSide = computed(() => props.searchTerm !== void 0);
+    const localQuery = ref("");
+    const query = computed({
+      get: () => serverSide.value ? props.searchTerm ?? "" : localQuery.value,
+      set: (v) => {
+        if (serverSide.value) emit("update:searchTerm", v);
+        else localQuery.value = v;
+      }
+    });
+    function encode(v) {
+      return v === "" ? EMPTY_SENTINEL : v;
+    }
+    function decode(v) {
+      return v === EMPTY_SENTINEL ? "" : v;
+    }
+    const comboModel = computed(() => {
+      const v = props.modelValue;
+      if (Array.isArray(v)) return v.map((item) => encode(item));
+      return encode(v);
+    });
+    const filtered = computed(() => {
+      if (serverSide.value) return props.options;
+      const q = query.value.trim().toLowerCase();
+      if (!props.searchable || !q) return props.options;
+      return props.options.filter(
+        (o) => o.label.toLowerCase().includes(q) || o.description?.toLowerCase().includes(q)
+      );
+    });
+    const displayLabel = computed(() => {
+      const v = props.modelValue;
+      if (props.multiple) {
+        const arr = v ?? [];
+        if (arr.length === 0) return "";
+        if (arr.length === 1)
+          return props.options.find((o) => o.value === arr[0])?.label ?? String(arr[0]);
+        return `${arr.length} selected`;
+      }
+      return props.options.find((o) => o.value === v)?.label ?? "";
+    });
+    const hasValue = computed(
+      () => props.multiple ? (props.modelValue?.length ?? 0) > 0 : props.modelValue !== void 0 && props.modelValue !== ""
+    );
+    function onUpdate(value) {
+      const decoded = Array.isArray(value) ? value.map((item) => decode(item)) : decode(value);
+      emit("update:modelValue", decoded);
+      if (!props.multiple) emit("change", decoded);
+    }
+    function clear() {
+      emit("update:modelValue", props.multiple ? [] : void 0);
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(ComboboxRoot), {
+        "model-value": comboModel.value,
+        multiple: __props.multiple,
+        disabled: __props.disabled,
+        "ignore-filter": true,
+        class: "relative",
+        "onUpdate:modelValue": onUpdate
+      }, {
+        default: withCtx(() => [
+          createVNode(unref(ComboboxAnchor), {
+            class: normalizeClass([
+              anchorHeight.value,
+              "group flex w-full items-center gap-2 rounded-control border border-line bg-surface-soft px-3 text-sm text-ink transition-colors duration-[var(--duration-fast)] focus-within:border-brand focus-within:ring-2 focus-within:ring-ring data-[disabled]:cursor-not-allowed data-[disabled]:opacity-55"
+            ])
+          }, {
+            default: withCtx(() => [
+              createVNode(unref(ComboboxTrigger), { class: "flex flex-1 items-center gap-2 outline-none" }, {
+                default: withCtx(() => [
+                  displayLabel.value ? (openBlock(), createElementBlock("span", _hoisted_1, toDisplayString(displayLabel.value), 1)) : (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(__props.placeholder), 1))
+                ]),
+                _: 1
+              }),
+              __props.clearable && hasValue.value ? (openBlock(), createElementBlock("button", {
+                key: 0,
+                type: "button",
+                class: "group flex shrink-0 items-center text-muted outline-none transition-colors duration-[var(--duration-fast)] hover:text-ink",
+                "aria-label": "Clear",
+                onPointerdown: withModifiers(clear, ["prevent"])
+              }, [
+                createVNode(_sfc_main$1, {
+                  name: "lucide:x",
+                  size: 16,
+                  class: "transition-transform duration-200 ease-[var(--ease-emphasized)] group-hover:rotate-90 group-active:scale-90 motion-reduce:group-hover:rotate-0"
+                })
+              ], 32)) : createCommentVNode("", true),
+              createVNode(unref(ComboboxTrigger), { class: "group/trig flex shrink-0 items-center text-muted transition-[rotate,color] duration-200 ease-[var(--ease-emphasized)] group-hover:text-ink data-[state=open]:rotate-180" }, {
+                default: withCtx(() => [
+                  createVNode(_sfc_main$1, {
+                    name: "lucide:chevron-down",
+                    size: 16,
+                    class: "transition-transform duration-200 ease-[var(--ease-emphasized)] group-data-[state=closed]/trig:group-hover:translate-y-1"
+                  })
+                ]),
+                _: 1
+              })
+            ]),
+            _: 1
+          }, 8, ["class"]),
+          createVNode(unref(ComboboxPortal), null, {
+            default: withCtx(() => [
+              createVNode(unref(ComboboxContent), {
+                position: "popper",
+                "side-offset": 6,
+                class: normalizeClass([unref(POPOVER_PANEL), "z-(--z-popover) max-h-72 w-(--reka-combobox-trigger-width) overflow-hidden"])
+              }, {
+                default: withCtx(() => [
+                  __props.searchable || serverSide.value ? (openBlock(), createElementBlock("div", _hoisted_3, [
+                    createVNode(unref(ComboboxInput), {
+                      modelValue: query.value,
+                      "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => query.value = $event),
+                      placeholder: __props.searchPlaceholder,
+                      class: "h-(--size-control-sm) w-full rounded-md border border-line bg-surface-soft px-2.5 text-sm text-ink outline-none placeholder:text-muted focus:border-brand"
+                    }, null, 8, ["modelValue", "placeholder"])
+                  ])) : createCommentVNode("", true),
+                  createVNode(unref(ComboboxViewport), { class: "max-h-56 overflow-y-auto p-1" }, {
+                    default: withCtx(() => [
+                      __props.loading ? (openBlock(), createElementBlock("div", _hoisted_4, toDisplayString(__props.loadingText), 1)) : (openBlock(), createBlock(unref(ComboboxEmpty), {
+                        key: 1,
+                        class: "px-3 py-4 text-center text-sm italic text-muted"
+                      }, {
+                        default: withCtx(() => [
+                          createTextVNode(toDisplayString(__props.emptyText), 1)
+                        ]),
+                        _: 1
+                      })),
+                      (openBlock(true), createElementBlock(Fragment, null, renderList(filtered.value, (opt, i) => {
+                        return openBlock(), createBlock(unref(ComboboxItem), {
+                          key: String(opt.value),
+                          value: encode(opt.value),
+                          style: normalizeStyle({ animationDelay: `${Math.min(i, 12) * 22}ms` }),
+                          class: normalizeClass([unref(OPTION_ITEM), "justify-between"])
+                        }, {
+                          default: withCtx(() => [
+                            createElementVNode("span", _hoisted_5, [
+                              createElementVNode("span", null, toDisplayString(opt.label), 1),
+                              opt.description ? (openBlock(), createElementBlock("span", _hoisted_6, toDisplayString(opt.description), 1)) : createCommentVNode("", true)
+                            ]),
+                            createVNode(unref(ComboboxItemIndicator), { class: "flex shrink-0 items-center text-brand" }, {
+                              default: withCtx(() => [
+                                createVNode(_sfc_main$1, {
+                                  name: "lucide:check",
+                                  size: 16
+                                })
+                              ]),
+                              _: 1
+                            })
+                          ]),
+                          _: 2
+                        }, 1032, ["value", "style", "class"]);
+                      }), 128))
+                    ]),
+                    _: 1
+                  })
+                ]),
+                _: 1
+              }, 8, ["class"])
+            ]),
+            _: 1
+          })
+        ]),
+        _: 1
+      }, 8, ["model-value", "multiple", "disabled"]);
+    };
+  }
+});
+export {
+  _sfc_main as _
+};

package/dist/chunks/LpServiceNode-Dc-Ut5RS.js

@@ -0,0 +1,51 @@
+import { defineComponent, computed, openBlock, createElementBlock, normalizeStyle, normalizeClass, createVNode, unref, createElementVNode, toDisplayString } from "vue";
+import { Handle, Position } from "@vue-flow/core";
+const _hoisted_1 = { class: "text-[11px] text-[var(--accent)]" };
+const _hoisted_2 = { class: "flex-1 truncate text-[11px] font-medium text-ink" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "LpServiceNode",
+  props: {
+    data: {},
+    selected: { type: Boolean }
+  },
+  setup(__props) {
+    const props = __props;
+    const kindVar = {
+      service: "var(--color-brand)",
+      database: "var(--color-accent)",
+      infra: "var(--color-muted-strong)"
+    };
+    const accent = computed(() => kindVar[props.data.kind ?? "service"] ?? "var(--color-brand)");
+    const kindIcon = {
+      service: "◇",
+      database: "⛁",
+      infra: "⬡"
+    };
+    const icon = computed(() => kindIcon[props.data.kind ?? "service"] ?? "◇");
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(["flex w-[132px] items-center gap-1.5 rounded-control border bg-surface-soft px-2 py-1.5 transition-[border-color,opacity]", [
+          __props.selected ? "border-[var(--accent)]" : "border-line",
+          __props.data.dimmed ? "opacity-30" : "opacity-100"
+        ]]),
+        style: normalizeStyle({ "--accent": accent.value })
+      }, [
+        createVNode(unref(Handle), {
+          type: "target",
+          position: unref(Position).Left,
+          class: "!size-1.5 !border !border-[var(--accent)] !bg-surface"
+        }, null, 8, ["position"]),
+        createVNode(unref(Handle), {
+          type: "source",
+          position: unref(Position).Right,
+          class: "!size-1.5 !border !border-[var(--accent)] !bg-surface"
+        }, null, 8, ["position"]),
+        createElementVNode("span", _hoisted_1, toDisplayString(icon.value), 1),
+        createElementVNode("span", _hoisted_2, toDisplayString(__props.data.name), 1)
+      ], 6);
+    };
+  }
+});
+export {
+  _sfc_main as _
+};

package/dist/chunks/LpSidebar-BPQabjae.js

@@ -0,0 +1,152 @@
+import { defineComponent, computed, useId, openBlock, createElementBlock, Fragment, createElementVNode, mergeProps, normalizeClass, renderSlot, createCommentVNode, createVNode, createSlots, withCtx, normalizeProps, guardReactiveProps, createBlock } from "vue";
+import { _ as _sfc_main$2 } from "./LpDrawer-Ce6g9ZMr.js";
+import { _ as _sfc_main$1 } from "./LpSidebarNav-CpF7rZxx.js";
+const _hoisted_1 = {
+  key: 1,
+  class: "mt-2 flex shrink-0 flex-col gap-2"
+};
+const _hoisted_2 = {
+  key: 2,
+  class: "mt-2 shrink-0 border-t border-line pt-3"
+};
+const _hoisted_3 = { class: "flex h-full flex-col gap-1" };
+const _hoisted_4 = {
+  key: 1,
+  class: "mt-2 flex shrink-0 flex-col gap-2"
+};
+const _hoisted_5 = {
+  key: 2,
+  class: "mt-2 shrink-0 border-t border-line pt-3"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{ inheritAttrs: false },
+  __name: "LpSidebar",
+  props: {
+    modelValue: {},
+    items: {},
+    sections: {},
+    isActive: {},
+    loading: { type: Boolean },
+    skeletonRows: { default: 6 },
+    skeletonHeader: { type: Boolean, default: true },
+    responsive: { type: Boolean, default: false },
+    open: { type: Boolean },
+    mobileBreakpoint: { default: "md" },
+    edgeOpen: { type: Boolean },
+    divider: { type: Boolean, default: true }
+  },
+  emits: ["update:modelValue", "update:open", "select"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const groups = computed(
+      () => props.sections ?? (props.items ? [{ items: props.items }] : [])
+    );
+    function itemActive(item) {
+      return props.isActive ? props.isActive(item) : item.id === props.modelValue;
+    }
+    function activate(item) {
+      if (item.disabled) return;
+      emit("update:modelValue", item.id);
+      emit("select", item);
+      if (props.responsive && props.open) emit("update:open", false);
+    }
+    const baseId = `lp-sidebar-${useId()}`;
+    const railPillId = `${baseId}-rail`;
+    const drawerPillId = `${baseId}-drawer`;
+    const RAIL_VISIBILITY = {
+      sm: "hidden sm:flex",
+      md: "hidden md:flex",
+      lg: "hidden lg:flex",
+      xl: "hidden xl:flex"
+    };
+    const railClass = computed(
+      () => props.responsive ? RAIL_VISIBILITY[props.mobileBreakpoint] : "flex"
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock(Fragment, null, [
+        createElementVNode("nav", mergeProps({
+          class: ["h-full w-60 flex-col gap-1 border-r border-line bg-surface-raised p-3", railClass.value],
+          "aria-label": "Sidebar"
+        }, _ctx.$attrs), [
+          _ctx.$slots.header ? (openBlock(), createElementBlock("div", {
+            key: 0,
+            class: normalizeClass(["-mx-3 -mt-3 mb-3 flex h-16 shrink-0 items-center px-3", __props.divider ? "border-b border-line" : ""])
+          }, [
+            renderSlot(_ctx.$slots, "header")
+          ], 2)) : createCommentVNode("", true),
+          createVNode(_sfc_main$1, {
+            groups: groups.value,
+            "pill-id": railPillId,
+            "item-active": itemActive,
+            loading: __props.loading,
+            "skeleton-rows": __props.skeletonRows,
+            "skeleton-header": __props.skeletonHeader,
+            onActivate: activate
+          }, createSlots({ _: 2 }, [
+            _ctx.$slots.item ? {
+              name: "item",
+              fn: withCtx((slotProps) => [
+                renderSlot(_ctx.$slots, "item", normalizeProps(guardReactiveProps(slotProps)))
+              ]),
+              key: "0"
+            } : void 0
+          ]), 1032, ["groups", "loading", "skeleton-rows", "skeleton-header"]),
+          _ctx.$slots.actions ? (openBlock(), createElementBlock("div", _hoisted_1, [
+            renderSlot(_ctx.$slots, "actions")
+          ])) : createCommentVNode("", true),
+          _ctx.$slots.footer ? (openBlock(), createElementBlock("div", _hoisted_2, [
+            renderSlot(_ctx.$slots, "footer")
+          ])) : createCommentVNode("", true)
+        ], 16),
+        __props.responsive ? (openBlock(), createBlock(_sfc_main$2, {
+          key: 0,
+          open: __props.open,
+          direction: "left",
+          size: "sm",
+          "edge-open": __props.edgeOpen,
+          "edge-breakpoint": __props.mobileBreakpoint,
+          "onUpdate:open": _cache[0] || (_cache[0] = (v) => emit("update:open", v))
+        }, {
+          default: withCtx(() => [
+            createElementVNode("div", _hoisted_3, [
+              _ctx.$slots.header ? (openBlock(), createElementBlock("div", {
+                key: 0,
+                class: normalizeClass(["shrink-0", __props.divider ? "mb-3 border-b border-line pb-3" : "mb-2"])
+              }, [
+                renderSlot(_ctx.$slots, "header")
+              ], 2)) : createCommentVNode("", true),
+              createVNode(_sfc_main$1, {
+                groups: groups.value,
+                "pill-id": drawerPillId,
+                "item-active": itemActive,
+                loading: __props.loading,
+                "skeleton-rows": __props.skeletonRows,
+                "skeleton-header": __props.skeletonHeader,
+                onActivate: activate
+              }, createSlots({ _: 2 }, [
+                _ctx.$slots.item ? {
+                  name: "item",
+                  fn: withCtx((slotProps) => [
+                    renderSlot(_ctx.$slots, "item", normalizeProps(guardReactiveProps(slotProps)))
+                  ]),
+                  key: "0"
+                } : void 0
+              ]), 1032, ["groups", "loading", "skeleton-rows", "skeleton-header"]),
+              _ctx.$slots.actions ? (openBlock(), createElementBlock("div", _hoisted_4, [
+                renderSlot(_ctx.$slots, "actions")
+              ])) : createCommentVNode("", true),
+              _ctx.$slots.footer ? (openBlock(), createElementBlock("div", _hoisted_5, [
+                renderSlot(_ctx.$slots, "footer")
+              ])) : createCommentVNode("", true)
+            ])
+          ]),
+          _: 3
+        }, 8, ["open", "edge-open", "edge-breakpoint"])) : createCommentVNode("", true)
+      ], 64);
+    };
+  }
+});
+export {
+  _sfc_main as _
+};

package/dist/chunks/LpSidebarNav-CpF7rZxx.js

@@ -0,0 +1,126 @@
+import { defineComponent, openBlock, createElementBlock, createElementVNode, createCommentVNode, Fragment, renderList, createBlock, withCtx, toDisplayString, resolveDynamicComponent, normalizeClass, unref, renderSlot, createTextVNode } from "vue";
+import { Motion } from "motion-v";
+import { usePillTransition } from "../composables/usePillTransition.js";
+import { _ as _sfc_main$4 } from "./LpBadge-CXzBPnwO.js";
+import { _ as _sfc_main$2 } from "./LpContextMenu-D0mzXqA7.js";
+import { _ as _sfc_main$3 } from "./LpIcon-CCnX5_2j.js";
+import { _ as _sfc_main$1 } from "./LpScrollArea-K1x-azgY.js";
+const _hoisted_1 = {
+  key: 0,
+  class: "flex min-h-0 flex-1 flex-col gap-4"
+};
+const _hoisted_2 = {
+  key: 0,
+  class: "flex items-center gap-3 px-1"
+};
+const _hoisted_3 = { class: "space-y-1" };
+const _hoisted_4 = {
+  key: 0,
+  class: "px-2 pb-1 pt-2 text-[11px] font-semibold uppercase tracking-[0.08em] text-muted"
+};
+const _hoisted_5 = { class: "relative z-10 min-w-0 flex-1 truncate text-left" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "LpSidebarNav",
+  props: {
+    groups: {},
+    pillId: {},
+    itemActive: {},
+    loading: { type: Boolean },
+    skeletonRows: { default: 6 },
+    skeletonHeader: { type: Boolean, default: true }
+  },
+  emits: ["activate"],
+  setup(__props, { emit: __emit }) {
+    const emit = __emit;
+    const pillTransition = usePillTransition();
+    return (_ctx, _cache) => {
+      return __props.loading ? (openBlock(), createElementBlock("div", _hoisted_1, [
+        __props.skeletonHeader ? (openBlock(), createElementBlock("div", _hoisted_2, [..._cache[0] || (_cache[0] = [
+          createElementVNode("div", { class: "size-10 shrink-0 animate-pulse rounded-pill bg-surface-soft" }, null, -1),
+          createElementVNode("div", { class: "flex-1 space-y-2" }, [
+            createElementVNode("div", { class: "h-3.5 w-24 animate-pulse rounded bg-surface-soft" }),
+            createElementVNode("div", { class: "h-3 w-16 animate-pulse rounded bg-surface-soft/60" })
+          ], -1)
+        ])])) : createCommentVNode("", true),
+        createElementVNode("div", _hoisted_3, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(__props.skeletonRows, (n) => {
+            return openBlock(), createElementBlock("div", {
+              key: n,
+              class: "h-9 animate-pulse rounded-control bg-surface-soft"
+            });
+          }), 128))
+        ])
+      ])) : (openBlock(), createBlock(_sfc_main$1, {
+        key: 1,
+        class: "min-h-0 flex-1",
+        "content-class": "flex min-h-full flex-col gap-4"
+      }, {
+        default: withCtx(() => [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(__props.groups, (section, si) => {
+            return openBlock(), createElementBlock("div", {
+              key: si,
+              class: "flex flex-col gap-0.5"
+            }, [
+              section.title ? (openBlock(), createElementBlock("p", _hoisted_4, toDisplayString(section.title), 1)) : createCommentVNode("", true),
+              (openBlock(true), createElementBlock(Fragment, null, renderList(section.items, (item) => {
+                return openBlock(), createBlock(_sfc_main$2, {
+                  key: item.id,
+                  items: item.menu ?? []
+                }, {
+                  default: withCtx(() => [
+                    (openBlock(), createBlock(resolveDynamicComponent(item.href && !item.disabled ? "a" : "button"), {
+                      href: item.href && !item.disabled ? item.href : void 0,
+                      type: item.href ? void 0 : "button",
+                      disabled: item.href ? void 0 : item.disabled,
+                      "aria-current": __props.itemActive(item) ? "page" : void 0,
+                      "aria-disabled": item.disabled || void 0,
+                      class: normalizeClass(["group/item relative flex items-center gap-3 rounded-control px-3 py-2 text-sm font-medium outline-none transition-colors duration-[var(--duration-fast)] focus-visible:ring-2 focus-visible:ring-ring", item.disabled ? "cursor-not-allowed text-muted/50" : __props.itemActive(item) ? "text-ink" : "text-muted hover:text-ink"]),
+                      onClick: ($event) => emit("activate", item)
+                    }, {
+                      default: withCtx(() => [
+                        __props.itemActive(item) ? (openBlock(), createBlock(unref(Motion), {
+                          key: 0,
+                          "layout-id": __props.pillId,
+                          transition: unref(pillTransition),
+                          class: "absolute inset-0 z-0 rounded-control bg-brand-soft"
+                        }, null, 8, ["layout-id", "transition"])) : createCommentVNode("", true),
+                        renderSlot(_ctx.$slots, "item", {
+                          item,
+                          active: __props.itemActive(item)
+                        }, () => [
+                          item.icon ? (openBlock(), createBlock(_sfc_main$3, {
+                            key: 0,
+                            name: item.icon,
+                            size: 17,
+                            class: normalizeClass(["relative z-10 shrink-0 transition-colors", __props.itemActive(item) ? "text-brand" : ""])
+                          }, null, 8, ["name", "class"])) : createCommentVNode("", true),
+                          createElementVNode("span", _hoisted_5, toDisplayString(item.label), 1),
+                          item.badge != null ? (openBlock(), createBlock(_sfc_main$4, {
+                            key: 1,
+                            tone: __props.itemActive(item) ? "brand" : "neutral",
+                            class: "relative z-10 shrink-0"
+                          }, {
+                            default: withCtx(() => [
+                              createTextVNode(toDisplayString(item.badge), 1)
+                            ]),
+                            _: 2
+                          }, 1032, ["tone"])) : createCommentVNode("", true)
+                        ])
+                      ]),
+                      _: 2
+                    }, 1032, ["href", "type", "disabled", "aria-current", "aria-disabled", "class", "onClick"]))
+                  ]),
+                  _: 2
+                }, 1032, ["items"]);
+              }), 128))
+            ]);
+          }), 128))
+        ]),
+        _: 3
+      }));
+    };
+  }
+});
+export {
+  _sfc_main as _
+};

package/dist/chunks/LpSkeleton-eSFIo4kD.js

@@ -0,0 +1,22 @@
+import { defineComponent, openBlock, createElementBlock, normalizeClass } from "vue";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "LpSkeleton",
+  props: {
+    rounded: {}
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        "aria-hidden": "true",
+        class: normalizeClass(["animate-pulse bg-surface-soft", {
+          "rounded-control": __props.rounded === "control" || !__props.rounded,
+          "rounded-card": __props.rounded === "card",
+          "rounded-pill": __props.rounded === "pill"
+        }])
+      }, null, 2);
+    };
+  }
+});
+export {
+  _sfc_main as _
+};

package/dist/chunks/LpSlider-B1SF3pRV.js

@@ -0,0 +1,53 @@
+import { defineComponent, openBlock, createBlock, unref, withCtx, createVNode } from "vue";
+import { SliderRoot, SliderTrack, SliderRange, SliderThumb } from "reka-ui";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "LpSlider",
+  props: {
+    modelValue: { default: 0 },
+    min: { default: 0 },
+    max: { default: 100 },
+    step: { default: 1 },
+    disabled: { type: Boolean },
+    ariaLabel: {}
+  },
+  emits: ["update:modelValue", "change"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    function onUpdate(v) {
+      if (v && v.length) emit("update:modelValue", v[0]);
+    }
+    function onCommit(v) {
+      if (v && v.length) emit("change", v[0]);
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(SliderRoot), {
+        "model-value": [props.modelValue],
+        min: __props.min,
+        max: __props.max,
+        step: __props.step,
+        disabled: __props.disabled,
+        class: "relative flex h-5 w-full touch-none select-none items-center data-[disabled]:opacity-55",
+        "onUpdate:modelValue": onUpdate,
+        onValueCommit: onCommit
+      }, {
+        default: withCtx(() => [
+          createVNode(unref(SliderTrack), { class: "relative h-1.5 grow overflow-hidden rounded-pill bg-surface-soft" }, {
+            default: withCtx(() => [
+              createVNode(unref(SliderRange), { class: "absolute h-full rounded-pill bg-brand" })
+            ]),
+            _: 1
+          }),
+          createVNode(unref(SliderThumb), {
+            "aria-label": __props.ariaLabel,
+            class: "block size-4 rounded-pill border-2 border-brand bg-surface shadow outline-none transition-transform duration-[var(--duration-fast)] ease-[var(--ease-emphasized)] hover:scale-110 active:scale-95 focus-visible:ring-2 focus-visible:ring-ring motion-reduce:hover:scale-100 motion-reduce:active:scale-100"
+          }, null, 8, ["aria-label"])
+        ]),
+        _: 1
+      }, 8, ["model-value", "min", "max", "step", "disabled"]);
+    };
+  }
+});
+export {
+  _sfc_main as _
+};