@leavepulse/ui 0.78.0 → 0.78.2

package/dist/chunks/LpNumberField-C8LfUz_R.js

@@ -0,0 +1,154 @@
+import { defineComponent, useId, useAttrs, computed, openBlock, createBlock, normalizeProps, guardReactiveProps, unref, withCtx, createVNode, normalizeStyle, normalizeClass, createSlots, renderSlot, createCommentVNode, mergeProps, createElementBlock, toDisplayString } from "vue";
+import { _ as _sfc_main$1 } from "./FieldWrapper-DnuMTrqW.js";
+import { CONTROL_SIZE } from "../components/controlSize.js";
+import { usePaletteControl } from "../composables/usePaletteCommands.js";
+import { NumberFieldRoot, NumberFieldDecrement, NumberFieldInput, NumberFieldIncrement } from "reka-ui";
+import { _ as _sfc_main$2 } from "./FieldLeading-mr81aEAP.js";
+import { _ as _sfc_main$3 } from "./LpIcon-C6JpQ5td.js";
+import { useOwnField, mergeDescribedBy, focusLeft } from "../composables/useField.js";
+import { useLabels } from "../composables/useLpConfig.js";
+import { useMergedClass } from "../composables/useMergedClass.js";
+const _hoisted_1 = ["id"];
+const __default__ = { inheritAttrs: false };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  __name: "LpNumberField",
+  props: {
+    palette: { type: [Boolean, Object], default: void 0 },
+    modelValue: {},
+    min: {},
+    max: {},
+    step: {},
+    stepSnapping: { type: Boolean, default: true },
+    formatOptions: {},
+    locale: {},
+    readonly: { type: Boolean },
+    disableWheelChange: { type: Boolean },
+    invertWheelChange: { type: Boolean },
+    focusOnChange: { type: Boolean, default: true },
+    steppers: { type: Boolean, default: true },
+    disabled: { type: Boolean },
+    unit: {},
+    icon: {},
+    invalid: { type: Boolean },
+    error: {},
+    size: { default: "md" },
+    labels: {}
+  },
+  emits: ["update:modelValue", "blur"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const unitId = useId();
+    const text = useLabels(
+      "numberField",
+      { increase: "Increase", decrease: "Decrease" },
+      () => props.labels
+    );
+    const SIZE = CONTROL_SIZE;
+    const attrs = useAttrs();
+    const { field, wrapper, ownAttrs } = useOwnField(() => ({ error: props.error, invalid: props.invalid, disabled: props.disabled }));
+    const describedBy = computed(
+      () => mergeDescribedBy(attrs["aria-describedby"], field.value.describedBy, props.unit ? unitId : void 0)
+    );
+    const inputAttrs = computed(() => {
+      const { class: _c, style: _s, id: _i, name: _n, ...rest } = attrs;
+      return rest;
+    });
+    function onFocusOut(event) {
+      if (focusLeft(event)) emit("blur", event);
+    }
+    const rootClass = useMergedClass(() => [
+      "@container flex w-full items-center rounded-control border bg-surface-soft transition-colors duration-[var(--duration-fast)] focus-within:ring-2 data-[disabled]:cursor-not-allowed data-[disabled]:opacity-55",
+      SIZE[props.size],
+      field.value.invalid ? "border-danger focus-within:border-danger focus-within:ring-danger-soft" : "border-line focus-within:border-brand focus-within:ring-ring"
+    ].join(" "), () => ownAttrs());
+    usePaletteControl({ disabled: () => field.value.disabled, invalid: () => field.value.invalid });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(_sfc_main$1, normalizeProps(guardReactiveProps(unref(wrapper))), {
+        default: withCtx(() => [
+          createVNode(unref(NumberFieldRoot), {
+            "model-value": __props.modelValue ?? void 0,
+            min: __props.min,
+            max: __props.max,
+            step: __props.step,
+            "step-snapping": __props.stepSnapping,
+            readonly: __props.readonly,
+            "disable-wheel-change": __props.disableWheelChange,
+            "invert-wheel-change": __props.invertWheelChange,
+            "focus-on-change": __props.focusOnChange,
+            "format-options": __props.formatOptions,
+            locale: __props.locale,
+            disabled: unref(field).disabled,
+            required: unref(field).required,
+            "data-lp-ring-owner": "",
+            class: normalizeClass(unref(rootClass)),
+            style: normalizeStyle(unref(ownAttrs)() ? unref(attrs).style : void 0),
+            name: typeof unref(attrs).name === "string" ? unref(attrs).name : void 0,
+            "onUpdate:modelValue": _cache[0] || (_cache[0] = (v) => emit("update:modelValue", Number.isNaN(v) ? null : v ?? null)),
+            onFocusout: onFocusOut
+          }, {
+            default: withCtx(() => [
+              createVNode(_sfc_main$2, {
+                icon: __props.icon,
+                class: "pl-2.5"
+              }, createSlots({ _: 2 }, [
+                _ctx.$slots.leading ? {
+                  name: "default",
+                  fn: withCtx(() => [
+                    renderSlot(_ctx.$slots, "leading")
+                  ]),
+                  key: "0"
+                } : void 0
+              ]), 1032, ["icon"]),
+              __props.steppers ? (openBlock(), createBlock(unref(NumberFieldDecrement), {
+                key: 0,
+                "aria-label": unref(text).decrease,
+                class: "group grid h-full w-8 shrink-0 place-items-center @max-[8.5rem]:hidden text-muted transition-colors duration-[var(--duration-fast)] hover:text-ink disabled:opacity-40"
+              }, {
+                default: withCtx(() => [
+                  createVNode(_sfc_main$3, {
+                    name: "lucide:minus",
+                    size: 15,
+                    class: "transition-transform duration-[var(--duration-fast)] ease-[var(--ease-emphasized)] group-active:scale-75 motion-reduce:group-active:scale-100"
+                  })
+                ]),
+                _: 1
+              }, 8, ["aria-label"])) : createCommentVNode("", true),
+              createVNode(unref(NumberFieldInput), mergeProps(inputAttrs.value, {
+                id: unref(field).id,
+                "aria-describedby": describedBy.value,
+                "aria-invalid": unref(field).invalid || void 0,
+                class: ["min-w-0 flex-1 bg-transparent text-ink outline-none placeholder:text-muted [appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none", __props.steppers ? "text-center @max-[8.5rem]:px-3 @max-[8.5rem]:text-left" : __props.icon || _ctx.$slots.leading ? "pl-2 pr-3" : "px-3"]
+              }), null, 16, ["id", "aria-describedby", "aria-invalid", "class"]),
+              __props.unit ? (openBlock(), createElementBlock("span", {
+                key: 1,
+                id: unref(unitId),
+                class: normalizeClass(["shrink-0 pr-1 text-xs text-muted", !__props.steppers && "pr-3"])
+              }, toDisplayString(__props.unit), 11, _hoisted_1)) : createCommentVNode("", true),
+              __props.steppers ? (openBlock(), createBlock(unref(NumberFieldIncrement), {
+                key: 2,
+                "aria-label": unref(text).increase,
+                class: "group grid h-full w-8 shrink-0 place-items-center @max-[8.5rem]:hidden text-muted transition-colors duration-[var(--duration-fast)] hover:text-ink disabled:opacity-40"
+              }, {
+                default: withCtx(() => [
+                  createVNode(_sfc_main$3, {
+                    name: "lucide:plus",
+                    size: 15,
+                    class: "transition-transform duration-[var(--duration-fast)] ease-[var(--ease-emphasized)] group-active:scale-75 motion-reduce:group-active:scale-100"
+                  })
+                ]),
+                _: 1
+              }, 8, ["aria-label"])) : createCommentVNode("", true)
+            ]),
+            _: 3
+          }, 8, ["model-value", "min", "max", "step", "step-snapping", "readonly", "disable-wheel-change", "invert-wheel-change", "focus-on-change", "format-options", "locale", "disabled", "required", "class", "style", "name"])
+        ]),
+        _: 3
+      }, 16);
+    };
+  }
+});
+export {
+  _sfc_main as _
+};

