@leavepulse/ui 0.68.0 → 0.70.0

package/dist/chunks/LpDateRangePicker-C_k65vGR.js

@@ -0,0 +1,126 @@
+import { defineComponent, ref, computed, useAttrs, openBlock, createBlock, mergeProps, unref, withCtx, createVNode } from "vue";
+import { useFieldControl } from "../composables/useField.js";
+import { useLocale } from "../composables/useLocale.js";
+import { useLabels } from "../composables/useLpConfig.js";
+import { useMediaQuery } from "../composables/useMediaQuery.js";
+import { normalizeRange, formatRange, defaultRangePresets, sameRange, allowedRange } from "../components/dateRange.js";
+import { _ as _sfc_main$1 } from "./PickerField-CHRS1h7K.js";
+import { _ as _sfc_main$2 } from "./LpRangeCalendar-c5qj7YcC.js";
+const __default__ = { inheritAttrs: false };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  __name: "LpDateRangePicker",
+  props: {
+    modelValue: {},
+    placeholder: {},
+    min: {},
+    max: {},
+    isDisabled: {},
+    isDateUnavailable: {},
+    maximumDays: {},
+    presets: {},
+    clearable: { type: Boolean },
+    disabled: { type: Boolean },
+    invalid: { type: Boolean },
+    size: { default: "md" },
+    locale: {},
+    format: {},
+    labels: {}
+  },
+  emits: ["update:modelValue"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const text = useLabels(
+      "dateRangePicker",
+      {
+        placeholder: "Pick a date range",
+        clear: "Clear",
+        presets: "Presets",
+        today: "Today",
+        last7: "Last 7 days",
+        last30: "Last 30 days",
+        thisMonth: "This month",
+        lastMonth: "Last month"
+      },
+      () => props.labels
+    );
+    const open = ref(false);
+    const value = computed(() => normalizeRange(props.modelValue));
+    const locale = useLocale(() => props.locale);
+    const display = computed(() => value.value ? formatRange(value.value, locale.value, props.format) : "");
+    const presetList = computed(() => {
+      return props.presets ?? defaultRangePresets(text.value);
+    });
+    function pick(range, change) {
+      emit("update:modelValue", range);
+      if (!change) open.value = false;
+    }
+    const rules = computed(() => ({
+      min: props.min,
+      max: props.max,
+      isDisabled: props.isDisabled,
+      isDateUnavailable: props.isDateUnavailable,
+      maximumDays: props.maximumDays
+    }));
+    function pickPreset(preset) {
+      const range = allowedRange(preset.range(), rules.value);
+      if (range) pick(range);
+    }
+    function presetFits(preset) {
+      return !!allowedRange(preset.range(), rules.value);
+    }
+    const wide = useMediaQuery("(min-width: 640px)");
+    const attrs = useAttrs();
+    const field = useFieldControl(() => ({
+      wrapped: false,
+      id: typeof attrs.id === "string" ? attrs.id : void 0,
+      invalid: props.invalid,
+      disabled: props.disabled
+    }));
+    const showClear = computed(() => props.clearable && !!value.value && !field.value.disabled);
+    const presetOptions = computed(() => presetList.value.map((preset) => ({
+      label: preset.label,
+      disabled: !presetFits(preset),
+      selected: sameRange(value.value, preset.range()),
+      select: () => pickPreset(preset)
+    })));
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(_sfc_main$1, mergeProps(unref(attrs), {
+        open: open.value,
+        "onUpdate:open": _cache[0] || (_cache[0] = ($event) => open.value = $event),
+        field: unref(field),
+        display: display.value,
+        placeholder: __props.placeholder || unref(text).placeholder,
+        icon: "lucide:calendar-range",
+        size: __props.size,
+        clearable: showClear.value,
+        "clear-label": unref(text).clear,
+        "presets-label": unref(text).presets,
+        presets: presetOptions.value,
+        "presets-class": "sm:w-40",
+        onClear: _cache[1] || (_cache[1] = ($event) => emit("update:modelValue", void 0))
+      }), {
+        default: withCtx(() => [
+          createVNode(_sfc_main$2, {
+            "model-value": value.value,
+            min: __props.min,
+            max: __props.max,
+            "is-disabled": __props.isDisabled,
+            "is-date-unavailable": __props.isDateUnavailable,
+            "maximum-days": __props.maximumDays,
+            months: unref(wide) ? 2 : 1,
+            locale: unref(locale),
+            labels: __props.labels,
+            class: "border-0 bg-transparent",
+            "onUpdate:modelValue": pick
+          }, null, 8, ["model-value", "min", "max", "is-disabled", "is-date-unavailable", "maximum-days", "months", "locale", "labels"])
+        ]),
+        _: 1
+      }, 16, ["open", "field", "display", "placeholder", "size", "clearable", "clear-label", "presets-label", "presets"]);
+    };
+  }
+});
+export {
+  _sfc_main as _
+};

