@leavepulse/ui 0.43.4 → 0.45.0

package/dist/chunks/{LpNumberFlow-amWYaeuA.js → LpNumberFlow-z4WPZcZu.js}

@@ -1,7 +1,7 @@
-import { defineComponent, ref, watch, onBeforeUnmount, computed, openBlock, createElementBlock, toDisplayString, createCommentVNode, createElementVNode, createVNode, TransitionGroup, withCtx, Fragment, renderList, normalizeClass, normalizeStyle, createTextVNode } from "vue";
+import { defineComponent, ref, watch, onBeforeUnmount, computed, openBlock, createElementBlock, createElementVNode, toDisplayString, createCommentVNode, createVNode, TransitionGroup, withCtx, Fragment, renderList, normalizeClass, normalizeStyle, createTextVNode } from "vue";
 import { prefersReducedMotion, easeOut } from "../composables/easing.js";
 import { useReveal } from "../composables/useReveal.js";
-import '../assets/LpNumberFlow-rZkwQwlU.css';const _hoisted_1 = ["aria-label"];
+import '../assets/LpNumberFlow-rZkwQwlU.css';const _hoisted_1 = { class: "sr-only" };
 const _hoisted_2 = {
   key: 0,
   "aria-hidden": "true"
@@ -62,6 +62,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       stop();
       const from = displayed.value;
       if (from === to) return;
+      if (!Number.isFinite(to) || !Number.isFinite(from)) {
+        displayed.value = to;
+        lastTarget = to;
+        settled.value = true;
+        padTo.value = 0;
+        return;
+      }
       if (prefersReducedMotion() || props.duration <= 0) {
         displayed.value = to;
         return;
@@ -101,7 +108,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     ];
     const scaleFor = (v) => {
       const abs = Math.abs(v);
-      const unit = UNITS.find((u) => abs >= u.limit);
+      let at = UNITS.findIndex((u) => abs >= u.limit);
+      if (at > 0 && Math.abs(Number((v / UNITS[at].limit).toFixed(1))) >= 1e3) at--;
+      if (at === -1 && abs >= 999.5) at = UNITS.length - 1;
+      const unit = UNITS[at];
       if (!unit) return { divisor: 1, suffix: "", decimals: 0 };
       const scaled = v / unit.limit;
       return {
@@ -110,15 +120,16 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         decimals: Number.isInteger(scaled) ? 0 : 1
       };
     };
-    const formatted = computed(() => {
-      const v = round(displayed.value);
+    const formatted = computed(() => formatAt(round(displayed.value), !settled.value));
+    function formatAt(v, padded) {
       if (props.format) return props.format(v);
+      if (!Number.isFinite(v)) return String(v);
       if (props.compact) {
         const { divisor, suffix } = scaleFor(v);
         const places = divisor === 1 ? 0 : 1;
         return `${(v / divisor).toFixed(places)}${suffix}`;
       }
-      const pad = settled.value ? 1 : Math.max(1, padTo.value);
+      const pad = padded ? Math.max(1, padTo.value) : 1;
       if (props.grouped)
         return v.toLocaleString(props.locale, {
           minimumFractionDigits: props.decimals,
@@ -133,7 +144,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       const int = dot === -1 ? body : body.slice(0, dot);
       const rest = dot === -1 ? "" : body.slice(dot);
       return `${neg ? "-" : ""}${int.padStart(pad, "0")}${rest}`;
-    });
+    }
     const cells = computed(() => {
       const chars = [...formatted.value];
       const dot = chars.indexOf(".");
@@ -170,16 +181,15 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       return digit;
     };
     const label = computed(
-      () => `${props.prefix ?? ""}${props.value}${props.suffix ?? ""}`
+      () => `${props.prefix ?? ""}${formatAt(props.value, false)}${props.suffix ?? ""}`
     );
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("span", {
         ref_key: "revealAnchor",
         ref: revealAnchor,
-        class: "lp-nf inline-flex items-baseline tabular-nums",
-        "aria-label": label.value,
-        role: "text"
+        class: "lp-nf inline-flex items-baseline tabular-nums"
       }, [
+        createElementVNode("span", _hoisted_1, toDisplayString(label.value), 1),
         __props.prefix ? (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(__props.prefix), 1)) : createCommentVNode("", true),
         createElementVNode("span", _hoisted_3, [
           createVNode(TransitionGroup, { name: "lp-nf-cell" }, {
@@ -212,7 +222,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           })
         ]),
         __props.suffix ? (openBlock(), createElementBlock("span", _hoisted_4, toDisplayString(__props.suffix), 1)) : createCommentVNode("", true)
-      ], 8, _hoisted_1);
+      ], 512);
     };
   }
 });