package/dist/chunks/LpOtpInput-B1X9l9no.js

@@ -0,0 +1,140 @@
+import { defineComponent, computed, ref, watch, openBlock, createBlock, normalizeProps, guardReactiveProps, unref, withCtx, createVNode, mergeProps, createElementBlock, Fragment, renderList, normalizeClass, createCommentVNode } from "vue";
+import { _ as _sfc_main$1 } from "./FieldWrapper-DnuMTrqW.js";
+import { PinInputRoot, PinInputInput } from "reka-ui";
+import { useOwnField, mergeDescribedBy } from "../composables/useField.js";
+import { useMergedAttrs } from "../composables/useMergedClass.js";
+import { splitCode, upperCells, joinCells, groupBreaks } from "../components/otp.js";
+const _hoisted_1 = {
+  key: 0,
+  "aria-hidden": "true",
+  class: "h-0.5 w-2 shrink-0 rounded-full bg-muted opacity-60"
+};
+const __default__ = { inheritAttrs: false };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  __name: "LpOtpInput",
+  props: {
+    modelValue: {},
+    length: { default: 6 },
+    disabled: { type: Boolean },
+    mask: { type: Boolean },
+    alphanumeric: { type: Boolean, default: false },
+    uppercase: { type: Boolean, default: void 0 },
+    group: {},
+    invalid: { type: Boolean },
+    error: {},
+    size: { default: "md" }
+  },
+  emits: ["update:modelValue", "complete"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const upper = computed(() => props.alphanumeric && (props.uppercase ?? true));
+    const local = ref(splitCode(props.modelValue, props.length));
+    let emitted = props.modelValue ?? "";
+    watch(
+      () => props.modelValue ?? "",
+      (value) => {
+        if (value === emitted) return;
+        emitted = value;
+        local.value = splitCode(value, props.length);
+      }
+    );
+    watch(
+      () => props.length,
+      (length) => {
+        local.value = local.value.slice(0, length);
+      }
+    );
+    const cells = computed({
+      get: () => local.value,
+      set: (arr) => {
+        local.value = upper.value ? upperCells(arr) : arr;
+        emitted = joinCells(local.value);
+        emit("update:modelValue", emitted);
+      }
+    });
+    const { field, wrapper, ownAttrs } = useOwnField(() => ({
+      error: props.error,
+      invalid: props.invalid,
+      disabled: props.disabled
+    }));
+    function onComplete(arr) {
+      emit("complete", joinCells(upper.value ? upperCells(arr) : arr));
+    }
+    const breaks = computed(() => groupBreaks(props.length, props.group));
+    const root = ref(null);
+    function onBeforeInput(event, index) {
+      if (event.inputType !== "deleteContentBackward") return;
+      event.preventDefault();
+      const target = event.target;
+      const next = [...local.value];
+      let clear = index;
+      if (!target.value && index > 0) {
+        clear = index - 1;
+        root.value?.$el.querySelectorAll("input")[clear]?.focus();
+      }
+      next[clear] = props.alphanumeric ? "" : void 0;
+      cells.value = next;
+    }
+    const cellSize = {
+      sm: "max-w-9 text-base",
+      md: "max-w-11 text-lg",
+      lg: "max-w-13 text-xl"
+    };
+    const { class: rootClass, attrs: rest } = useMergedAttrs(
+      "flex min-w-0 max-w-full items-center gap-1.5 sm:gap-2",
+      () => ownAttrs()
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(_sfc_main$1, normalizeProps(guardReactiveProps(unref(wrapper))), {
+        default: withCtx(() => [
+          createVNode(unref(PinInputRoot), mergeProps({
+            ref_key: "root",
+            ref: root,
+            modelValue: cells.value,
+            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => cells.value = $event),
+            type: __props.alphanumeric ? "text" : "number",
+            mask: __props.mask,
+            disabled: unref(field).disabled,
+            required: unref(field).required,
+            otp: "",
+            class: unref(rootClass)
+          }, unref(rest), { onComplete }), {
+            default: withCtx(() => [
+              (openBlock(true), createElementBlock(Fragment, null, renderList(__props.length, (i) => {
+                return openBlock(), createElementBlock(Fragment, { key: i }, [
+                  createVNode(unref(PinInputInput), {
+                    index: i - 1,
+                    id: i === 1 ? unref(field).id : void 0,
+                    "aria-invalid": unref(field).invalid || void 0,
+                    "aria-describedby": unref(mergeDescribedBy)(unref(rest)["aria-describedby"], unref(field).describedBy),
+                    autocapitalize: upper.value ? "characters" : "none",
+                    autocorrect: "off",
+                    spellcheck: false,
+                    class: normalizeClass([
+                      cellSize[__props.size],
+                      "aspect-square h-auto min-w-0 flex-1 basis-0 p-0",
+                      "rounded-control border bg-surface-soft text-center font-semibold text-ink caret-brand",
+                      "outline-none transition-colors duration-[var(--duration-fast)]",
+                      "focus:border-brand focus:ring-2 focus:ring-ring",
+                      "disabled:cursor-not-allowed disabled:opacity-55",
+                      unref(field).invalid ? "border-danger focus:border-danger focus:ring-danger-soft" : "border-line"
+                    ]),
+                    onBeforeinput: ($event) => onBeforeInput($event, i - 1)
+                  }, null, 8, ["index", "id", "aria-invalid", "aria-describedby", "autocapitalize", "class", "onBeforeinput"]),
+                  breaks.value.has(i - 1) ? (openBlock(), createElementBlock("span", _hoisted_1)) : createCommentVNode("", true)
+                ], 64);
+              }), 128))
+            ]),
+            _: 1
+          }, 16, ["modelValue", "type", "mask", "disabled", "required", "class"])
+        ]),
+        _: 1
+      }, 16);
+    };
+  }
+});
+export {
+  _sfc_main as _
+};