package/dist/chunks/{LpDisclosure-6AplYBub.js → LpDisclosure-DOarzlAG.js}

@@ -1,9 +1,9 @@
-import { defineComponent, getCurrentInstance, computed, ref, openBlock, createBlock, unref, mergeProps, withCtx, createVNode, createCommentVNode, createElementVNode, renderSlot, createTextVNode, toDisplayString, nextTick } from "vue";
-import { CollapsibleRoot, CollapsibleTrigger, CollapsibleContent } from "reka-ui";
-import { _ as _sfc_main$1 } from "./LpIcon-6tSrZ3Zy.js";
+import { defineComponent, getCurrentInstance, computed, ref, useId, openBlock, createBlock, unref, mergeProps, withCtx, createVNode, createCommentVNode, createElementVNode, renderSlot, createTextVNode, toDisplayString, normalizeClass, nextTick } from "vue";
+import { CollapsibleRoot, CollapsibleTrigger } from "reka-ui";
+import { _ as _sfc_main$2 } from "./LpCollapse-CWS9M_lm.js";
+import { _ as _sfc_main$1 } from "./LpIcon-HJP5xMz4.js";
 import { useMergedAttrs } from "../composables/useMergedClass.js";
 const _hoisted_1 = { class: "min-w-0 flex-1 text-left" };
-const _hoisted_2 = { class: "grid gap-2.5 px-3 pt-1 pb-3 group-data-[state=open]/content:animate-[disclosure-body-in_300ms_var(--ease-emphasized)] motion-reduce:animate-none" };
 const __default__ = { inheritAttrs: false };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...__default__,
@@ -26,6 +26,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     });
     const rootOpen = computed(() => controlled.value ? props.open : void 0);
     const root = ref(null);
