@wssto2/vue-core 0.4.28 → 0.5.0

package/dist/useGroupSheet-ATvc0IiM.js

@@ -0,0 +1,278 @@
+import { defineComponent as L, useModel as X, useId as Y, useTemplateRef as O, ref as h, computed as w, watch as N, nextTick as z, onMounted as H, openBlock as b, createElementBlock as _, normalizeClass as T, createElementVNode as $, unref as x, Fragment as I, renderList as Z, createTextVNode as ee, toDisplayString as j, createCommentVNode as C, mergeModels as A, onBeforeUnmount as te, createBlock as F, withCtx as E, createVNode as ae, renderSlot as J, provide as K, toRef as se, shallowRef as le, toValue as P } from "vue";
+import { useI18n as Q } from "vue-i18n";
+import { _ as oe } from "./Modal.vue_vue_type_script_setup_true_lang-DpBb8ans.js";
+import { _ as q } from "./Banner.vue_vue_type_script_setup_true_lang-DSStj_5z.js";
+import { D as ne } from "./useWaitStatus-fsacMl4W.js";
+import { _ as re, s as U, c as B, f as ie } from "./FormErrors.vue_vue_type_script_setup_true_lang-D7edzNTL.js";
+import { e as ue } from "./options-g8RwEhBk.js";
+import { r as ce } from "./FormGroup.vue_vue_type_script_setup_true_lang-BPchlRCl.js";
+import { t as de } from "./toast-CqSDTWRX.js";
+import { a as fe } from "./leaveGuard-Cc8yeLxM.js";
+const ve = ["id", "value", "name", "disabled", "aria-label", "aria-invalid", "aria-describedby"], me = {
+  key: 1,
+  class: "h-5 w-px animate-caret-blink bg-content-strong"
+}, Ge = /* @__PURE__ */ L({
+  __name: "OtpInput",
+  props: /* @__PURE__ */ A({
+    length: { default: 6 },
+    disabled: { type: Boolean, default: !1 },
+    invalid: { type: Boolean, default: !1 },
+    autofocus: { type: Boolean, default: !1 },
+    name: { default: void 0 },
+    label: { default: void 0 },
+    describedBy: { default: void 0 }
+  }, {
+    modelValue: { default: "" },
+    modelModifiers: {}
+  }),
+  emits: /* @__PURE__ */ A(["complete"], ["update:modelValue"]),
+  setup(l, { expose: a, emit: t }) {
+    const o = l, i = X(l, "modelValue"), d = t, { t: m } = Q(), f = Y(), r = O("input"), v = h(!1), g = h(0), c = h(!1), y = (s) => s.replace(/\D/g, "").slice(0, o.length), u = w(() => y(i.value)), k = w(() => Math.min(g.value, o.length - 1)), D = w(() => o.label ?? m("core.form.otp.label", { length: o.length }));
+    function p() {
+      g.value = r.value?.selectionStart ?? u.value.length;
+    }
+    function S(s) {
+      const e = y(s);
+      r.value && r.value.value !== e && (r.value.value = e);
+      const n = e !== u.value;
+      i.value = e, z(p), n && e.length === o.length && d("complete", e);
+    }
+    function G(s) {
+      const e = s.clipboardData?.getData("text") ?? "";
+      e && (s.preventDefault(), S(e), z(() => {
+        const n = u.value.length;
+        r.value?.setSelectionRange(n, n), p();
+      }));
+    }
+    return N(
+      () => o.invalid,
+      (s) => {
+        s && (c.value = !1, requestAnimationFrame(() => c.value = !0));
+      }
+    ), N(u, (s) => {
+      r.value && r.value.value !== s && (r.value.value = s, z(p));
+    }), H(() => {
+      o.autofocus && r.value?.focus();
+    }), a({ focus: () => r.value?.focus() }), (s, e) => (b(), _("div", {
+      class: T(["relative inline-flex gap-2 sm:gap-3", { "motion-safe:animate-shake": c.value }]),
+      "data-test": "otp-input",
+      onAnimationend: e[3] || (e[3] = (n) => c.value = !1)
+    }, [
+      $("input", {
+        id: x(f),
+        ref_key: "input",
+        ref: r,
+        value: u.value,
+        name: o.name,
+        type: "text",
+        inputmode: "numeric",
+        autocomplete: "one-time-code",
+        pattern: "\\d*",
+        spellcheck: "false",
+        disabled: o.disabled,
+        "aria-label": D.value,
+        "aria-invalid": o.invalid || void 0,
+        "aria-describedby": o.describedBy,
+        "data-test": "otp-input-field",
+        class: "absolute inset-0 z-10 h-full w-full cursor-text border-0 bg-transparent p-0 text-base text-transparent caret-transparent outline-none selection:bg-transparent disabled:cursor-not-allowed",
+        onInput: e[0] || (e[0] = (n) => S(n.target.value)),
+        onPaste: G,
+        onFocus: e[1] || (e[1] = (n) => {
+          v.value = !0, p();
+        }),
+        onBlur: e[2] || (e[2] = (n) => v.value = !1),
+        onKeyup: p,
+        onClick: p,
+        onSelect: p
+      }, null, 40, ve),
+      (b(!0), _(I, null, Z(o.length, (n) => (b(), _("div", {
+        key: n,
+        "aria-hidden": "true",
+        "data-test": "otp-input-cell",
+        class: T(["flex size-11 items-center justify-center rounded-control bg-fill text-lg font-medium tabular-nums text-content-strong transition-[box-shadow] sm:size-13 sm:text-xl", [o.invalid ? "bg-status-danger-surface ring-[1.5px] ring-inset ring-border-destructive" : v.value && k.value === n - 1 ? "bg-surface-cell ring-[1.5px] ring-inset ring-border-focus outline-3 outline-border-focus/20" : "", o.disabled ? "opacity-45" : ""]])
+      }, [
+        u.value[n - 1] ? (b(), _(I, { key: 0 }, [
+          ee(j(u.value[n - 1]), 1)
+        ], 64)) : v.value && k.value === n - 1 ? (b(), _("span", me)) : C("", !0)
+      ], 2))), 128))
+    ], 34));
+  }
+}), pe = { class: "text-footnote" }, be = { class: "text-footnote" }, Ve = /* @__PURE__ */ L({
+  __name: "GroupSheet",
+  props: {
+    sheet: {},
+    title: {},
+    subtitle: { default: void 0 },
+    editable: { type: Boolean },
+    size: { default: "md" },
+    groupLabel: {},
+    fieldLabel: { type: Function, default: void 0 }
+  },
+  emits: ["saved"],
+  setup(l, { emit: a }) {
+    const t = l, o = a, { t: i } = Q(), d = O("modal"), m = O("body"), f = h(!1);
+    let r = null;
+    N(() => t.sheet.open.value, (c) => {
+      c ? (f.value = !1, d.value?.present()) : d.value?.dismiss();
+    }), H(() => {
+      t.sheet.open.value && d.value?.present();
+    }), te(() => {
+      r && clearTimeout(r);
+    });
+    async function v() {
+      await t.sheet.save() && (f.value = !0, o("saved"), r = setTimeout(() => t.sheet.dismiss(), ne));
+    }
+    const g = w(() => t.sheet.saving.value ? "processing" : f.value ? "done" : "idle");
+    return (c, y) => (b(), F(oe, {
+      ref_key: "modal",
+      ref: d,
+      size: t.size,
+      grouped: "",
+      title: t.title,
+      subtitle: t.subtitle,
+      "before-dismiss": t.sheet.beforeDismiss,
+      "primary-label": t.editable ? x(i)("core.actions.save") : void 0,
+      status: g.value,
+      "processing-label": x(i)("core.actions.saving"),
+      "done-label": x(i)("core.actions.saved"),
+      onPrimary: v,
+      onDismissed: y[0] || (y[0] = (u) => t.sheet.closed())
+    }, {
+      default: E(() => [
+        $("div", {
+          ref_key: "body",
+          ref: m,
+          class: "flex min-w-0 flex-col gap-group-gap"
+        }, [
+          t.sheet.notice.value ? (b(), F(q, {
+            key: 0,
+            tone: "warning",
+            "data-test": "group-sheet-notice"
+          }, {
+            default: E(() => [
+              $("p", pe, j(t.sheet.notice.value), 1)
+            ]),
+            _: 1
+          })) : C("", !0),
+          t.sheet.foreignGroups.value.length ? (b(), F(q, {
+            key: 1,
+            tone: "warning",
+            "data-test": "group-sheet-foreign"
+          }, {
+            default: E(() => [
+              $("p", be, j(x(i)("core.form.group.foreign", { groups: t.sheet.foreignGroups.value.map(t.groupLabel).join(", ") })), 1)
+            ]),
+            _: 1
+          })) : C("", !0),
+          ae(re, {
+            form: t.sheet.form,
+            label: t.fieldLabel,
+            scope: m.value
+          }, null, 8, ["form", "label", "scope"]),
+          J(c.$slots, "default")
+        ], 512)
+      ]),
+      _: 3
+    }, 8, ["size", "title", "subtitle", "before-dismiss", "primary-label", "status", "processing-label", "done-label"]));
+  }
+}), ge = ["data-group"], ze = /* @__PURE__ */ L({
+  __name: "RecordGroupScope",
+  props: {
+    only: {},
+    editable: { type: Boolean }
+  },
+  setup(l) {
+    const a = l;
+    return K(ce, { only: se(a, "only") }), K(ue, w(() => a.editable)), (t, o) => (b(), _("div", {
+      class: "flex min-w-0 flex-col gap-group-gap",
+      "data-test": "record-group-scope",
+      "data-group": a.only
+    }, [
+      J(t.$slots, "default")
+    ], 8, ge));
+  }
+});
+function Fe(l) {
+  const { form: a } = l;
+  if (l.rebase && !a.rebase) throw new Error("useGroupSheet: `rebase` needs a record form (useResourceForm), which can take the freshly read record as its base.");
+  const t = () => typeof l.fields == "function" ? l.fields() : l.fields, o = () => P(l.restore) ?? t(), i = h(!1), d = h(!1), m = h([]), f = h(null), r = le({});
+  let v = {};
+  const g = (s) => Object.fromEntries(s.map((e) => [e, B(a.values[e])])), c = w(() => i.value && !U(g(o()), r.value)), { confirmDiscard: y } = fe(() => c.value);
+  function u() {
+    v = g(o()), r.value = B(v);
+  }
+  function k() {
+    u(), m.value = [], f.value = null, a.dismissFailure(), i.value = !0;
+  }
+  function D() {
+    if (i.value) {
+      c.value && Object.assign(a.values, B(v));
+      for (const s of t()) a.errors.clear(s);
+      a.dismissFailure(), i.value = !1;
+    }
+  }
+  function p(s) {
+    const e = new Set(t()), n = P(l.group), M = /* @__PURE__ */ new Set();
+    for (const W of Object.keys(s.all())) {
+      const R = ie(W);
+      if (e.has(R)) continue;
+      const V = l.groupOf?.(R) ?? l.fallbackGroup;
+      V && V !== n && M.add(V);
+    }
+    m.value = [...M];
+  }
+  async function S(s) {
+    const e = B(g(t().filter((n) => !U(a.values[n], r.value[n]))));
+    try {
+      await s.reload();
+    } catch {
+      return;
+    }
+    a.rebase?.() && (u(), Object.assign(a.values, e), f.value = s.message());
+  }
+  async function G() {
+    if (d.value) return !1;
+    d.value = !0, m.value = [], f.value = null;
+    try {
+      const s = l.onSaved ? () => l.onSaved?.() : void 0;
+      let e;
+      if (l.save) e = await a.submitFields(t(), l.save, { refresh: s });
+      else if (a.save) e = await a.save({ refresh: s });
+      else throw new Error("useGroupSheet: the form has no full-record save(), so give the sheet its own `save` for a dedicated endpoint.");
+      switch (e.status) {
+        case "saved":
+          return u(), !0;
+        case "saved-refresh-failed":
+          return u(), de.warning(a.failure.value?.message ?? ""), !0;
+        case "aborted":
+          return !1;
+        case "failed":
+          return e.failure.kind === "conflict" && l.rebase ? await S(l.rebase) : p(a.errors), !1;
+      }
+    } finally {
+      d.value = !1;
+    }
+  }
+  return {
+    open: i,
+    saving: d,
+    dirty: c,
+    foreignGroups: m,
+    notice: f,
+    failure: a.failure,
+    form: a,
+    present: k,
+    dismiss: () => {
+      i.value = !1;
+    },
+    save: G,
+    beforeDismiss: y,
+    closed: D
+  };
+}
+export {
+  Ve as _,
+  ze as a,
+  Ge as b,
+  Fe as u
+};

