@leavepulse/ui 0.69.0 → 0.70.0

package/dist/components/LpChart.vue.js

@@ -1,19 +1,23 @@
-import { defineComponent, ref, computed, onMounted, onBeforeUnmount, watch, shallowRef, openBlock, createElementBlock, mergeProps, unref, createBlock, createCommentVNode, createElementVNode, toDisplayString, renderSlot, Fragment, renderList, normalizeClass, normalizeStyle, createVNode, withCtx, createSlots, withDirectives, vShow, createTextVNode } from "vue";
+import { defineComponent, ref, computed, onMounted, shallowRef, watch, openBlock, createElementBlock, mergeProps, unref, createBlock, createCommentVNode, createElementVNode, toDisplayString, renderSlot, Fragment, renderList, normalizeClass, createVNode, withCtx, normalizeStyle, createSlots, withDirectives, vShow, createTextVNode } from "vue";
 import { Motion } from "motion-v";
 import { useLabels } from "../composables/useLpConfig.js";
 import { prefersReducedMotion, easeTravel } from "../composables/easing.js";
 import { usePillTransition } from "../composables/usePillTransition.js";
 import { useReveal } from "../composables/useReveal.js";
+import { useTween, lerp, mixValues, resample } from "../composables/useTween.js";
 import { normalise, pointCount, resolveLabels, extent, axisTicks, fitScale, plotHeight, plotWidth, xAt, yAt, areaPath, linePath, barPath, markerIndex, chartSummary, niceScale, nearestIndex, formatTick } from "./chart.js";
-import { _ as _sfc_main$2 } from "../chunks/LpContextMenu-CRnjoqSt.js";
-import { _ as _sfc_main$5 } from "../chunks/LpEmptyState-om1UnFjV.js";
-import { _ as _sfc_main$6 } from "../chunks/LpShift-DXNsauQZ.js";
-import { _ as _sfc_main$4 } from "../chunks/LpSkeleton-BB6XIV-w.js";
-import { _ as _sfc_main$3 } from "../chunks/LpSwap-D82jiecV.js";
+import { PANEL_SURFACE } from "./dropdown.js";
+import { _ as _sfc_main$2 } from "../chunks/LegendSwatch-BhRjrtzv.js";
+import { _ as _sfc_main$3 } from "../chunks/LpContextMenu-COwOwRgI.js";
+import { _ as _sfc_main$6 } from "../chunks/LpEmptyState-KTKipws2.js";
+import { _ as _sfc_main$7 } from "../chunks/LpShift-DXNsauQZ.js";
+import { _ as _sfc_main$5 } from "../chunks/LpSkeleton-BB6XIV-w.js";
+import { _ as _sfc_main$4 } from "../chunks/LpSwap-DzE6M3Mg.js";
 import { sampleValues, skeletonHeights, skeletonWave } from "./chartSkeleton.js";
 import { _ as _sfc_main$1 } from "../chunks/HintSampleTag-BV8AZXZh.js";
 import { useSample } from "../composables/useSample.js";
 import { useMergedAttrs } from "../composables/useMergedClass.js";
+import { useResizeObserver } from "../composables/useResizeObserver.js";
 import { toCsv, downloadFile, fileStem, svgToPng, backgroundOf, resolveCssColor } from "./exportData.js";
 import { _ as _export_sfc } from "../chunks/_plugin-vue_export-helper-1tPrXgE0.js";
 import '../assets/LpChart-CzgCGaAA.css';const _hoisted_1 = ["inert"];
@@ -153,7 +157,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const emit = __emit;
     const root = ref(null);
     const width = ref(0);
-    let ro = null;
     const { el: revealAnchor, revealed } = useReveal({ immediate: () => !props.animate });
     const reduced = ref(false);
     const still = computed(() => !props.animate || reduced.value);
@@ -161,20 +164,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     onMounted(() => {
       revealAnchor.value = root.value;
       reduced.value = prefersReducedMotion();
-      if (!root.value || typeof ResizeObserver === "undefined") return;
-      ro = new ResizeObserver(([entry]) => {
-        width.value = entry.contentRect.width;
-      });
-      ro.observe(root.value);
-      width.value = root.value.clientWidth;
     });