+    const bodyId = useId();
+    const drift = ref(!(controlled.value ? props.open : props.defaultOpen));
     function onToggle(value) {
       emit("update:open", value);
       if (value && props.scrollIntoView) {
@@ -46,8 +48,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         "default-open": __props.defaultOpen,
         class: unref(rootClass)
       }, unref(rest), { "onUpdate:open": onToggle }), {
-        default: withCtx(() => [
-          createVNode(unref(CollapsibleTrigger), { class: "group flex w-full items-center gap-2 px-3 py-2.5 text-sm font-semibold text-ink outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring" }, {
+        default: withCtx(({ open: isOpen }) => [
+          createVNode(unref(CollapsibleTrigger), {
+            "aria-controls": unref(bodyId),
+            class: "group flex w-full items-center gap-2 px-3 py-2.5 text-sm font-semibold text-ink outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring"
+          }, {
             default: withCtx(() => [
               __props.icon ? (openBlock(), createBlock(_sfc_main$1, {
                 key: 0,
@@ -67,15 +72,21 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               })
             ]),
             _: 3
-          }),
-          createVNode(unref(CollapsibleContent), { class: "group/content overflow-hidden data-[state=open]:animate-[collapsible-down_260ms_var(--ease-emphasized)] data-[state=closed]:animate-[collapsible-up_200ms_var(--ease-emphasized)]" }, {
+          }, 8, ["aria-controls"]),
+          createVNode(_sfc_main$2, {
+            id: unref(bodyId),
+            open: isOpen,
+            onClosed: _cache[0] || (_cache[0] = ($event) => drift.value = true)
+          }, {
             default: withCtx(() => [
-              createElementVNode("div", _hoisted_2, [
+              createElementVNode("div", {
+                class: normalizeClass(["grid gap-2.5 px-3 pt-1 pb-3 motion-reduce:animate-none", drift.value ? "animate-[rise-in_300ms_var(--ease-emphasized)] [--rise:-4px]" : ""])
+              }, [
                 renderSlot(_ctx.$slots, "default")
-              ])
+              ], 2)
             ]),
             _: 3
-          })
+          }, 8, ["id", "open"])
         ]),
         _: 3
       }, 16, ["open", "default-open", "class"]);

package/dist/chunks/{LpDrawer-Q4SOxM4s.js → LpDrawer-DGNKRsGq.js}

@@ -6,9 +6,10 @@ import { useCloseGuard } from "../composables/useCloseGuard.js";
 import { useGlass } from "../composables/useGlass.js";
 import { useLabels } from "../composables/useLpConfig.js";
 import { usePersisted } from "../composables/usePersisted.js";
-import { _ as _sfc_main$1 } from "./LpIcon-6tSrZ3Zy.js";
+import { _ as _sfc_main$1 } from "./LpIcon-HJP5xMz4.js";
 import { _ as _sfc_main$2 } from "./LpScrollArea-Hz3-JWUG.js";
 import { useModalLayer, anyModalOpen } from "../components/modalDepth.js";
+import { usePortalTarget, useOutsideGuard } from "../composables/useView.js";
 const _hoisted_1 = { class: "text-base font-semibold text-ink" };
 const _hoisted_2 = { class: "flex flex-col gap-1" };
 const _hoisted_3 = ["data-vaul-no-drag"];
@@ -314,6 +315,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         pointerEvents: "none"
       };
     });
+    const portalTo = usePortalTarget();
+    const guardOutside = useOutsideGuard();
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock(Fragment, null, [
         __props.edgeOpen && isHorizontal.value ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
@@ -355,7 +358,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           "onUpdate:open": _cache[1] || (_cache[1] = (v) => emit("update:open", v))
         }, {
           default: withCtx(() => [
-            createVNode(unref(DrawerPortal), null, {
+            createVNode(unref(DrawerPortal), { to: unref(portalTo) }, {
               default: withCtx(() => [
                 createVNode(unref(DrawerOverlay), {
                   style: normalizeStyle({ zIndex: unref(layer).scrim }),
@@ -363,6 +366,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   class: normalizeClass(["lp-scrim fixed inset-0 z-(--z-overlay) data-[state=open]:animate-[fade-in_150ms_ease] data-[state=closed]:animate-[fade-out_130ms_ease]", { "lp-scrim--light": unref(frosted), "lp-scrim--nested": unref(layer).nested, "lp-scrim--covered": unref(layer).covered }])
                 }, null, 8, ["style", "class"]),
                 createVNode(unref(DrawerContent), mergeProps({
+                  onInteractOutside: unref(guardOutside),
+                  onEscapeKeyDown: unref(guardOutside),
                   ref_key: "contentRef",
                   ref: contentRef
                 }, __props.description ? {} : { "aria-describedby": void 0 }, {
@@ -454,10 +459,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                     ])) : createCommentVNode("", true)
                   ]),
                   _: 3
-                }, 16, ["class", "style", "data-vaul-animate"])
+                }, 16, ["onInteractOutside", "onEscapeKeyDown", "class", "style", "data-vaul-animate"])
               ]),
               _: 3
-            })
+            }, 8, ["to"])
           ]),
           _: 3
         }, 8, ["open", "direction", "dismissible", "snap-points", "handle-only", "should-scale-background", "close-threshold"])

package/dist/chunks/{LpDropdownMenu-DWTt0ooM.js → LpDropdownMenu-CRgrhdAH.js}