package/dist/chunks/{LpOtpInput-y2v-pmiN.js → LpOtpInput-CziPF3Oq.js}

@@ -1,6 +1,8 @@
-import { defineComponent, computed, openBlock, createBlock, unref, mergeProps, withCtx, createElementBlock, Fragment, renderList, normalizeClass } from "vue";
+import { defineComponent, ref, watch, computed, openBlock, createBlock, unref, mergeProps, withCtx, createElementBlock, Fragment, renderList, normalizeClass } from "vue";
 import { PinInputRoot, PinInputInput } from "reka-ui";
+import { useFieldControl } from "../composables/useField.js";
 import { useMergedAttrs } from "../composables/useMergedClass.js";
+import { splitCode, joinCells } from "../components/otp.js";
 const __default__ = { inheritAttrs: false };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...__default__,
@@ -18,12 +20,37 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   setup(__props, { emit: __emit }) {
     const props = __props;
     const emit = __emit;
+    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: () => (props.modelValue ?? "").split("").slice(0, props.length),
-      set: (arr) => emit("update:modelValue", arr.join(""))
+      get: () => local.value,
+      set: (arr) => {
+        local.value = arr;
+        emitted = joinCells(arr);
+        emit("update:modelValue", emitted);
+      }
     });
+    const field = useFieldControl(() => ({
+      wrapped: false,
+      invalid: props.invalid,
+      disabled: props.disabled
+    }));
     function onComplete(arr) {
-      emit("complete", arr.join(""));
+      emit("complete", joinCells(arr));
     }
     const cellSize = {
       sm: "size-9 text-base",
@@ -39,7 +66,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => cells.value = $event),
         type: __props.alphanumeric ? "text" : "number",
         mask: __props.mask,
-        disabled: __props.disabled,
+        disabled: unref(field).disabled,
         otp: "",
         class: unref(rootClass)
       }, unref(rest), { onComplete }), {
@@ -48,16 +75,18 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             return openBlock(), createBlock(unref(PinInputInput), {
               key: i,
               index: i - 1,
-              "aria-invalid": __props.invalid || void 0,
+              id: i === 1 ? unref(field).id : void 0,
+              "aria-invalid": unref(field).invalid || void 0,
+              "aria-describedby": unref(field).describedBy,
               class: normalizeClass([
                 cellSize[__props.size],
                 "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",
-                __props.invalid ? "border-danger focus:border-danger focus:ring-danger-soft" : "border-line"
+                unref(field).invalid ? "border-danger focus:border-danger focus:ring-danger-soft" : "border-line"
               ])
-            }, null, 8, ["index", "aria-invalid", "class"]);
+            }, null, 8, ["index", "id", "aria-invalid", "aria-describedby", "class"]);
           }), 128))
         ]),
         _: 1

package/dist/chunks/{LpPagination-5FxjmmB5.js → LpPagination-BcDlo3r_.js}

@@ -1,17 +1,19 @@
 import { defineComponent, computed, useId, openBlock, createElementBlock, mergeProps, unref, createElementVNode, normalizeClass, createVNode, Fragment, renderList, createBlock, createCommentVNode, toDisplayString } from "vue";
 import { Motion } from "motion-v";
 import { usePillTransition } from "../composables/usePillTransition.js";
