@leavepulse/ui 0.43.4 → 0.45.0

package/dist/chunks/{LpCodeBlock-Bo0B4TFR.js → LpCodeBlock-ca7ANFyW.js}

@@ -1,7 +1,8 @@
-import { defineComponent, computed, reactive, watch, openBlock, createElementBlock, mergeProps, unref, toDisplayString, createCommentVNode, createElementVNode, createVNode, normalizeClass, normalizeStyle, Fragment, renderList } from "vue";
+import { defineComponent, computed, reactive, watch, ref, openBlock, createElementBlock, mergeProps, unref, toDisplayString, createCommentVNode, createElementVNode, createVNode, normalizeClass, normalizeStyle, Fragment, renderList } from "vue";
 import { useClipboard } from "../composables/useClipboard.js";
-import { tokenizeLine } from "../components/codeHighlight.js";
-import { _ as _sfc_main$1 } from "./LpIcon-CCnX5_2j.js";
+import { tokenizeLines } from "../components/codeHighlight.js";
+import { useLabels } from "../composables/useLpConfig.js";
+import { _ as _sfc_main$1 } from "./LpIcon-DYtaid0K.js";
 import { useMergedAttrs } from "../composables/useMergedClass.js";
 const _hoisted_1 = {
   key: 0,
@@ -50,12 +51,27 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     copyable: { type: Boolean, default: true },
     title: {},
     height: {},
-    foldImports: { type: Boolean, default: false }
+    foldImports: { type: Boolean, default: false },
+    labels: {}
   },
   emits: ["update:modelValue", "update:locked"],
   setup(__props, { emit: __emit }) {
     const props = __props;
     const emit = __emit;
+    const text = useLabels(
+      "codeBlock",
+      {
+        unlock: "Unlock to edit",
+        lock: "Lock (read-only)",
+        copy: "Copy code",
+        copied: "Copied",
+        imports: "imports",
+        details: "details",
+        /** `{n}` is replaced by the count. */
+        lines: "({n} lines)"
+      },
+      () => props.labels
+    );
     const code = computed(() => props.modelValue ?? "");
     const rawLines = computed(() => code.value.replace(/\n$/, "").split("\n"));
     const REGION_START = /^\s*(?:\/\/|#|--)\s*#region\b\s*(.*?)\s*$/;
@@ -85,7 +101,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           flushPlain();
           const lines = [];
           for (let k = start; k < realEnd; k++) lines.push({ n: k + 1, text: src[k] });
-          out.push({ kind: "fold", id: foldId++, label: "imports", defaultOpen: false, lines });
+          out.push({ kind: "fold", id: foldId++, label: text.value.imports, defaultOpen: false, lines });
           i = realEnd;
         }
       }
@@ -96,7 +112,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           flushPlain();
           const rest2 = startMatch[1] ?? "";
           const defaultOpen = /\bopen\b/.test(rest2);
-          const label = rest2.replace(/\bopen\b/, "").trim() || "details";
+          const label = rest2.replace(/\bopen\b/, "").trim() || text.value.details;
           const lines = [];
           i++;
           for (; i < src.length; i++) {
@@ -112,6 +128,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       return out;
     });
     const hasFolds = computed(() => segments.value.some((s) => s.kind === "fold"));