@@ -2,9 +2,10 @@ import { defineComponent, openBlock, createBlock, unref, withCtx, createVNode, r
 import { hints } from "../composables/useHints.js";
 import { HINT_SIGNALS } from "../composables/useHintSystem.js";
 import { DropdownMenuRoot, DropdownMenuTrigger, DropdownMenuPortal, DropdownMenuContent } from "reka-ui";
-import { _ as _sfc_main$2 } from "./ContextMenuItems-B7XFHksm.js";
+import { _ as _sfc_main$2 } from "./ContextMenuItems-B5uE8Znw.js";
 import { POPOVER_PANEL } from "../components/dropdown.js";
-import { _ as _sfc_main$1 } from "./MenuTitle-obgek0B7.js";
+import { _ as _sfc_main$1 } from "./MenuTitle-BjQZX8tQ.js";
+import { usePortalTarget, useOutsideGuard } from "../composables/useView.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "LpDropdownMenu",
   props: {
@@ -21,6 +22,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     function opened(open) {
       if (open && props.rightClickToo) hints.use(HINT_SIGNALS.menuButton);
     }
+    const portalTo = usePortalTarget();
+    const guardOutside = useOutsideGuard();
     return (_ctx, _cache) => {
       return openBlock(), createBlock(unref(DropdownMenuRoot), { "onUpdate:open": opened }, {
         default: withCtx(() => [
@@ -30,9 +33,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             ]),
             _: 3
           }),
-          createVNode(unref(DropdownMenuPortal), null, {
+          createVNode(unref(DropdownMenuPortal), { to: unref(portalTo) }, {
             default: withCtx(() => [
               createVNode(unref(DropdownMenuContent), {
+                onInteractOutside: unref(guardOutside),
+                onEscapeKeyDown: unref(guardOutside),
                 "collision-padding": 8,
                 "side-offset": 6,
                 align: "end",
@@ -54,10 +59,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   }, null, 8, ["items"])
                 ]),
                 _: 1
-              }, 8, ["aria-label"])
+              }, 8, ["onInteractOutside", "onEscapeKeyDown", "aria-label"])
             ]),
             _: 1
-          })
+          }, 8, ["to"])
         ]),
         _: 3
       });

package/dist/chunks/LpEditable-DTqLt2lT.js