-import { _ as _sfc_main$1 } from "./LpIcon-CCnX5_2j.js";
+import { _ as _sfc_main$1 } from "./LpIcon-DYtaid0K.js";
 import { useMergedAttrs } from "../composables/useMergedClass.js";
-const _hoisted_1 = ["disabled"];
-const _hoisted_2 = {
+import { useLabels } from "../composables/useLpConfig.js";
+const _hoisted_1 = ["aria-label"];
+const _hoisted_2 = ["disabled", "aria-label"];
+const _hoisted_3 = {
   key: 0,
   class: "flex size-(--size-control-sm) items-center justify-center text-sm text-muted select-none",
   "aria-hidden": "true"
 };
-const _hoisted_3 = ["disabled", "aria-current", "onClick"];
-const _hoisted_4 = { class: "relative z-10" };
-const _hoisted_5 = ["disabled"];
+const _hoisted_4 = ["disabled", "aria-current", "onClick"];
+const _hoisted_5 = { class: "relative z-10" };
+const _hoisted_6 = ["disabled", "aria-label"];
 const __default__ = { inheritAttrs: false };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...__default__,
@@ -22,18 +24,25 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     pageSize: { default: 10 },
     pageCount: {},
     siblings: { default: 1 },
-    disabled: { type: Boolean }
+    disabled: { type: Boolean },
+    labels: {}
   },
   emits: ["update:page", "change"],
   setup(__props, { emit: __emit }) {
     const props = __props;
+    const text = useLabels(
+      "pagination",
+      { nav: "Pagination", previous: "Previous page", next: "Next page" },
+      () => props.labels
+    );
     const emit = __emit;
     const count = computed(() => {
-      if (props.pageCount != null) return Math.max(1, props.pageCount);
-      if (props.total != null) return Math.max(1, Math.ceil(props.total / props.pageSize));
-      return 1;
+      const n = props.pageCount != null ? props.pageCount : props.total != null && props.pageSize > 0 ? Math.ceil(props.total / props.pageSize) : 1;
+      return Number.isFinite(n) ? Math.max(1, Math.floor(n)) : 1;
     });
-    const current = computed(() => Math.min(Math.max(1, props.page), count.value));
+    const current = computed(
+      () => Number.isFinite(props.page) ? Math.min(Math.max(1, Math.floor(props.page)), count.value) : 1
+    );
     const slots = computed(() => {
       const c = count.value;
       const cur = current.value;
@@ -74,24 +83,26 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       "flex items-center gap-1.5"
     );
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("nav", mergeProps({ class: unref(rootClass) }, unref(rest), { "aria-label": "Pagination" }), [
+      return openBlock(), createElementBlock("nav", mergeProps({ class: unref(rootClass) }, unref(rest), {
+        "aria-label": unref(text).nav
+      }), [
         createElementVNode("button", {
           type: "button",
           class: normalizeClass([navBase, navArrow]),
           disabled: __props.disabled || current.value === 1,
-          "aria-label": "Previous page",
+          "aria-label": unref(text).previous,
           onClick: _cache[0] || (_cache[0] = ($event) => go(current.value - 1))
         }, [
           createVNode(_sfc_main$1, {
             name: "lucide:chevron-left",
             size: 16
           })
-        ], 10, _hoisted_1),
+        ], 10, _hoisted_2),
         (openBlock(true), createElementBlock(Fragment, null, renderList(slots.value, (slot, i) => {
           return openBlock(), createElementBlock(Fragment, {
             key: `slot-${i}`
           }, [
-            slot.kind === "gap" ? (openBlock(), createElementBlock("span", _hoisted_2, "…")) : (openBlock(), createElementBlock("button", {
+            slot.kind === "gap" ? (openBlock(), createElementBlock("span", _hoisted_3, "…")) : (openBlock(), createElementBlock("button", {
               key: 1,
               type: "button",
               class: normalizeClass([
@@ -109,23 +120,23 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 transition: unref(pillTransition),
                 class: "absolute inset-0 z-0 rounded-control bg-brand"
               }, null, 8, ["transition"])) : createCommentVNode("", true),
-              createElementVNode("span", _hoisted_4, toDisplayString(slot.page), 1)
-            ], 10, _hoisted_3))
+              createElementVNode("span", _hoisted_5, toDisplayString(slot.page), 1)
+            ], 10, _hoisted_4))
           ], 64);
         }), 128)),
         createElementVNode("button", {
           type: "button",
           class: normalizeClass([navBase, navArrow]),
           disabled: __props.disabled || current.value === count.value,
-          "aria-label": "Next page",
+          "aria-label": unref(text).next,
           onClick: _cache[1] || (_cache[1] = ($event) => go(current.value + 1))
         }, [
           createVNode(_sfc_main$1, {
             name: "lucide:chevron-right",
             size: 16
           })
-        ], 10, _hoisted_5)
-      ], 16);
+        ], 10, _hoisted_6)
+      ], 16, _hoisted_1);
     };
   }
 });