package/dist/chunks/LpPageScrollbar-D2O0xhJw.js

@@ -0,0 +1,164 @@
+import { defineComponent, ref, computed, onMounted, onBeforeUnmount, openBlock, createElementBlock, normalizeStyle, normalizeClass, createElementVNode, withModifiers, unref } from "vue";
+import { mergeClass } from "../composables/useMergedClass.js";
+import { nodeWindow } from "../composables/realm.js";
+import { hideNativeBar, BAR_FADE, BAR_Y_SIZE, BAR_Y, THUMB_Y, THUMB_Y_ROUND, SCROLL_HIDE_DELAY_MS, pageToward } from "../components/scrollbar.js";
+const _hoisted_1 = ["data-state"];
+const MIN_THUMB_PX = 18;
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "LpPageScrollbar",
+  props: {
+    top: { default: "0px" },
+    bottom: { default: "0px" }
+  },
+  setup(__props) {
+    const props = __props;
+    const barEl = ref(null);
+    const active = ref(false);
+    const thumb = ref({ top: 0, height: 0 });
+    const scrollable = ref(false);
+    const scrolling = ref(false);
+    const hovered = ref(false);
+    const dragging = ref(false);
+    const state = computed(() => scrolling.value || hovered.value || dragging.value ? "visible" : shownOnce.value ? "hidden" : void 0);
+    const shownOnce = ref(false);
+    let releaseNative;
+    let doc;
+    let hideTimer;
+    let frame = 0;
+    let sizes;
+    function scroller() {
+      return doc?.scrollingElement ?? null;
+    }
+    function nativeBarWidth(d) {
+      const probe = d.createElement("div");
+      probe.style.cssText = "position:absolute;top:-9999px;width:100px;height:100px;overflow:scroll";
+      d.body.append(probe);
+      const width = probe.offsetWidth - probe.clientWidth;
+      probe.remove();
+      return width;
+    }
+    function measure() {
+      frame = 0;
+      const view = scroller();
+      const bar = barEl.value;
+      if (!view || !bar) return;
+      const range = view.scrollHeight - view.clientHeight;
+      scrollable.value = range > 1;
+      if (!scrollable.value) return;
+      const track = bar.clientHeight;
+      const height = Math.max(MIN_THUMB_PX, Math.round(track * view.clientHeight / view.scrollHeight));
+      thumb.value = { height, top: Math.round((track - height) * view.scrollTop / range) };
+    }
+    function measureSoon() {
+      if (!frame && doc) frame = nodeWindow(doc).requestAnimationFrame(measure);
+    }
+    function onScroll() {
+      measureSoon();
+      scrolling.value = true;
+      shownOnce.value = true;
+      clearTimeout(hideTimer);
+      hideTimer = setTimeout(() => scrolling.value = false, SCROLL_HIDE_DELAY_MS);
+    }
+    function onEnter() {
+      hovered.value = true;
+      shownOnce.value = true;
+    }
+    function onLeave() {
+      hideTimer && clearTimeout(hideTimer);
+      hideTimer = setTimeout(() => {
+        hovered.value = false;
+        scrolling.value = false;
+      }, SCROLL_HIDE_DELAY_MS);
+    }
+    function locked() {
+      return !!doc && nodeWindow(doc).getComputedStyle(doc.body).overflow === "hidden";
+    }
+    function onTrackPointerDown(event) {
+      const view = scroller();
+      const thumbEl = barEl.value?.querySelector("[data-lp-thumb]");
+      if (!view || !thumbEl || event.button !== 0 || thumbEl.contains(event.target) || locked()) return;
+      event.preventDefault();
+      pageToward(view, "y", event.clientY < thumbEl.getBoundingClientRect().top);
+    }
+    function onThumbPointerDown(event) {
+      const view = scroller();
+      const bar = barEl.value;
+      if (!view || !bar || event.button !== 0 || locked()) return;
+      event.preventDefault();
+      const handle = event.currentTarget;
+      handle.setPointerCapture(event.pointerId);
+      dragging.value = true;
+      const startY = event.clientY;
+      const startTop = view.scrollTop;
+      const perPixel = (view.scrollHeight - view.clientHeight) / Math.max(1, bar.clientHeight - thumb.value.height);
+      const move = (e) => view.scrollTo({ top: startTop + (e.clientY - startY) * perPixel, behavior: "instant" });
+      const stop = () => {
+        dragging.value = false;
+        handle.removeEventListener("pointermove", move);
+        handle.removeEventListener("pointerup", stop);
+        handle.removeEventListener("pointercancel", stop);
+        handle.removeEventListener("lostpointercapture", stop);
+      };
+      handle.addEventListener("pointermove", move);
+      handle.addEventListener("pointerup", stop);
+      handle.addEventListener("pointercancel", stop);
+      handle.addEventListener("lostpointercapture", stop);
+    }
+    onMounted(() => {
+      const host = barEl.value ?? void 0;
+      doc = host?.ownerDocument;
+      if (!doc || nativeBarWidth(doc) === 0) return;
+      active.value = true;
+      releaseNative = hideNativeBar(doc);
+      const win = nodeWindow(doc);
+      win.addEventListener("scroll", onScroll, { passive: true });
+      win.addEventListener("resize", measureSoon);
+      sizes = new win.ResizeObserver(measureSoon);
+      sizes.observe(doc.body);
+      if (host) sizes.observe(host);
+      measure();
+    });
+    onBeforeUnmount(() => {
+      clearTimeout(hideTimer);
+      sizes?.disconnect();
+      if (!doc || !active.value) return;
+      const win = nodeWindow(doc);
+      if (frame) win.cancelAnimationFrame(frame);
+      win.removeEventListener("scroll", onScroll);
+      win.removeEventListener("resize", measureSoon);
+      releaseNative?.();
+    });
+    const barClass = computed(
+      () => mergeClass(
+        BAR_Y,
+        BAR_Y_SIZE.wall,
+        BAR_FADE,
+        "fixed right-0 z-(--z-sticky) transition-[top,bottom] duration-[var(--duration-medium)] ease-[var(--ease-settle)] print:hidden"
+      )
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        ref_key: "barEl",
+        ref: barEl,
+        "aria-hidden": "true",
+        "data-lp-page-scrollbar": "",
+        class: normalizeClass(barClass.value),
+        "data-state": active.value && scrollable.value ? state.value : void 0,
+        style: normalizeStyle({ top: props.top, bottom: props.bottom, visibility: active.value && scrollable.value ? void 0 : "hidden" }),
+        onPointerenter: onEnter,
+        onPointerleave: onLeave,
+        onPointerdown: onTrackPointerDown
+      }, [
+        createElementVNode("div", {
+          "data-lp-thumb": "",
+          class: normalizeClass(["absolute right-px", [unref(THUMB_Y), unref(THUMB_Y_ROUND).wall]]),
+          style: normalizeStyle({ top: `${thumb.value.top}px`, height: `${thumb.value.height}px` }),
+          onPointerdown: withModifiers(onThumbPointerDown, ["stop"])
+        }, null, 38)
+      ], 46, _hoisted_1);
+    };
+  }
+});
+export {
+  _sfc_main as _
+};