@@ -0,0 +1,236 @@
+import { defineComponent, ref, computed, watch, openBlock, createElementBlock, normalizeClass, unref, createVNode, withCtx, mergeProps, toDisplayString, createBlock, normalizeStyle, createCommentVNode, createElementVNode, resolveDynamicComponent, nextTick } from "vue";
+import { useFieldNotice } from "../composables/useFieldNotice.js";
+import { useLabels } from "../composables/useLpConfig.js";
+import { useMergedAttrs } from "../composables/useMergedClass.js";
+import { _ as _sfc_main$5 } from "./LpFieldNotice-CurbNuXI.js";
+import { _ as _sfc_main$4 } from "./LpIcon-HJP5xMz4.js";
+import { _ as _sfc_main$3 } from "./LpLoader-DjJEX8hL.js";
+import { _ as _sfc_main$2 } from "./LpRollingText-DB7upf-5.js";
+import { _ as _sfc_main$1 } from "./LpShift-DXNsauQZ.js";
+const _hoisted_1 = ["role", "tabindex", "aria-disabled", "aria-label", "aria-busy", "title"];
+const _hoisted_2 = {
+  key: 0,
+  class: "text-muted italic"
+};
+const _hoisted_3 = {
+  key: 1,
+  class: "inline-flex max-w-full items-baseline gap-1.5"
+};
+const _hoisted_4 = { class: "pointer-events-none absolute top-full left-0 h-0 w-[min(22rem,80vw)]" };
+const __default__ = { inheritAttrs: false };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  __name: "LpEditable",
+  props: {
+    modelValue: { default: "" },
+    label: {},
+    placeholder: {},
+    multiline: { type: Boolean },
+    save: {},
+    validate: {},
+    trim: { type: Boolean, default: true },
+    required: { type: Boolean },
+    maxlength: {},
+    disabled: { type: Boolean },
+    readonly: { type: Boolean },
+    size: { default: "md" },
+    labels: {}
+  },
+  emits: ["update:modelValue", "edit", "cancel", "saved", "error"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const text = useLabels(
+      "editable",
+      { edit: "Edit", empty: "Empty", saving: "Saving…", failed: "Couldn't save", required: "Can't be empty" },
+      () => props.labels
+    );
+    const editing = ref(false);
+    const draft = ref("");
+    const pending = ref(null);
+    const notice = useFieldNotice(4e3);
+    const shown = computed(() => pending.value ?? props.modelValue);
+    const interactive = computed(() => !props.disabled && !props.readonly);
+    const field = ref(null);
+    const idle = ref(null);
+    async function open(selectAll = true) {
+      if (!interactive.value || editing.value || pending.value !== null) return;
+      draft.value = props.modelValue;
+      editing.value = true;
+      emit("edit");
+      await nextTick();
+      field.value?.focus({ preventScroll: true });
+      if (selectAll) field.value?.select();
+    }
+    async function close(refocus) {
+      editing.value = false;
+      if (!refocus) return;
+      await nextTick();
+      idle.value?.focus({ preventScroll: true });
+    }
+    function cancel() {
+      notice.clear();
+      emit("cancel");
+      void close(true);
+    }
+    let committing = false;
+    async function commit(refocus) {
+      if (!editing.value || committing) return;
+      const value = props.trim ? draft.value.trim() : draft.value;
+      if (value === props.modelValue) {
+        notice.clear();
+        emit("cancel");
+        return close(refocus);
+      }
+      const problem = props.required && !value ? text.value.required : props.validate?.(value);
+      if (typeof problem === "string" && problem) {
+        notice.show(problem, { tone: "danger" });
+        return;
+      }
+      notice.clear();
+      committing = true;
+      pending.value = value;
+      await close(refocus);
+      try {
+        await props.save?.(value);
+        emit("update:modelValue", value);
+        emit("saved", value);
+      } catch (error) {
+        emit("error", error);
+        draft.value = value;
+        editing.value = true;
+        await nextTick();
+        const active = document.activeElement;
+        if (!active || active === document.body || active === idle.value) field.value?.focus({ preventScroll: true });
+        notice.show(error instanceof Error && error.message ? error.message : text.value.failed, { tone: "danger" });
+      } finally {
+        pending.value = null;
+        committing = false;
+      }
+    }
+    function onIdleKey(event) {
+      if (event.key === "Enter" || event.key === "F2" || event.key === " ") {
+        event.preventDefault();
+        void open();
+      }
+    }
+    function onFieldKey(event) {
+      if (event.key === "Escape") {
+        event.preventDefault();
+        event.stopPropagation();
+        cancel();
+      } else if (event.key === "Enter" && !event.isComposing && (!props.multiline || event.ctrlKey || event.metaKey)) {
+        event.preventDefault();
+        void commit(true);
+      }
+    }
+    let opened = "";
+    watch(editing, (on) => opened = on ? props.modelValue : "");
+    watch(
+      () => props.modelValue,
+      (next) => {
+        if (editing.value && draft.value === opened) draft.value = next;
+        opened = next;
+      }
+    );
+    const PAD = { sm: "px-1.5 py-0.5 text-xs", md: "px-2 py-1 text-sm", lg: "px-2.5 py-1.5 text-base" };
+    const spinnerSize = computed(() => props.size === "sm" ? 11 : 13);
+    const singleLineRoll = computed(() => !props.multiline && shown.value.length <= 60 && !!shown.value);
+    const { class: rootClass, attrs: rest } = useMergedAttrs(() => "relative inline-block max-w-full align-baseline");
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("span", {
+        class: normalizeClass(unref(rootClass))
+      }, [
+        createVNode(_sfc_main$1, {
+          axis: "both",
+          class: "max-w-full"
+        }, {
+          default: withCtx(() => [
+            !editing.value ? (openBlock(), createElementBlock("span", mergeProps({
+              key: 0,
+              ref_key: "idle",
+              ref: idle
+            }, unref(rest), {
+              role: interactive.value ? "button" : void 0,
+              tabindex: interactive.value ? 0 : void 0,
+              "aria-disabled": __props.disabled || void 0,
+              "aria-label": interactive.value ? `${unref(text).edit} ${__props.label ?? ""}: ${shown.value || __props.placeholder || unref(text).empty}`.replace(" :", ":") : void 0,
+              "aria-busy": pending.value !== null || void 0,
+              title: pending.value !== null ? unref(text).saving : void 0,
+              class: ["group/edit relative inline-flex max-w-full items-baseline gap-1.5 rounded-control border border-transparent outline-none transition-[background-color,border-color,opacity] duration-(--duration-fast)", [
+                PAD[__props.size],
+                interactive.value ? "cursor-text hover:border-line hover:bg-ink/[0.04] focus-visible:ring-2 focus-visible:ring-ring" : "",
+                __props.disabled ? "cursor-not-allowed opacity-55" : "",
+                pending.value !== null ? "opacity-70" : "",
+                __props.multiline ? "whitespace-pre-wrap break-words" : "whitespace-nowrap"
+              ]],
+              onClick: _cache[0] || (_cache[0] = ($event) => open()),
+              onKeydown: onIdleKey
+            }), [
+              !shown.value ? (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(__props.placeholder ?? unref(text).empty), 1)) : singleLineRoll.value ? (openBlock(), createBlock(_sfc_main$2, {
+                key: 1,
+                value: shown.value,
+                align: "start",
+                class: "min-w-0"
+              }, null, 8, ["value"])) : (openBlock(), createElementBlock("span", {
+                key: 2,
+                class: normalizeClass(["min-w-0", __props.multiline ? "" : "truncate"])
+              }, toDisplayString(shown.value), 3)),
+              pending.value !== null ? (openBlock(), createBlock(_sfc_main$3, {
+                key: 3,
+                size: "inline",
+                delay: 0,
+                "aria-hidden": "true",
+                class: "shrink-0 self-center text-muted",
+                style: normalizeStyle({ fontSize: `${spinnerSize.value}px` })
+              }, null, 8, ["style"])) : interactive.value ? (openBlock(), createBlock(_sfc_main$4, {
+                key: 4,
+                name: "lucide:pencil",
+                size: spinnerSize.value,
+                class: "shrink-0 self-center text-muted opacity-0 transition-opacity duration-(--duration-fast) group-hover/edit:opacity-100 group-focus-visible/edit:opacity-100 [@media(hover:none)]:opacity-60"
+              }, null, 8, ["size"])) : createCommentVNode("", true)
+            ], 16, _hoisted_1)) : (openBlock(), createElementBlock("span", _hoisted_3, [
+              createElementVNode("span", {
+                class: normalizeClass(["relative inline-grid max-w-full min-w-0 rounded-control border bg-surface-soft focus-within:ring-2 focus-within:ring-ring", unref(notice).tone.value === "danger" && unref(notice).message.value ? "border-danger" : "border-brand"])
+              }, [
+                createElementVNode("span", {
+                  "aria-hidden": "true",
+                  class: normalizeClass(["invisible col-start-1 row-start-1 min-w-[4ch]", [PAD[__props.size], __props.multiline ? "whitespace-pre-wrap break-words" : "whitespace-pre"]])
+                }, toDisplayString((draft.value || __props.placeholder || " ") + (__props.multiline ? "\n" : " ")), 3),
+                (openBlock(), createBlock(resolveDynamicComponent(__props.multiline ? "textarea" : "input"), {
+                  ref_key: "field",
+                  ref: field,
+                  value: draft.value,
+                  size: __props.multiline ? void 0 : 1,
+                  cols: __props.multiline ? 1 : void 0,
+                  "aria-label": __props.label,
+                  "aria-invalid": unref(notice).tone.value === "danger" && !!unref(notice).message.value || void 0,
+                  placeholder: __props.placeholder,
+                  maxlength: __props.maxlength,
+                  rows: __props.multiline ? 1 : void 0,
+                  class: normalizeClass(["col-start-1 row-start-1 w-full min-w-0 resize-none overflow-hidden bg-transparent text-ink outline-none placeholder:text-muted", PAD[__props.size]]),
+                  onInput: _cache[1] || (_cache[1] = ($event) => draft.value = $event.target.value),
+                  onKeydown: onFieldKey,
+                  onBlur: _cache[2] || (_cache[2] = ($event) => commit(false))
+                }, null, 40, ["value", "size", "cols", "aria-label", "aria-invalid", "placeholder", "maxlength", "rows", "class"]))
+              ], 2),
+              interactive.value ? (openBlock(), createElementBlock("span", {
+                key: 0,
+                "aria-hidden": "true",
+                class: "shrink-0",
+                style: normalizeStyle({ width: `${spinnerSize.value}px` })
+              }, null, 4)) : createCommentVNode("", true)
+            ]))
+          ]),
+          _: 1
+        }),
+        createElementVNode("span", _hoisted_4, [
+          createVNode(_sfc_main$5, { notice: unref(notice) }, null, 8, ["notice"])
+        ])
+      ], 2);
+    };
+  }
+});
+export {
+  _sfc_main as _
+};