-    onBeforeUnmount(() => {
-      ro?.disconnect();
-      ro = null;
-      if (presenceFrame) cancelAnimationFrame(presenceFrame);
-      if (scaleFrame) cancelAnimationFrame(scaleFrame);
-      if (rightFrame) cancelAnimationFrame(rightFrame);
-      if (gutterFrame) cancelAnimationFrame(gutterFrame);
+    useResizeObserver(root, (entry, el) => width.value = entry ? entry.contentRect.width : el.clientWidth, {
+      immediate: true
     });
     const hidden = ref(/* @__PURE__ */ new Set());
     const toggleSeries = (id) => {
@@ -200,39 +192,61 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     );
     const visible = computed(() => allSeries.value.filter((s) => !hidden.value.has(s.id)));
     const SETTLE_MS = 260;
-    const presence = ref(/* @__PURE__ */ new Map());
-    let presenceFrame;
-    const presenceOf = (id) => presence.value.get(id) ?? 1;
-    watch(
-      // A string, not the Set: `hidden` is replaced wholesale on every toggle, and a
-      // watcher handed the object itself compares the new reference to the old one
-      // and sees a change it cannot describe — or, with a stale copy in the array,
-      // no change at all. The names that are currently off say it exactly.
-      () => allSeries.value.map((s) => `${s.id}:${hidden.value.has(s.id) ? 0 : 1}`).join(","),
-      () => {
-        const targets = new Map(allSeries.value.map((s) => [s.id, hidden.value.has(s.id) ? 0 : 1]));
-        if (!props.animate || prefersReducedMotion()) {
-          presence.value = targets;
-          return;
-        }
-        const from = new Map(allSeries.value.map((s) => [s.id, presenceOf(s.id)]));
-        if ([...targets].every(([name, to]) => from.get(name) === to)) return;
-        const start = performance.now();
-        if (presenceFrame) cancelAnimationFrame(presenceFrame);
-        const step = (now) => {
-          const t = Math.min(1, (now - start) / SETTLE_MS);
-          const eased = easeTravel(t);
-          const next = /* @__PURE__ */ new Map();
-          for (const [name, to] of targets) {
-            const a = from.get(name) ?? to;
-            next.set(name, a + (to - a) * eased);
-          }
-          presence.value = next;
-          presenceFrame = t < 1 ? requestAnimationFrame(step) : void 0;
-        };
-        presenceFrame = requestAnimationFrame(step);
+    const settle = {
+      duration: SETTLE_MS,
+      ease: easeTravel,
+      enabled: () => props.animate
+    };
+    const presenceTargets = computed(
+      () => new Map(allSeries.value.map((s) => [s.id, hidden.value.has(s.id) ? 0 : 1]))
+    );
+    const presence = useTween(
+      () => presenceTargets.value,
+      (from, to, t) => new Map([...to].map(([id, v]) => [id, lerp(from.get(id) ?? v, v, t)])),
+      {
+        ...settle,
+        // `hidden` is replaced wholesale on every toggle, and the map is rebuilt on
+        // every data change; only a different set of levels is a change worth moving.
+        equal: (a, b) => a.size === b.size && [...b].every(([id, v]) => a.get(id) === v)
       }
     );
+    const presenceOf = (id) => presence.value.get(id) ?? 1;
+    const targetDrawn = computed(() => {
+      const seen = /* @__PURE__ */ new Map();
+      return allSeries.value.map((s) => {
+        const n = seen.get(s.name) ?? 0;
+        seen.set(s.name, n + 1);
+        return { ...s, key: `${s.name}#${n}`, enter: 1 };
+      });
+    });
+    const mixDrawn = (from, to, t) => {
+      const before = new Map(from.map((s) => [s.key, s]));
+      const after = new Set(to.map((s) => s.key));
+      const out = to.map((s) => {
+        const was = before.get(s.key);
+        return was ? { ...s, values: mixValues(was.values, s.values, t), enter: lerp(was.enter, 1, t) } : { ...s, enter: t };
+      });
+      const points = count.value;
+      for (const s of from)
+        if (!after.has(s.key))
+          out.push({ ...s, values: resample(s.values, points), enter: s.enter * (1 - t) });
+      return out;
+    };
+    const drawnSeries = useTween(() => targetDrawn.value, mixDrawn, {
+      ...settle,
+      /*
+       * Only a plot already on screen morphs. While the wipe is still to come, or
+       * while the placeholder stands in (no svg yet), the data that follows draws
+       * itself in on its own entrance — a morph from readings nobody saw would
+       * only muddy it.
+       */
+      enabled: () => props.animate && revealed.value && !!svgEl.value
+    });
+    const drawnById = computed(() => {
+      const out = /* @__PURE__ */ new Map();
+      for (const s of drawnSeries.value) if (!out.has(s.id)) out.set(s.id, s);
+      return out;
+    });
     const count = computed(() => pointCount(allSeries.value));
     const labels = computed(() => resolveLabels(source.value, props.labels, count.value));
     const banded = computed(() => props.type === "bar");
@@ -296,30 +310,15 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const targetScale = computed(
       () => scaleFor(onLeft.value.length ? onLeft.value : declaredLeft.value)
     );
-    const scale = ref(targetScale.value);
-    let scaleFrame;
-    watch(targetScale, (to, from) => {
-      if (!props.animate || prefersReducedMotion() || !from) {
-        scale.value = to;
-        return;
-      }
-      if (from.min === to.min && from.max === to.max && from.step === to.step) return;
-      const start = performance.now();
-      if (scaleFrame) cancelAnimationFrame(scaleFrame);
-      const tick = (now) => {
-        const t = Math.min(1, (now - start) / SETTLE_MS);
-        const eased = easeTravel(t);
-        scale.value = t < 1 ? {
-          min: from.min + (to.min - from.min) * eased,
-          max: from.max + (to.max - from.max) * eased,
-          /* The step stays the target's: it decides how many ticks there are,
-             and a travelling one would add and drop labels mid-move. */
-          step: to.step
-        } : to;
-        scaleFrame = t < 1 ? requestAnimationFrame(tick) : void 0;
-      };
-      scaleFrame = requestAnimationFrame(tick);
+    const sameRange = (a, b) => a === b || !!a && !!b && a.min === b.min && a.max === b.max && a.step === b.step;
+    const mixRange = (from, to, t) => ({
+      min: lerp(from.min, to.min, t),
+      max: lerp(from.max, to.max, t),
+      /* The step stays the target's: it decides how many ticks there are, and a
+         travelling one would add and drop labels mid-move. */
+      step: to.step
     });
+    const scale = useTween(() => targetScale.value, mixRange, { ...settle, equal: sameRange });
     const targetRightScale = computed(() => {
       if (!hasRightAxis.value) return null;
       const members = onRight.value.length ? onRight.value : declaredRight.value;
@@ -330,28 +329,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       );
       return fitScale(raw.min, raw.max, steps);
     });
-    const rightScale = ref(targetRightScale.value);
-    let rightFrame;
-    watch(targetRightScale, (to, from) => {
-      if (!to || !from || !props.animate || prefersReducedMotion()) {
-        rightScale.value = to;
-        return;
-      }
-      if (from.min === to.min && from.max === to.max && from.step === to.step) return;
-      const start = performance.now();
-      if (rightFrame) cancelAnimationFrame(rightFrame);
-      const tick = (now) => {
-        const t = Math.min(1, (now - start) / SETTLE_MS);
-        const eased = easeTravel(t);
-        rightScale.value = t < 1 ? {
-          min: from.min + (to.min - from.min) * eased,
-          max: from.max + (to.max - from.max) * eased,
-          step: to.step
-        } : to;
-        rightFrame = t < 1 ? requestAnimationFrame(tick) : void 0;
-      };
-      rightFrame = requestAnimationFrame(tick);
-    });
+    const rightScale = useTween(
+      () => targetRightScale.value,
+      // An axis that appears or goes has no range to travel from or to.
+      (from, to, t) => from && to ? mixRange(from, to, t) : to,
+      { ...settle, equal: sameRange }
+    );
     const fmtWith = (v, unit, f) => `${f ? f(v) : formatTick(v)}${unit ?? ""}`;
     const fmt = (v) => fmtWith(v, props.unit, props.formatValue);
     const fmtRight = (v) => fmtWith(v, props.rightUnit ?? props.unit, props.formatRightValue ?? props.formatValue);
@@ -372,27 +355,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       left: props.showYAxis ? gutter(yLabels.value) : 8,
       right: props.showYAxis && rightLabels.value.length ? gutter(rightLabels.value) : 12
     }));
-    const gutters = ref(targetGutters.value);
-    let gutterFrame;
-    watch(targetGutters, (to, from) => {
-      if (!props.animate || prefersReducedMotion() || !from) {
-        gutters.value = to;
-        return;
-      }
-      if (from.left === to.left && from.right === to.right) return;
-      const start = performance.now();
-      if (gutterFrame) cancelAnimationFrame(gutterFrame);
-      const tick = (now) => {
-        const t = Math.min(1, (now - start) / SETTLE_MS);
-        const eased = easeTravel(t);
-        gutters.value = t < 1 ? {
-          left: from.left + (to.left - from.left) * eased,
-          right: from.right + (to.right - from.right) * eased
-        } : to;
-        gutterFrame = t < 1 ? requestAnimationFrame(tick) : void 0;
-      };
-      gutterFrame = requestAnimationFrame(tick);
-    });
+    const gutters = useTween(
+      () => targetGutters.value,
+      (from, to, t) => ({ left: lerp(from.left, to.left, t), right: lerp(from.right, to.right, t) }),
+      { ...settle, equal: (a, b) => a.left === b.left && a.right === b.right }
+    );
     const box = computed(() => ({
       width: width.value,
       height: props.height,
@@ -453,9 +420,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       )
     );
     const lines = computed(
-      () => allSeries.value.map((s) => {
+      () => drawnSeries.value.map((s) => {
         const g = geoOf(s);
-        const p = presenceOf(s.id);
+        const p = presenceOf(s.id) * s.enter;
         const base = Math.min(Math.max(0, g.min), g.max);
         const values = p === 1 ? s.values : s.values.map((v) => v == null ? null : base + (v - base) * p);
         return {
@@ -483,9 +450,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       const posTop = new Array(count.value).fill(0);
       const negTop = new Array(count.value).fill(0);
       visible.value.forEach((s, si) => {
+        const drawn = drawnById.value.get(s.id);
         for (let i = 0; i < count.value; i++) {
-          const v = s.values[i];
-          if (v == null) continue;
+          const raw = drawn ? drawn.values[i] : s.values[i];
+          if (raw == null) continue;
+          const v = raw * (drawn?.enter ?? 1);
           const centre = xAt(i, count.value, box.value, true);
           const x = props.stacked ? centre - inner / 2 : centre - inner / 2 + si * slot;
           let y;
@@ -585,12 +554,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       if (active.value < 0) return [];
       return visible.value.map((s) => ({ s, v: s.values[active.value] })).filter((r) => r.v != null).map(({ s, v }) => {
         const sc = scaleOf(s);
+        const at = drawnById.value.get(s.id)?.values[active.value] ?? v;
         return {
           color: s.color,
           id: s.id,
           name: s.name,
           value: v,
-          y: yAt(v, sc.min, sc.max, box.value)
+          y: yAt(at, sc.min, sc.max, box.value)
         };
       });
     });
@@ -619,7 +589,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const floatTransition = usePillTransition("float");
     const revealKey = shallowRef(0);
     watch(
-      () => `${props.type}|${count.value}|${allSeries.value.map((s) => s.id).join(",")}`,
+      () => props.type,
       () => {
         revealKey.value++;
       }
@@ -790,10 +760,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               "aria-pressed": !hidden.value.has(s.id),
               onClick: ($event) => toggleSeries(s.id)
             }, [
-              createElementVNode("span", {
-                class: "size-2 shrink-0 rounded-full transition-transform duration-fast group-hover:scale-125",
-                style: normalizeStyle({ backgroundColor: s.color })
-              }, null, 4),
+              createVNode(_sfc_main$2, {
+                color: s.color
+              }, null, 8, ["color"]),
               createElementVNode("span", _hoisted_8, toDisplayString(s.name), 1),
               hasRightAxis.value && s.axis === "right" ? (openBlock(), createElementBlock("span", {
                 key: 0,
@@ -803,7 +772,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             ], 10, _hoisted_7);
           }), 128))
         ])) : createCommentVNode("", true),
-        createVNode(_sfc_main$2, {
+        createVNode(_sfc_main$3, {
           items: menuEntries.value,
           always: !!__props.menuItems
         }, {
@@ -819,14 +788,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               onKeydown,
               onBlur
             }, [
-              createVNode(_sfc_main$3, { "swap-key": plotState.value }, {
+              createVNode(_sfc_main$4, { "swap-key": plotState.value }, {
                 default: withCtx(() => [
                   __props.loading ? (openBlock(), createElementBlock("div", {
                     key: 0,
                     style: normalizeStyle({ height: `${__props.height}px` })
                   }, [
                     createElementVNode("span", _hoisted_11, toDisplayString(unref(strings).loading), 1),
-                    createVNode(_sfc_main$4, {
+                    createVNode(_sfc_main$5, {
                       class: "flex size-full",
                       style: normalizeStyle({ paddingTop: "10px", paddingBottom: __props.showXAxis ? "26px" : "8px" })
                     }, {
@@ -885,7 +854,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                       ]),
                       _: 1
                     }, 8, ["style"])
-                  ], 4)) : !hasData.value ? (openBlock(), createBlock(_sfc_main$5, {
+                  ], 4)) : !hasData.value ? (openBlock(), createBlock(_sfc_main$6, {
                     key: 1,
                     compact: "",
                     icon: __props.emptyIcon ?? "lucide:chart-no-axes-column",
@@ -918,7 +887,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                       (openBlock(true), createElementBlock(Fragment, null, renderList(lines.value, (s, i) => {
                         return openBlock(), createElementBlock("linearGradient", {
                           id: gradientId(s.name, i),
-                          key: s.id,
+                          key: s.key,
                           x1: "0",
                           y1: "0",
                           x2: "0",
@@ -993,7 +962,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                         ], 64);
                       }), 128))
                     ])) : createCommentVNode("", true),
-                    scale.value.min < 0 && scale.value.max > 0 ? (openBlock(), createElementBlock("line", {
+                    unref(scale).min < 0 && unref(scale).max > 0 ? (openBlock(), createElementBlock("line", {
                       key: 1,
                       x1: box.value.left,
                       x2: box.value.width - box.value.right,
@@ -1036,7 +1005,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                       }), 128)),
                       (openBlock(true), createElementBlock(Fragment, null, renderList(lines.value, (s, i) => {
                         return openBlock(), createElementBlock("g", {
-                          key: `s-${s.id}`,
+                          key: `s-${s.key}`,
                           style: normalizeStyle({ opacity: s.alpha })
                         }, [
                           withDirectives(createElementVNode("path", {
@@ -1155,7 +1124,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               active.value >= 0 && ready.value ? (openBlock(), createBlock(unref(Motion), {
                 key: 0,
                 as: "div",
-                class: "pointer-events-none absolute left-0 top-0 z-(--z-tooltip) min-w-32 rounded-control border border-line bg-surface-overlay px-2.5 py-2 shadow-panel backdrop-blur group-data-[state=open]/plot:hidden",
+                class: normalizeClass(["pointer-events-none absolute left-0 top-0 z-(--z-tooltip) min-w-32 px-2.5 py-2 group-data-[state=open]/plot:hidden", unref(PANEL_SURFACE)]),
                 initial: { opacity: 0, scale: 0.96 },
                 animate: {
                   opacity: 1,
@@ -1166,7 +1135,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 transition: unref(floatTransition)
               }, {
                 default: withCtx(() => [
-                  createVNode(_sfc_main$6, { axis: "both" }, {
+                  createVNode(_sfc_main$7, { axis: "both" }, {
                     default: withCtx(() => [
                       createElementVNode("div", _hoisted_47, toDisplayString(labels.value[active.value]), 1),
                       createElementVNode("div", _hoisted_48, [
@@ -1191,7 +1160,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   })
                 ]),
                 _: 1
-              }, 8, ["animate", "transition"])) : createCommentVNode("", true),
+              }, 8, ["class", "animate", "transition"])) : createCommentVNode("", true),
               createElementVNode("span", _hoisted_51, toDisplayString(readout.value), 1)
             ], 44, _hoisted_10)
           ]),
@@ -1227,7 +1196,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const LpChart = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-b07a9ec2"]]);
+const LpChart = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-b0563c78"]]);
 export {
   LpChart as default
 };

package/dist/components/LpCheckbox.vue.d.ts

@@ -17,9 +17,9 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
      */
     action?: (value: boolean) => unknown;
 }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    done: (value: boolean) => any;
     change: (value: boolean) => any;
     error: (error: unknown) => any;
+    done: (value: boolean) => any;
     "update:modelValue": (value: boolean) => any;
 }, string, import("vue").PublicProps, Readonly<{
     modelValue?: boolean;
@@ -38,9 +38,9 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
      */
     action?: (value: boolean) => unknown;
 }> & Readonly<{
-    onDone?: ((value: boolean) => any) | undefined;
     onChange?: ((value: boolean) => any) | undefined;
     onError?: ((error: unknown) => any) | undefined;
+    onDone?: ((value: boolean) => any) | undefined;
     "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
     default?: (props: {}) => any;

package/dist/components/LpCheckbox.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpCheckbox-Da5oZPHo.js";
+import { _ as _sfc_main } from "../chunks/LpCheckbox-DHc2bHDe.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpCodeBlock.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpCodeBlock-lLbmslfs.js";
+import { _ as _sfc_main } from "../chunks/LpCodeBlock-BGsQhxw8.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpCodeDisplay.vue.d.ts

@@ -0,0 +1,89 @@
+declare const _default: typeof __VLS_export;
+export default _default;
+export interface CodeDisplayLabels extends Record<string, string> {
+    show: string;
+    hide: string;
+    hidden: string;
+    expiresIn: string;
+    expired: string;
+    saved: string;
+}
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
+    code: string;
+    /** One size for every group, or exact sizes in order. Unset picks 3s or 4s by length. */
+    groups?: number | number[];
+    /** Drawn between groups: `""` (a gap, the default), `"-"`, `"·"`, `" "`. */
+    separator?: string;
+    /** Copy with separators (`grouped`) or the characters alone (`raw`, default). */
+    copyAs?: "raw" | "grouped";
+    /** Hidden until revealed (v-model:revealed). Copy still works while hidden. */
+    masked?: boolean;
+    copyable?: boolean;
+    /** When the code stops working; shows a countdown. */
+    expiresAt?: Date | number | string;
+    /**
+     * When it was issued, for the countdown bar's full length. Unset, the bar
+     * starts full at the moment it first appears.
+     */
+    issuedAt?: Date | number | string;
+    /** Add the "I've saved this" confirmation (v-model:saved). */
+    ack?: boolean;
+    size?: "sm" | "md" | "lg";
+    labels?: Partial<CodeDisplayLabels>;
+} & {
+    revealed?: boolean;
+    saved?: boolean;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:revealed": (value: boolean) => any;
+    "update:saved": (value: boolean) => any;
+} & {
+    copied: (text: string) => any;
+    expired: () => any;
+}, string, import("vue").PublicProps, Readonly<{
+    code: string;
+    /** One size for every group, or exact sizes in order. Unset picks 3s or 4s by length. */
+    groups?: number | number[];
+    /** Drawn between groups: `""` (a gap, the default), `"-"`, `"·"`, `" "`. */
+    separator?: string;
+    /** Copy with separators (`grouped`) or the characters alone (`raw`, default). */
+    copyAs?: "raw" | "grouped";
+    /** Hidden until revealed (v-model:revealed). Copy still works while hidden. */
+    masked?: boolean;
+    copyable?: boolean;
+    /** When the code stops working; shows a countdown. */
+    expiresAt?: Date | number | string;
+    /**
+     * When it was issued, for the countdown bar's full length. Unset, the bar
+     * starts full at the moment it first appears.
+     */
+    issuedAt?: Date | number | string;
+    /** Add the "I've saved this" confirmation (v-model:saved). */
+    ack?: boolean;
+    size?: "sm" | "md" | "lg";
+    labels?: Partial<CodeDisplayLabels>;
+} & {
+    revealed?: boolean;
+    saved?: boolean;
+}> & Readonly<{
+    onCopied?: ((text: string) => any) | undefined;
+    "onUpdate:revealed"?: ((value: boolean) => any) | undefined;
+    onExpired?: (() => any) | undefined;
+    "onUpdate:saved"?: ((value: boolean) => any) | undefined;
+}>, {
+    size: "sm" | "md" | "lg";
+    separator: string;
+    copyable: boolean;
+    copyAs: "raw" | "grouped";
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    expiry?: (props: {
+        remaining: number;
+        formatted: string;
+        expired: boolean;
+        fraction: number;
+    }) => any;
+}>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/LpCodeDisplay.vue.js

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

package/dist/components/LpCollapse.vue.d.ts

@@ -0,0 +1,58 @@
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
+    /** Which dimension folds: `height` for a section, `width` for a side panel or a toolbar group, `both` for a corner pop-out. */
+    axis?: "height" | "width" | "both";
+    /** Fade the content along with the fold, so it does not show sliced while the box is small. */
+    fade?: boolean;
+    /**
+     * Keep the content in the DOM while closed (hidden), so its state survives:
+     * a half-filled form, a scroll position, a playing preview. Off, it is
+     * unmounted once folded away, like `v-if`.
+     */
+    keepMounted?: boolean;
+    /** With `keepMounted`, do not mount the content until it is first opened: an expensive body costs nothing until asked for. */
+    lazy?: boolean;
+    /** Length of the fold in ms. Defaults to the kit's `--duration-medium`. */
+    duration?: number;
+} & {
+    open?: boolean;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:open": (value: boolean) => any;
+} & {
+    opened: () => any;
+    closed: () => any;
+}, string, import("vue").PublicProps, Readonly<{
+    /** Which dimension folds: `height` for a section, `width` for a side panel or a toolbar group, `both` for a corner pop-out. */
+    axis?: "height" | "width" | "both";
+    /** Fade the content along with the fold, so it does not show sliced while the box is small. */
+    fade?: boolean;
+    /**
+     * Keep the content in the DOM while closed (hidden), so its state survives:
+     * a half-filled form, a scroll position, a playing preview. Off, it is
+     * unmounted once folded away, like `v-if`.
+     */
+    keepMounted?: boolean;
+    /** With `keepMounted`, do not mount the content until it is first opened: an expensive body costs nothing until asked for. */
+    lazy?: boolean;
+    /** Length of the fold in ms. Defaults to the kit's `--duration-medium`. */
+    duration?: number;
+} & {
+    open?: boolean;
+}> & Readonly<{
+    "onUpdate:open"?: ((value: boolean) => any) | undefined;
+    onOpened?: (() => any) | undefined;
+    onClosed?: (() => any) | undefined;
+}>, {
+    fade: boolean;
+    axis: "height" | "width" | "both";
+    keepMounted: boolean;
+    lazy: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    default?: (props: {}) => any;
+}>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/LpCollapse.vue.js

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

package/dist/components/LpColorPicker.vue.d.ts

@@ -84,7 +84,7 @@ type __VLS_Props = {
      */
     copyToast?: string | false;
 };
-declare var __VLS_61: {
+declare var __VLS_63: {
     color: string;
     hsv: {
         h: number;
@@ -94,7 +94,7 @@ declare var __VLS_61: {
     };
 };
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_61) => any;
+    default?: (props: typeof __VLS_63) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
     open: import("vue").Ref<boolean, boolean>;

package/dist/components/LpColorPicker.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpColorPicker-DtEfBAcK.js";
+import { _ as _sfc_main } from "../chunks/LpColorPicker-DFugXNUi.js";
 export {
   _sfc_main as default
 };