package/dist/chunks/{LpPaletteTheme-dVtxHx-F.js → LpPaletteTheme-B-xuZiKK.js}

@@ -1,10 +1,10 @@
 import { defineComponent, ref, computed, openBlock, createElementBlock, createElementVNode, createVNode, withCtx, createTextVNode, toDisplayString, unref } from "vue";
 import { useLabels } from "../composables/useLpConfig.js";
 import { suppressPaletteDiscovery } from "../composables/usePaletteCommands.js";
-import { _ as _sfc_main$4 } from "./LpThemeStudio-DzYfE-5k.js";
+import { _ as _sfc_main$4 } from "./LpThemeStudio-R-wohbCY.js";
 import { _ as _sfc_main$2 } from "./LpThemeProvider-XK6ZeWAE.js";
 import { _ as _sfc_main$1 } from "./LpButton-DSHioIfD.js";
-import { _ as _sfc_main$3 } from "./LpInput-DL6HEJdi.js";
+import { _ as _sfc_main$3 } from "./LpInput-CbI7z5fQ.js";
 const _hoisted_1 = { class: "flex min-w-0 flex-col gap-4" };
 const _hoisted_2 = { class: "sticky top-0 z-10 flex gap-2 border-b border-line bg-surface-overlay pb-3" };
 const _hoisted_3 = { class: "text-sm font-semibold" };

package/dist/chunks/{LpPasswordInput-B-zD6tUS.js → LpPasswordInput-Duc_3wPv.js}

@@ -2,8 +2,8 @@ import { defineComponent, useModel, ref, openBlock, createBlock, mergeProps, unr
 import { suppressPaletteDiscovery } from "../composables/usePaletteCommands.js";
 import { useFieldControl } from "../composables/useField.js";
 import { useLabels } from "../composables/useLpConfig.js";
-import { _ as _sfc_main$1 } from "./LpInput-DL6HEJdi.js";
-import { _ as _sfc_main$2 } from "./RevealToggle-CCPDE8Mv.js";
+import { _ as _sfc_main$1 } from "./LpInput-CbI7z5fQ.js";
+import { _ as _sfc_main$2 } from "./RevealToggle-D_iyrB8d.js";
 const __default__ = { inheritAttrs: false };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...__default__,