package/dist/chunks/{LpEmptyState-om1UnFjV.js → LpEmptyState-KTKipws2.js}

@@ -1,5 +1,5 @@
 import { defineComponent, openBlock, createElementBlock, mergeProps, unref, normalizeClass, createVNode, createCommentVNode, createElementVNode, toDisplayString, renderSlot } from "vue";
-import { _ as _sfc_main$1 } from "./LpIcon-6tSrZ3Zy.js";
+import { _ as _sfc_main$1 } from "./LpIcon-HJP5xMz4.js";
 import { useMergedAttrs } from "../composables/useMergedClass.js";
 const _hoisted_1 = { class: "flex flex-col gap-1" };
 const _hoisted_2 = {

package/dist/chunks/{LpFieldNotice-CHuDeLjc.js → LpFieldNotice-CurbNuXI.js}

@@ -1,6 +1,6 @@
 import { defineComponent, ref, watch, openBlock, createBlock, Transition, withCtx, createElementBlock, normalizeClass, createVNode, createElementVNode, toDisplayString, createCommentVNode } from "vue";
 import { prefersReducedMotion } from "../composables/easing.js";
-import { _ as _sfc_main$1 } from "./LpIcon-6tSrZ3Zy.js";
+import { _ as _sfc_main$1 } from "./LpIcon-HJP5xMz4.js";
 const _hoisted_1 = ["id"];
 const _hoisted_2 = { class: "truncate" };
 const _sfc_main = /* @__PURE__ */ defineComponent({

package/dist/chunks/{LpFileTree-CW24YsVX.js → LpFileTree-DMISXVHC.js}

@@ -1,7 +1,8 @@
 import { defineComponent, ref, watch, computed, openBlock, createElementBlock, mergeProps, unref, Fragment, renderList, createBlock, normalizeStyle, createVNode, withCtx, createElementVNode, renderSlot, normalizeProps, guardReactiveProps, createTextVNode, toDisplayString, createCommentVNode } from "vue";
+import { useLocale } from "../composables/useLocale.js";
 import { computeStats, formatSize, sortNodes, subtreeIds, ancestorIds } from "../components/fileTree.js";
-import { _ as _sfc_main$2 } from "./LpEmptyState-om1UnFjV.js";
-import { _ as _sfc_main$4 } from "./LpFileTreeNode-BXhTHaKW.js";
+import { _ as _sfc_main$2 } from "./LpEmptyState-KTKipws2.js";
+import { _ as _sfc_main$4 } from "./LpFileTreeNode-CPXB_Yy3.js";
 import { _ as _sfc_main$3 } from "./LpScrollArea-Hz3-JWUG.js";
 import { _ as _sfc_main$1 } from "./LpSkeleton-BB6XIV-w.js";
 import { usePersisted } from "../composables/usePersisted.js";
@@ -92,6 +93,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     });
     const byId = computed(() => index.value.byId);
     const stats = computed(() => computeStats(props.nodes, checkedIds.value));
+    const locale = useLocale();
     const summary = computed(() => {
       let files = 0;
       let dirs = 0;
@@ -132,7 +134,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         files,
         dirs,
         bytes: sized ? bytes : void 0,
-        sizeLabel: sized ? formatSize(bytes) : "—"
+        sizeLabel: sized ? formatSize(bytes, locale.value) : "—"
       };
     });
     watch(summary, (value) => emit("summary", value), { immediate: true });