package/dist/{useLoad-M7V-AVwR.js → useLoad-W4tfxmm5.js}

@@ -1,6 +1,6 @@
 import { shallowRef as S, watch as k, getCurrentScope as C, onScopeDispose as D, computed as v } from "vue";
 import { useI18n as E } from "vue-i18n";
-import { u as x } from "./describeError-B-NMa--w.js";
+import { u as x } from "./describeError-BqGAUZgX.js";
 const f = Symbol("vue-core.load.abandoned");
 function M(m, t = {}) {
   const { t: g } = E(), b = x(), p = t.errorMessage ?? ((a) => b(a, { fallback: g("core.resource.unavailable") })), e = S({ status: "loading" });

package/dist/{useResourceForm-tGYTfKhH.js → useResourceForm-CJfl8rj_.js}

@@ -1,5 +1,5 @@
 import { shallowRef as v, watch as m, computed as f } from "vue";
-import { u as i, c as h } from "./FormErrors.vue_vue_type_script_setup_true_lang-DGOSc-PS.js";
+import { u as i, c as h } from "./FormErrors.vue_vue_type_script_setup_true_lang-D7edzNTL.js";
 function b(u) {
   const t = i(u), r = v(null), s = v(!1);
   let n = null;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@wssto2/vue-core",
-  "version": "0.4.28",
-  "goCore": "v1.7.0",
+  "version": "0.5.0",
+  "goCore": "v1.8.0",
   "description": "Shared Vue 3 library for go-core applications: app shell, list / record / form pages and their controls.",
   "keywords": [
     "vue",
@@ -121,6 +121,10 @@
       "types": "./dist/notifications/index.d.ts",
       "import": "./dist/notifications/index.js"
     },
+    "./push-worker": {
+      "types": "./dist/push-worker/index.d.ts",
+      "import": "./dist/push-worker/index.js"
+    },
     "./testing": {
       "types": "./dist/testing/index.d.ts",
       "import": "./dist/testing/index.js"

package/dist/KeyValue.vue_vue_type_script_setup_true_lang-wcZcvnow.js

@@ -1,35 +0,0 @@
-import { defineComponent as p, useSlots as f, computed as v, openBlock as a, createElementBlock as l, createElementVNode as t, createTextVNode as r, toDisplayString as o, renderSlot as d, normalizeClass as _, Fragment as x, unref as y } from "vue";
-import { useI18n as b } from "vue-i18n";
-const g = { class: "min-w-0" }, k = { class: "flex items-center gap-1 text-xs text-content-muted" }, w = { class: "sr-only" }, E = /* @__PURE__ */ p({
-  __name: "KeyValue",
-  props: {
-    label: {},
-    value: { default: void 0 },
-    wrap: { type: Boolean, default: !0 }
-  },
-  setup(u) {
-    const e = u, { t: c } = b(), i = f(), m = v(() => !i.default && (e.value === null || e.value === void 0 || e.value === ""));
-    return (s, n) => (a(), l("div", g, [
-      t("dt", k, [
-        r(o(e.label) + " ", 1),
-        d(s.$slots, "label")
-      ]),
-      t("dd", {
-        class: _(["mt-0.5 text-sm font-medium text-content-strong", e.wrap ? "break-words" : "truncate"])
-      }, [
-        m.value ? (a(), l(x, { key: 0 }, [
-          n[0] || (n[0] = t("span", {
-            "aria-hidden": "true",
-            class: "font-normal text-content-disabled"
-          }, "—", -1)),
-          t("span", w, o(y(c)("core.state.no_value")), 1)
-        ], 64)) : d(s.$slots, "default", {}, () => [
-          r(o(e.value), 1)
-        ], void 0, 1)
-      ], 2)
-    ]));
-  }
-});
-export {
-  E as _
-};

package/dist/OtpInput.vue_vue_type_script_setup_true_lang-gp4FfWAH.js

@@ -1,95 +0,0 @@
-import { defineComponent as S, useModel as F, useId as T, useTemplateRef as $, ref as c, computed as v, watch as h, nextTick as f, onMounted as A, openBlock as s, createElementBlock as u, normalizeClass as k, createElementVNode as E, unref as R, Fragment as B, renderList as _, createTextVNode as j, toDisplayString as q, createCommentVNode as K, mergeModels as V } from "vue";
-import { useI18n as L } from "vue-i18n";
-const O = ["id", "value", "name", "disabled", "aria-label", "aria-invalid", "aria-describedby"], P = {
-  key: 1,
-  class: "h-5 w-px animate-caret-blink bg-content-strong"
-}, J = /* @__PURE__ */ S({
-  __name: "OtpInput",
-  props: /* @__PURE__ */ V({
-    length: { default: 6 },
-    disabled: { type: Boolean, default: !1 },
-    invalid: { type: Boolean, default: !1 },
-    autofocus: { type: Boolean, default: !1 },
-    name: { default: void 0 },
-    label: { default: void 0 },
-    describedBy: { default: void 0 }
-  }, {
-    modelValue: { default: "" },
-    modelModifiers: {}
-  }),
-  emits: /* @__PURE__ */ V(["complete"], ["update:modelValue"]),
-  setup(p, { expose: w, emit: z }) {
-    const a = p, m = F(p, "modelValue"), C = z, { t: D } = L(), I = T(), n = $("input"), r = c(!1), g = c(0), d = c(!1), b = (l) => l.replace(/\D/g, "").slice(0, a.length), o = v(() => b(m.value)), x = v(() => Math.min(g.value, a.length - 1)), M = v(() => a.label ?? D("core.form.otp.label", { length: a.length }));
-    function i() {
-      g.value = n.value?.selectionStart ?? o.value.length;
-    }
-    function y(l) {
-      const e = b(l);
-      n.value && n.value.value !== e && (n.value.value = e);
-      const t = e !== o.value;
-      m.value = e, f(i), t && e.length === a.length && C("complete", e);
-    }
-    function N(l) {
-      const e = l.clipboardData?.getData("text") ?? "";
-      e && (l.preventDefault(), y(e), f(() => {
-        const t = o.value.length;
-        n.value?.setSelectionRange(t, t), i();
-      }));
-    }
-    return h(
-      () => a.invalid,
-      (l) => {
-        l && (d.value = !1, requestAnimationFrame(() => d.value = !0));
-      }
-    ), h(o, (l) => {
-      n.value && n.value.value !== l && (n.value.value = l, f(i));
-    }), A(() => {
-      a.autofocus && n.value?.focus();
-    }), w({ focus: () => n.value?.focus() }), (l, e) => (s(), u("div", {
-      class: k(["relative inline-flex gap-2 sm:gap-3", { "motion-safe:animate-shake": d.value }]),
-      "data-test": "otp-input",
-      onAnimationend: e[3] || (e[3] = (t) => d.value = !1)
-    }, [
-      E("input", {
-        id: R(I),
-        ref_key: "input",
-        ref: n,
-        value: o.value,
-        name: a.name,
-        type: "text",
-        inputmode: "numeric",
-        autocomplete: "one-time-code",
-        pattern: "\\d*",
-        spellcheck: "false",
-        disabled: a.disabled,
-        "aria-label": M.value,
-        "aria-invalid": a.invalid || void 0,
-        "aria-describedby": a.describedBy,
-        "data-test": "otp-input-field",
-        class: "absolute inset-0 z-10 h-full w-full cursor-text border-0 bg-transparent p-0 text-base text-transparent caret-transparent outline-none selection:bg-transparent disabled:cursor-not-allowed",
-        onInput: e[0] || (e[0] = (t) => y(t.target.value)),
-        onPaste: N,
-        onFocus: e[1] || (e[1] = (t) => {
-          r.value = !0, i();
-        }),
-        onBlur: e[2] || (e[2] = (t) => r.value = !1),
-        onKeyup: i,
-        onClick: i,
-        onSelect: i
-      }, null, 40, O),
-      (s(!0), u(B, null, _(a.length, (t) => (s(), u("div", {
-        key: t,
-        "aria-hidden": "true",
-        "data-test": "otp-input-cell",
-        class: k(["flex size-11 items-center justify-center rounded-control bg-fill text-lg font-medium tabular-nums text-content-strong transition-[box-shadow] sm:size-13 sm:text-xl", [a.invalid ? "bg-status-danger-surface ring-[1.5px] ring-inset ring-border-destructive" : r.value && x.value === t - 1 ? "bg-surface-cell ring-[1.5px] ring-inset ring-border-focus outline-3 outline-border-focus/20" : "", a.disabled ? "opacity-45" : ""]])
-      }, [
-        o.value[t - 1] ? (s(), u(B, { key: 0 }, [
-          j(q(o.value[t - 1]), 1)
-        ], 64)) : r.value && x.value === t - 1 ? (s(), u("span", P)) : K("", !0)
-      ], 2))), 128))
-    ], 34));
-  }
-});
-export {
-  J as _
-};

package/dist/PanelActions.vue_vue_type_script_setup_true_lang-E9VdIGkf.js

@@ -1,46 +0,0 @@
-import { defineComponent as _, openBlock as n, createElementBlock as i, toDisplayString as s, unref as o, createCommentVNode as c, createBlock as y, withCtx as m, createTextVNode as l, createVNode as g } from "vue";
-import { useI18n as x } from "vue-i18n";
-import { _ as p } from "./Button.vue_vue_type_script_setup_true_lang-CL9Qh5yq.js";
-import { a as k } from "./leaveGuard-Cc8yeLxM.js";
-const b = { class: "flex flex-wrap items-center justify-end gap-3" }, v = {
-  key: 0,
-  class: "mr-auto text-footnote text-content-muted",
-  "data-unsaved": ""
-}, w = /* @__PURE__ */ _({
-  __name: "PanelActions",
-  props: {
-    label: {},
-    processing: { type: Boolean },
-    dirty: { type: Boolean }
-  },
-  emits: ["submit", "cancel"],
-  setup(d, { emit: u }) {
-    const e = d, r = u, { t: a } = x();
-    return k(() => e.dirty), (B, t) => (n(), i("div", b, [
-      e.dirty ? (n(), i("span", v, s(o(a)("core.form.unsaved_changes")), 1)) : c("", !0),
-      e.dirty ? (n(), y(o(p), {
-        key: 1,
-        disabled: e.processing,
-        onClick: t[0] || (t[0] = (f) => r("cancel"))
-      }, {
-        default: m(() => [
-          l(s(o(a)("core.actions.cancel")), 1)
-        ]),
-        _: 1
-      }, 8, ["disabled"])) : c("", !0),
-      g(o(p), {
-        prominence: "primary",
-        processing: e.processing,
-        onClick: t[1] || (t[1] = (f) => r("submit"))
-      }, {
-        default: m(() => [
-          l(s(e.label), 1)
-        ]),
-        _: 1
-      }, 8, ["processing"])
-    ]));
-  }
-});
-export {
-  w as _
-};