package/dist/chunks/{LpPasswordInput--sjYCkLS.js → LpPasswordInput-eKzQhbQP.js}

@@ -1,6 +1,7 @@
-import { defineComponent, ref, openBlock, createBlock, createSlots, withCtx, createElementVNode, createVNode, renderSlot } from "vue";
-import { _ as _sfc_main$2 } from "./LpIcon-CCnX5_2j.js";
-import { _ as _sfc_main$1 } from "./LpInput-9EXWUM9B.js";
+import { defineComponent, ref, openBlock, createBlock, mergeProps, createSlots, withCtx, createElementVNode, unref, createVNode, renderSlot } from "vue";
+import { useLabels } from "../composables/useLpConfig.js";
+import { _ as _sfc_main$2 } from "./LpIcon-DYtaid0K.js";
+import { _ as _sfc_main$1 } from "./LpInput-D-YGQbEv.js";
 const _hoisted_1 = ["aria-label"];
 const __default__ = { inheritAttrs: false };
 const _sfc_main = /* @__PURE__ */ defineComponent({
@@ -18,6 +19,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   },
   emits: ["update:modelValue"],
   setup(__props, { expose: __expose }) {
+    const text = useLabels("passwordInput", { show: "Show password", hide: "Hide password" });
     const visible = ref(false);
     const inner = ref(null);
     __expose({
@@ -26,9 +28,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       select: () => inner.value?.select()
     });
     return (_ctx, _cache) => {
-      return openBlock(), createBlock(_sfc_main$1, {
+      return openBlock(), createBlock(_sfc_main$1, mergeProps({
         ref_key: "inner",
-        ref: inner,
+        ref: inner
+      }, _ctx.$attrs, {
         "model-value": __props.modelValue,
         type: visible.value ? "text" : "password",
         placeholder: __props.placeholder,
@@ -39,12 +42,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         error: __props.error,
         required: __props.required,
         "onUpdate:modelValue": _cache[1] || (_cache[1] = (v) => _ctx.$emit("update:modelValue", v))
-      }, createSlots({
+      }), createSlots({
         trailing: withCtx(() => [
           createElementVNode("button", {
             type: "button",
             class: "group rounded-md p-1 text-muted outline-none transition-colors duration-[var(--duration-fast)] hover:text-ink focus-visible:text-ink",
-            "aria-label": visible.value ? "Hide password" : "Show password",
+            "aria-label": visible.value ? unref(text).hide : unref(text).show,
             onClick: _cache[0] || (_cache[0] = ($event) => visible.value = !visible.value)
           }, [
             createVNode(_sfc_main$2, {
@@ -63,7 +66,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           ]),
           key: "0"
         } : void 0
-      ]), 1032, ["model-value", "type", "placeholder", "invalid", "disabled", "label", "hint", "error", "required"]);
+      ]), 1040, ["model-value", "type", "placeholder", "invalid", "disabled", "label", "hint", "error", "required"]);
     };
   }
 });