+    const editing = computed(() => !props.locked && !hasFolds.value);
     const openState = reactive({});
     watch(
       segments,
@@ -124,8 +141,16 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     function toggleFold(id) {
       openState[id] = !openState[id];
     }
-    function tokens(text) {
-      return tokenizeLine(text, props.lang);
+    const highlighted = computed(() => tokenizeLines(rawLines.value, props.lang));
+    function tokens(n) {
+      return highlighted.value[n - 1] ?? [];
+    }
+    const preEl = ref(null);
+    function syncScroll(e) {
+      const area = e.target;
+      if (!preEl.value) return;
+      preEl.value.scrollLeft = area.scrollLeft;
+      preEl.value.scrollTop = area.scrollTop;
     }
     const copyText = computed(
       () => segments.value.flatMap((s) => s.lines.map((l) => l.text)).join("\n")
@@ -154,7 +179,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               key: 0,
               type: "button",
               class: "group/lock flex items-center gap-1 rounded px-1.5 py-1 outline-none transition-colors duration-[var(--duration-fast)] hover:text-ink focus-visible:ring-2 focus-visible:ring-ring",
-              "aria-label": __props.locked ? "Unlock to edit" : "Lock (read-only)",
+              "aria-label": __props.locked ? unref(text).unlock : unref(text).lock,
               onClick: toggleLock
             }, [
               createVNode(_sfc_main$1, {
@@ -167,7 +192,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               key: 1,
               type: "button",
               class: "group/copy flex items-center gap-1 rounded px-1.5 py-1 outline-none transition-colors duration-[var(--duration-fast)] hover:text-ink focus-visible:ring-2 focus-visible:ring-ring",
-              "aria-label": unref(copied) ? "Copied" : "Copy code",
+              "aria-label": unref(copied) ? unref(text).copied : unref(text).copy,
               onClick: copy
             }, [
               createVNode(_sfc_main$1, {
@@ -179,18 +204,25 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           ])
         ])) : createCommentVNode("", true),
         createElementVNode("div", {
-          class: normalizeClass(["lp-scrollbar-none relative", __props.height ? "overflow-auto" : ""]),
+          class: normalizeClass(["lp-scrollbar-none relative", __props.height ? editing.value ? "overflow-hidden" : "overflow-auto" : ""]),
           style: normalizeStyle(__props.height ? { height: __props.height } : void 0)
         }, [
           !__props.locked && !hasFolds.value ? (openBlock(), createElementBlock("textarea", {
             key: 0,
             value: code.value,
             spellcheck: "false",
-            class: normalizeClass(["lp-scrollbar-none absolute inset-0 size-full resize-none overflow-auto whitespace-pre bg-transparent p-3 leading-relaxed text-transparent caret-brand outline-none", [__props.wrap ? "whitespace-pre-wrap break-words" : "whitespace-pre", __props.lineNumbers ? "pl-12" : ""]]),
-            onInput
+            class: normalizeClass(["lp-scrollbar-none absolute inset-0 size-full resize-none overflow-auto whitespace-pre bg-transparent p-3 leading-relaxed text-transparent caret-brand outline-none", [__props.wrap ? "whitespace-pre-wrap break-words" : "whitespace-pre", __props.lineNumbers ? "pl-13" : ""]]),
+            onInput,
+            onScroll: syncScroll
           }, null, 42, _hoisted_7)) : createCommentVNode("", true),
           createElementVNode("pre", {
-            class: normalizeClass(["lp-scrollbar-none m-0 overflow-auto p-3 leading-relaxed", [__props.wrap ? "whitespace-pre-wrap break-words" : "whitespace-pre", !__props.locked && !hasFolds.value ? "pointer-events-none" : ""]])
+            ref_key: "preEl",
+            ref: preEl,
+            class: normalizeClass(["lp-scrollbar-none m-0 overflow-auto p-3 leading-relaxed", [
+              __props.wrap ? "whitespace-pre-wrap break-words" : "whitespace-pre",
+              editing.value ? "pointer-events-none" : "",
+              editing.value && __props.height ? "h-full overflow-hidden" : ""
+            ]])
           }, [
             createElementVNode("code", _hoisted_8, [
               (openBlock(true), createElementBlock(Fragment, null, renderList(segments.value, (seg, s) => {
@@ -201,7 +233,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                       class: "block min-h-[1.4em]"
                     }, [
                       __props.lineNumbers ? (openBlock(), createElementBlock("span", _hoisted_9, toDisplayString(ln.n), 1)) : createCommentVNode("", true),
-                      (openBlock(true), createElementBlock(Fragment, null, renderList(tokens(ln.text), (tok, j) => {
+                      (openBlock(true), createElementBlock(Fragment, null, renderList(tokens(ln.n), (tok, j) => {
                         return openBlock(), createElementBlock("span", {
                           key: j,
                           class: normalizeClass(tok.cls)
@@ -221,7 +253,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                         class: "shrink-0"
                       }, null, 8, ["name"]),
                       createElementVNode("span", _hoisted_11, toDisplayString(openState[seg.id] ? seg.label : seg.label + " …"), 1),
-                      !openState[seg.id] ? (openBlock(), createElementBlock("span", _hoisted_12, "(" + toDisplayString(seg.lines.length) + " lines)", 1)) : createCommentVNode("", true)
+                      !openState[seg.id] ? (openBlock(), createElementBlock("span", _hoisted_12, toDisplayString(unref(text).lines.replace("{n}", String(seg.lines.length))), 1)) : createCommentVNode("", true)
                     ], 8, _hoisted_10),
                     openState[seg.id] ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(seg.lines, (ln) => {
                       return openBlock(), createElementBlock("span", {
@@ -229,7 +261,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                         class: "block min-h-[1.4em]"
                       }, [
                         __props.lineNumbers ? (openBlock(), createElementBlock("span", _hoisted_13, toDisplayString(ln.n), 1)) : createCommentVNode("", true),
-                        (openBlock(true), createElementBlock(Fragment, null, renderList(tokens(ln.text), (tok, j) => {
+                        (openBlock(true), createElementBlock(Fragment, null, renderList(tokens(ln.n), (tok, j) => {
                           return openBlock(), createElementBlock("span", {
                             key: j,
                             class: normalizeClass(tok.cls)

package/dist/chunks/{LpColorPicker-BlXea7LM.js → LpColorPicker-zz4VGkG4.js}

@@ -1,14 +1,17 @@
-import { defineComponent, computed, ref, watch, openBlock, createBlock, unref, withCtx, createVNode, createElementVNode, normalizeClass, normalizeStyle, toDisplayString, createElementBlock, createCommentVNode, Fragment, renderList, renderSlot } from "vue";
+import { defineComponent, computed, ref, watch, openBlock, createBlock, unref, withCtx, createVNode, createElementVNode, normalizeClass, normalizeStyle, toDisplayString, createElementBlock, createCommentVNode, withDirectives, vShow, withKeys, Fragment, renderList, renderSlot, nextTick } from "vue";
 import { PopoverRoot, PopoverAnchor, PopoverTrigger, PopoverPortal, PopoverContent } from "reka-ui";
+import { prefersReducedMotion } from "../composables/easing.js";
+import { useFieldControl } from "../composables/useField.js";
 import { DEFAULT_SWATCHES, formatColor, opaqueCss, parseColor, rgbToHsv, isLight, clampHsv } from "../components/color.js";
 import { useClipboard } from "../composables/useClipboard.js";
 import { POPOVER_PANEL } from "../components/dropdown.js";
-import { _ as _sfc_main$1 } from "./LpContextMenu-CwW1QXe_.js";
-import { _ as _sfc_main$2 } from "./LpIcon-CCnX5_2j.js";
-const _hoisted_1 = ["disabled", "aria-label"];
+import { _ as _sfc_main$1 } from "./LpContextMenu-BqkAYa9X.js";
+import { _ as _sfc_main$2 } from "./LpIcon-DYtaid0K.js";
+import { _ as _sfc_main$3 } from "./LpRollingText-DB7upf-5.js";
+const _hoisted_1 = ["id", "disabled", "aria-label", "aria-invalid", "aria-describedby"];
 const _hoisted_2 = { class: "min-w-0 flex-1 truncate font-mono text-xs text-muted-strong" };
 const _hoisted_3 = { class: "flex flex-col gap-3" };
-const _hoisted_4 = ["tabindex", "aria-label", "aria-valuetext"];
+const _hoisted_4 = ["tabindex", "aria-label", "aria-valuenow", "aria-valuetext"];
 const _hoisted_5 = ["aria-label", "aria-valuenow", "tabindex"];
 const _hoisted_6 = ["aria-label", "aria-valuenow", "tabindex"];
 const _hoisted_7 = {
@@ -16,13 +19,15 @@ const _hoisted_7 = {
   "data-lp-ring-owner": "",
   class: "flex h-(--size-control-sm) items-center gap-2 overflow-hidden rounded-control border border-line bg-surface-soft px-2 transition-colors duration-[var(--duration-fast)] focus-within:border-brand focus-within:ring-2 focus-within:ring-ring"
 };
-const _hoisted_8 = ["value", "disabled", "aria-label"];
-const _hoisted_9 = {
+const _hoisted_8 = { class: "relative flex min-w-0 flex-1 items-center" };
+const _hoisted_9 = ["value", "disabled", "aria-label"];
+const _hoisted_10 = {
   key: 0,
   class: "text-[11px] font-medium uppercase tracking-wide text-muted"
 };
-const _hoisted_10 = ["disabled", "aria-label", "aria-pressed", "onClick"];
+const _hoisted_11 = ["disabled", "aria-label", "aria-pressed", "onClick"];
 const CHECKERBOARD = "repeating-conic-gradient(var(--color-line-strong) 0% 25%, transparent 0% 50%) 0 0 / 12px 12px";
+const ROLL_MS = 320;
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "LpColorPicker",
   props: {
@@ -123,7 +128,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       el.addEventListener("pointercancel", up);
     }
     const onFieldPointer = (e) => trackPointer(e, (x, y) => set({ s: x, v: 1 - y }));
-    const onHuePointer = (e) => trackPointer(e, (x) => set({ h: x * 360 }));
+    const onHuePointer = (e) => trackPointer(e, (x) => set({ h: Math.min(x * 360, 359.9) }));
     const onAlphaPointer = (e) => trackPointer(e, (x) => set({ a: x }));
     function step(e, axis) {
       const big = e.shiftKey;
@@ -148,6 +153,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       set({ s: hsv.value.s + dx / 100, v: hsv.value.v + dy / 100 }, true);
     }
     const typed = ref(null);
+    let typedChange = false;
     const inputValue = computed(() => typed.value ?? current.value);
     function onInput(e) {
       const value = e.target.value;
@@ -157,10 +163,17 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       const next = rgbToHsv(rgb);
       if (next.s === 0) next.h = hsv.value.h;
       if (next.v === 0) next.s = hsv.value.s;
-      set(props.alpha ? next : { ...next, a: 1 }, true);
+      set(props.alpha ? next : { ...next, a: 1 });
+      typedChange = true;
+    }
+    function commitTyped() {
+      if (!typedChange) return;
+      typedChange = false;
+      emit("change", current.value);
     }
     function onInputBlur() {
       typed.value = null;
+      commitTyped();
     }
     function pickSwatch(value) {
       const rgb = parseColor(value);
@@ -223,8 +236,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       } catch {
       }
     }
+    let openedOn = "";
     watch(open, (isOpen, was) => {
-      if (was && !isOpen) remember(current.value);
+      if (isOpen) openedOn = current.value;
+      else if (was && current.value !== openedOn) remember(current.value);
     });
     const swatchRows = computed(
       () => [
@@ -264,9 +279,19 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       } catch {
       }
     }
+    const rollText = ref(current.value);
+    const rolling = ref(false);
+    let rollTimer;
     function setFormat(f) {
       if (activeFormat.value === f) return;
+      rollText.value = inputValue.value;
       activeFormat.value = f;
+      if (!prefersReducedMotion()) {
+        rolling.value = true;
+        void nextTick(() => rollText.value = current.value);
+        if (rollTimer) clearTimeout(rollTimer);
+        rollTimer = setTimeout(() => rolling.value = false, ROLL_MS + 40);
+      }
       typed.value = null;
       emit("update:modelValue", current.value);
       emit("change", current.value);
@@ -294,6 +319,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       ];
       return own.length ? [...builtin, { ...own[0], separatorBefore: true }, ...own.slice(1)] : builtin;
     });
+    const field = useFieldControl(() => ({
+      wrapped: false,
+      invalid: props.invalid,
+      disabled: props.disabled
+    }));
     __expose({ open });
     return (_ctx, _cache) => {
       return openBlock(), createBlock(unref(PopoverRoot), {
@@ -309,11 +339,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                     default: withCtx(() => [
                       createElementVNode("button", {
                         type: "button",
-                        disabled: __props.disabled,
+                        id: unref(field).id,
+                        disabled: unref(field).disabled,
                         "aria-label": __props.ariaLabel,
+                        "aria-invalid": unref(field).invalid || void 0,
+                        "aria-describedby": unref(field).describedBy,
                         class: normalizeClass(["group inline-flex w-full items-center gap-2 rounded-control border bg-surface-soft px-2 text-left text-ink outline-none transition-colors duration-[var(--duration-fast)] focus-visible:ring-2 focus-visible:ring-ring data-[state=open]:border-brand disabled:cursor-not-allowed disabled:opacity-55", [
                           triggerSize[__props.size],
-                          __props.invalid ? "border-danger focus-visible:ring-danger-soft" : "border-line focus-visible:border-brand"
+                          unref(field).invalid ? "border-danger focus-visible:ring-danger-soft" : "border-line focus-visible:border-brand"
                         ]])
                       }, [
                         createElementVNode("span", {
@@ -345,6 +378,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           createVNode(unref(PopoverPortal), null, {
             default: withCtx(() => [
               createVNode(unref(PopoverContent), {
+                "collision-padding": 8,
                 side: __props.side,
                 align: __props.align,
                 "side-offset": 6,
@@ -359,6 +393,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                           role: "slider",
                           tabindex: __props.disabled ? -1 : 0,
                           "aria-label": l.value.saturation,
+                          "aria-valuemin": 0,
+                          "aria-valuemax": 100,
+                          "aria-valuenow": Math.round(hsv.value.s * 100),
                           "aria-valuetext": fill(l.value.saturationValueText, { s: Math.round(hsv.value.s * 100), v: Math.round(hsv.value.v * 100) }),
                           class: "relative h-36 w-full cursor-crosshair touch-none overflow-hidden rounded-control outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring",
                           style: normalizeStyle(fieldStyle.value),
@@ -418,24 +455,36 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                             class: "size-4 shrink-0 rounded-[5px] border border-line",
                             style: normalizeStyle({ backgroundColor: previewCss.value })
                           }, null, 4),
-                          createElementVNode("input", {
-                            value: inputValue.value,
-                            disabled: __props.disabled,
-                            spellcheck: "false",
-                            autocapitalize: "off",
-                            autocomplete: "off",
-                            "aria-label": l.value.value,
-                            class: "min-w-0 flex-1 select-text bg-transparent font-mono text-xs text-ink outline-none placeholder:text-muted",
-                            onInput,
-                            onBlur: onInputBlur
-                          }, null, 40, _hoisted_8)
+                          createElementVNode("span", _hoisted_8, [
+                            withDirectives(createVNode(_sfc_main$3, {
+                              value: rollText.value,
+                              duration: ROLL_MS,
+                              align: "start",
+                              "aria-hidden": "true",
+                              class: "pointer-events-none absolute inset-0 font-mono text-xs text-ink"
+                            }, null, 8, ["value"]), [
+                              [vShow, rolling.value]
+                            ]),
+                            createElementVNode("input", {
+                              value: inputValue.value,
+                              disabled: __props.disabled,
+                              spellcheck: "false",
+                              autocapitalize: "off",
+                              autocomplete: "off",
+                              "aria-label": l.value.value,
+                              class: normalizeClass(["min-w-0 flex-1 select-text bg-transparent font-mono text-xs text-ink outline-none placeholder:text-muted", rolling.value ? "text-transparent" : ""]),
+                              onInput,
+                              onKeydown: withKeys(commitTyped, ["enter"]),
+                              onBlur: onInputBlur
+                            }, null, 42, _hoisted_9)
+                          ])
                         ])) : createCommentVNode("", true),
                         (openBlock(true), createElementBlock(Fragment, null, renderList(swatchRows.value, (row) => {
                           return openBlock(), createElementBlock("div", {
                             key: row.key,
                             class: "flex flex-col gap-1.5"
                           }, [
-                            row.heading ? (openBlock(), createElementBlock("span", _hoisted_9, toDisplayString(row.heading), 1)) : createCommentVNode("", true),
+                            row.heading ? (openBlock(), createElementBlock("span", _hoisted_10, toDisplayString(row.heading), 1)) : createCommentVNode("", true),
                             createElementVNode("div", {
                               class: normalizeClass(["grid gap-1.5", row.cols])
                             }, [
@@ -461,7 +510,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                                     size: 13,
                                     class: normalizeClass(["relative", tickClass(c)])
                                   }, null, 8, ["class"])) : createCommentVNode("", true)
-                                ], 14, _hoisted_10);
+                                ], 14, _hoisted_11);
                               }), 128))
                             ], 2)
                           ]);

package/dist/chunks/{LpConfirmDialog-Q-bxff8z.js → LpConfirmDialog-DCw5jR1t.js}

@@ -1,35 +1,75 @@
-import { defineComponent, computed, openBlock, createBlock, createSlots, withCtx, renderSlot, createVNode, createTextVNode, toDisplayString, createElementVNode, normalizeClass } from "vue";
-import { _ as _sfc_main$2 } from "./LpButton-5VXXCjwF.js";
-import { _ as _sfc_main$3 } from "./LpIcon-CCnX5_2j.js";
-import { _ as _sfc_main$1 } from "./LpModal-Bt0pQCI_.js";
+import { defineComponent, computed, ref, watch, openBlock, createBlock, createSlots, withCtx, renderSlot, createElementBlock, toDisplayString, createCommentVNode, createVNode, createTextVNode, unref, createElementVNode, normalizeClass, nextTick } from "vue";
+import { useLabels } from "../composables/useLpConfig.js";
+import { _ as _sfc_main$2 } from "./LpButton-CKSwC6Mu.js";
+import { _ as _sfc_main$3 } from "./LpIcon-DYtaid0K.js";
+import { _ as _sfc_main$1 } from "./LpModal-DMMDQHAu.js";
 const _hoisted_1 = { class: "inline-flex items-center gap-2.5" };
+const _hoisted_2 = {
+  key: 0,
+  role: "alert",
+  class: "mt-3 text-sm text-danger"
+};
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "LpConfirmDialog",
   props: {
     open: { type: Boolean },
     title: {},
     description: {},
-    confirmLabel: { default: "Confirm" },
-    cancelLabel: { default: "Cancel" },
+    confirmLabel: {},
+    cancelLabel: {},
     danger: { type: Boolean },
     icon: {},
     loading: { type: Boolean },
-    loadingLabel: { default: "Working…" },
-    glass: { type: Boolean, default: void 0 }
+    loadingLabel: {},
+    action: {},
+    glass: { type: Boolean, default: void 0 },
+    labels: {}
   },
   emits: ["update:open", "confirm", "cancel"],
   setup(__props, { emit: __emit }) {
     const props = __props;
     const emit = __emit;
+    const text = useLabels(
+      "confirm",
+      { confirm: "Confirm", cancel: "Cancel", loading: "Working…", failed: "Something went wrong." },
+      () => props.labels
+    );
     const marker = computed(() => {
       if (props.icon !== void 0) return props.icon;
       return props.danger ? "lucide:triangle-alert" : "";
     });
-    function confirm() {
+    const running = ref(false);
+    const error = ref("");
+    const busy = computed(() => props.loading || running.value);
+    watch(
+      () => props.open,
+      (open) => {
+        if (open) error.value = "";
+      }
+    );
+    async function confirm() {
+      if (busy.value) return;
+      error.value = "";
       emit("confirm");
+      if (props.action) {
+        running.value = true;
+        try {
+          await props.action();
+        } catch (e) {
+          error.value = e instanceof Error && e.message ? e.message : text.value.failed;
+          return;
+        } finally {
+          running.value = false;
+        }
+        emit("update:open", false);
+        return;
+      }
+      await nextTick();
       if (!props.loading) emit("update:open", false);
     }
-    function cancel() {
+    function dismiss(open) {
+      if (open) return emit("update:open", true);
+      if (busy.value) return;
       emit("cancel");
       emit("update:open", false);
     }
@@ -39,32 +79,34 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         open: __props.open,
         title: __props.title,
         description: __props.description,
-        "onUpdate:open": _cache[0] || (_cache[0] = (v) => _ctx.$emit("update:open", v))
+        role: "alertdialog",
+        "onUpdate:open": dismiss
       }, createSlots({
         footer: withCtx(() => [
           createVNode(_sfc_main$2, {
             variant: "ghost",
-            disabled: __props.loading,
-            onClick: cancel
+            disabled: busy.value,
+            onClick: _cache[0] || (_cache[0] = ($event) => dismiss(false))
           }, {
             default: withCtx(() => [
-              createTextVNode(toDisplayString(__props.cancelLabel), 1)
+              createTextVNode(toDisplayString(__props.cancelLabel ?? unref(text).cancel), 1)
             ]),
             _: 1
           }, 8, ["disabled"]),
           createVNode(_sfc_main$2, {
             variant: __props.danger ? "danger" : "solid",
-            disabled: __props.loading,
+            disabled: busy.value,
             onClick: confirm
           }, {
             default: withCtx(() => [
-              createTextVNode(toDisplayString(__props.loading ? __props.loadingLabel : __props.confirmLabel), 1)
+              createTextVNode(toDisplayString(busy.value ? __props.loadingLabel ?? unref(text).loading : __props.confirmLabel ?? unref(text).confirm), 1)
             ]),
             _: 1
           }, 8, ["variant", "disabled"])
         ]),
         default: withCtx(() => [
-          renderSlot(_ctx.$slots, "default")
+          renderSlot(_ctx.$slots, "default"),
+          error.value ? (openBlock(), createElementBlock("p", _hoisted_2, toDisplayString(error.value), 1)) : createCommentVNode("", true)
         ]),
         _: 2
       }, [

package/dist/chunks/LpConfirmHost-CbywMpMP.js

@@ -0,0 +1,49 @@
+import { defineComponent, computed, ref, watch, openBlock, createBlock, createCommentVNode } from "vue";
+import { confirmQueue, settleConfirm } from "../components/confirm.js";
+import { _ as _sfc_main$1 } from "./LpConfirmDialog-DCw5jR1t.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "LpConfirmHost",
+  props: {
+    glass: { type: Boolean, default: void 0 }
+  },
+  setup(__props) {
+    const current = computed(() => confirmQueue[0]);
+    const open = ref(false);
+    let confirmed = false;
+    const answer = (value) => confirmed = value;
+    watch(
+      () => current.value?.id,
+      (id) => {
+        confirmed = false;
+        open.value = id !== void 0;
+      },
+      { immediate: true }
+    );
+    function onOpen(value) {
+      open.value = value;
+      const request = current.value;
+      if (!value && request) settleConfirm(request.id, confirmed);
+    }
+    return (_ctx, _cache) => {
+      return current.value ? (openBlock(), createBlock(_sfc_main$1, {
+        key: current.value.id,
+        open: open.value,
+        glass: __props.glass,
+        title: current.value.title,
+        description: current.value.description,
+        danger: current.value.danger,
+        icon: current.value.icon,
+        "confirm-label": current.value.confirmLabel,
+        "cancel-label": current.value.cancelLabel,
+        "loading-label": current.value.loadingLabel,
+        action: current.value.action,
+        onConfirm: _cache[0] || (_cache[0] = ($event) => answer(true)),
+        onCancel: _cache[1] || (_cache[1] = ($event) => answer(false)),
+        "onUpdate:open": onOpen
+      }, null, 8, ["open", "glass", "title", "description", "danger", "icon", "confirm-label", "cancel-label", "loading-label", "action"])) : createCommentVNode("", true);
+    };
+  }
+});
+export {
+  _sfc_main as _
+};

package/dist/chunks/LpContextMenu-BqkAYa9X.js

@@ -0,0 +1,69 @@
+import { defineComponent, computed, openBlock, createBlock, unref, withCtx, createVNode, renderSlot, normalizeClass, createCommentVNode } from "vue";
+import { ContextMenuRoot, ContextMenuTrigger, ContextMenuPortal, ContextMenuContent } from "reka-ui";
+import { _ as _sfc_main$1 } from "./ContextMenuItems-BtKU7074.js";
+import { POPOVER_PANEL } from "../components/dropdown.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "LpContextMenu",
+  props: {
+    items: {},
+    always: { type: Boolean }
+  },
+  setup(__props) {
+    const props = __props;
+    const enabled = computed(() => props.always || props.items.length > 0);
+    const PANEL = `${POPOVER_PANEL} z-(--z-popover) min-w-48 p-1 outline-none`;
+    const SELECTABLE = /* @__PURE__ */ new Set(["text", "search", "url", "tel", "password"]);
+    let field = null;
+    function rememberField() {
+      const el = document.activeElement;
+      const text = el instanceof HTMLTextAreaElement || el instanceof HTMLInputElement && SELECTABLE.has(el.type);
+      field = text ? { el, value: el.value, start: el.selectionStart ?? 0, end: el.selectionEnd ?? 0 } : null;
+    }
+    function returnFocus(event) {
+      const saved = field;
+      field = null;
+      if (!saved || !saved.el.isConnected) return;
+      event.preventDefault();
+      saved.el.focus();
+      if (saved.el.value === saved.value) saved.el.setSelectionRange(saved.start, saved.end);
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(ContextMenuRoot), null, {
+        default: withCtx(() => [
+          createVNode(unref(ContextMenuTrigger), {
+            "as-child": "",
+            disabled: !enabled.value,
+            onContextmenuCapture: rememberField
+          }, {
+            default: withCtx(() => [
+              renderSlot(_ctx.$slots, "default")
+            ]),
+            _: 3
+          }, 8, ["disabled"]),
+          __props.items.length ? (openBlock(), createBlock(unref(ContextMenuPortal), { key: 0 }, {
+            default: withCtx(() => [
+              createVNode(unref(ContextMenuContent), {
+                "collision-padding": 8,
+                class: normalizeClass(PANEL),
+                onCloseAutoFocus: returnFocus
+              }, {
+                default: withCtx(() => [
+                  createVNode(_sfc_main$1, {
+                    items: __props.items,
+                    panel: PANEL
+                  }, null, 8, ["items"])
+                ]),
+                _: 1
+              })
+            ]),
+            _: 1
+          })) : createCommentVNode("", true)
+        ]),
+        _: 3
+      });
+    };
+  }
+});
+export {
+  _sfc_main as _
+};