@piveau/dpi 0.2.0-alpha.5 → 0.2.0-alpha.51

package/dist/packages/dpi/src/data-provider-interface/components/Spatial.vue.js

@@ -0,0 +1,7 @@
+import a from "./Spatial.vue2.js";
+/* empty css             */
+import o from "../../../../../_virtual/_plugin-vue_export-helper.js";
+const m = /* @__PURE__ */ o(a, [["__scopeId", "data-v-111a5dac"]]);
+export {
+  m as default
+};

package/dist/packages/dpi/src/data-provider-interface/components/Spatial.vue2.js

@@ -0,0 +1,184 @@
+import { defineComponent as L, mergeModels as R, useModel as z, ref as m, computed as b, watch as $, createElementBlock as p, openBlock as n, createCommentVNode as h, createBlock as c, Fragment as G, renderList as I, withDirectives as M, createElementVNode as y, vModelCheckbox as N, withCtx as _, createVNode as v } from "vue";
+import E from "../HappyFlowComponents/ui/Autocomplete/AutocompleteVocab.vue.js";
+import F from "../HappyFlowComponents/ui/ButtonV3.vue.js";
+import V from "../HappyFlowComponents/ui/Chip.vue.js";
+import T from "../HappyFlowComponents/ui/InputField.vue.js";
+import W from "../HappyFlowComponents/ui/ListBox/Listbox.vue.js";
+import D from "../HappyFlowComponents/ui/ProcessSteps/GetResource.vue.js";
+import K from "../HappyFlowComponents/ui/ProcessSteps/ProcessStepInputCard.vue.js";
+const O = { class: "step-section" }, P = { key: 0 }, j = ["id", "value", "disabled"], q = {
+  key: 2,
+  class: "step-section-actions dpiV3_tempAddMore"
+}, le = /* @__PURE__ */ L({
+  __name: "Spatial",
+  props: /* @__PURE__ */ R({
+    baseUrl: { default: "https://twin.bydata.de/api/hub/search" },
+    options: { default: () => [
+      { id: "continent", name: "Kontinent" },
+      { id: "country", name: "Land" },
+      { id: "place", name: "Ort" }
+    ] },
+    readonly: { type: Boolean, default: !1 }
+  }, {
+    modelValue: { default: () => [] },
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(g) {
+    const u = g, s = z(g, "modelValue"), r = m(u.options.find((l) => l.id === "place") || u.options[0]), d = m(void 0), i = m(""), f = b(() => {
+      try {
+        if (!i.value)
+          return !1;
+        const l = new URL(i.value);
+        return !!l.protocol && !!l.host;
+      } catch {
+        return !1;
+      }
+    }), w = b(() => {
+      var l;
+      return ((l = r.value) == null ? void 0 : l.id) || "";
+    });
+    $(r, (l) => {
+      l && (d.value = void 0);
+    });
+    function A(l) {
+      return l.startsWith("http://publications.europa.eu/resource/authority");
+    }
+    const B = b(() => f.value || !!d.value);
+    function C() {
+      var e;
+      const l = (e = i.value) == null ? void 0 : e.trim(), t = f.value, a = d.value, o = t ? l : a;
+      o && (s.value = [o], i.value = "", d.value = void 0);
+    }
+    return (l, t) => (n(), p("section", O, [
+      s.value.length > 0 ? (n(), p("div", P, [
+        (n(!0), p(G, null, I(s.value, (a, o) => (n(), p("div", {
+          key: `spatial-${o}`,
+          class: "functionalities"
+        }, [
+          M(y("input", {
+            id: `spatial-${o}`,
+            "onUpdate:modelValue": t[0] || (t[0] = (e) => s.value = e),
+            hidden: "",
+            value: a,
+            name: "spatial",
+            type: "checkbox",
+            disabled: u.readonly
+          }, null, 8, j), [
+            [N, s.value]
+          ]),
+          A(a) ? (n(), c(D, {
+            key: 0,
+            "base-url": u.baseUrl,
+            vocabulary: a == null ? void 0 : a.split("/").slice(-2)[0],
+            "resource-id": a,
+            "setup-fn": (e) => e
+          }, {
+            default: _(({ result: e }) => {
+              var k, U, x, S;
+              return [
+                l.readonly ? (n(), c(V, {
+                  key: 1,
+                  as: "span",
+                  for: `spatial-${o}`,
+                  text: ((x = e == null ? void 0 : e.pref_label) == null ? void 0 : x.de) || ((S = e == null ? void 0 : e.pref_label) == null ? void 0 : S.en),
+                  setup: {
+                    "@type": "static"
+                  },
+                  data: { "@value": a, URI: a }
+                }, null, 8, ["for", "text", "data"])) : (n(), c(V, {
+                  key: 0,
+                  as: "label",
+                  for: `spatial-${o}`,
+                  text: ((k = e == null ? void 0 : e.pref_label) == null ? void 0 : k.de) || ((U = e == null ? void 0 : e.pref_label) == null ? void 0 : U.en),
+                  setup: {
+                    "@type": "select",
+                    "@icon": "suffix",
+                    "@inTable": !1,
+                    "@search": !1,
+                    "@selected": !0
+                  },
+                  data: { "@value": a, URI: a }
+                }, null, 8, ["for", "text", "data"]))
+              ];
+            }),
+            _: 2
+          }, 1032, ["base-url", "vocabulary", "resource-id", "setup-fn"])) : (n(), c(V, {
+            key: 1,
+            as: "label",
+            for: `spatial-${o}`,
+            text: a,
+            setup: {
+              "@type": "select",
+              "@icon": "suffix",
+              "@inTable": !1,
+              "@search": !1,
+              "@selected": !0
+            },
+            data: { "@value": a, URI: a }
+          }, null, 8, ["for", "text", "data"]))
+        ]))), 128))
+      ])) : h("", !0),
+      s.value.length === 0 ? (n(), c(K, {
+        key: 1,
+        class: "step-section",
+        "no-delete": ""
+      }, {
+        default: _(() => {
+          var a;
+          return [
+            t[4] || (t[4] = y("h5", null, "Administrativer Bezug", -1)),
+            v(W, {
+              modelValue: r.value,
+              "onUpdate:modelValue": t[1] || (t[1] = (o) => r.value = o),
+              options: u.options,
+              label: "Gebiet der Abdeckung",
+              placeholder: "Wählen Sie das Gebiet der Abdeckung."
+            }, null, 8, ["modelValue", "options"]),
+            v(E, {
+              modelValue: d.value,
+              "onUpdate:modelValue": t[2] || (t[2] = (o) => d.value = o),
+              by: "vocabulary",
+              label: (a = r.value) == null ? void 0 : a.name,
+              "base-url": u.baseUrl,
+              vocabulary: w.value,
+              placeholder: "Legen Sie die räumliche Abdeckung fest.",
+              name: "spatial"
+            }, null, 8, ["modelValue", "label", "base-url", "vocabulary"]),
+            t[5] || (t[5] = y("h5", null, "oder Geodatensatz", -1)),
+            v(T, {
+              modelValue: i.value,
+              "onUpdate:modelValue": t[3] || (t[3] = (o) => i.value = o),
+              "add-on-text": !1,
+              "date-picker": !1,
+              "info-icon": !1,
+              "show-end-icon": !1,
+              "pre-icon": !1,
+              "input-type": "url",
+              label: "URL angeben",
+              placeholder: "https://example.org/geodatensatz",
+              "show-error": !!i.value && !f.value,
+              error_message: "Geben Sie eine gültige URL an",
+              "initial-hint-text": !!i.value && !f.value
+            }, null, 8, ["modelValue", "show-error", "initial-hint-text"])
+          ];
+        }),
+        _: 1,
+        __: [4, 5]
+      })) : h("", !0),
+      s.value.length === 0 ? (n(), p("div", q, [
+        v(F, {
+          "button-text": "Räumliche Abdeckung hinzufügen",
+          size: "medium",
+          variant: "tertiary",
+          "icon-start": "plus",
+          disabled: !B.value,
+          onClick: C
+        }, null, 8, ["disabled"])
+      ])) : h("", !0)
+    ]));
+  }
+});
+export {
+  le as default
+};

package/dist/packages/dpi/src/{stories/components/MethodsCard.vue.js → data-provider-interface/components/SpatialPage.vue.js}

@@ -1,7 +1,7 @@
-import o from "./MethodsCard.vue2.js";
+import o from "./SpatialPage.vue2.js";
 /* empty css                 */
 import t from "../../../../../_virtual/_plugin-vue_export-helper.js";
-const m = /* @__PURE__ */ t(o, [["__scopeId", "data-v-49c6a50c"]]);
+const m = /* @__PURE__ */ t(o, [["__scopeId", "data-v-56c592dd"]]);
 export {
   m as default
 };

package/dist/packages/dpi/src/data-provider-interface/components/SpatialPage.vue2.js

@@ -0,0 +1,59 @@
+import { defineComponent as p, computed as u, createElementBlock as c, openBlock as m, createElementVNode as i, createVNode as r, unref as g } from "vue";
+import { PhLightbulb as f } from "@phosphor-icons/vue";
+import { useFormValues as _ } from "../composables/useDpiFormValues.js";
+import v from "./Spatial.vue.js";
+import { useEditModeInfo as V } from "../composables/useDpiEditMode.js";
+const h = { class: "dpiV3InnerComponentWrap" }, z = { class: "dropdown-container" }, b = { class: "dpiV3_Content_InputPage" }, A = { class: "dpiV3_Card_Tips" }, I = { class: "dpiV3_Icon_Title" }, E = /* @__PURE__ */ p({
+  __name: "SpatialPage",
+  props: {
+    context: Object
+  },
+  setup(k) {
+    var d;
+    const { isEditMode: l } = V(), { formValues: t } = _();
+    l.value || (t.value.Additionals || (t.value.Additionals = {}), (d = t.value.Additionals)["dct:spatial"] || (d["dct:spatial"] = [
+      { isValid: !0 }
+    ])), l.value || (t.value.Covering["dcatde:politicalGeocodingURI"] = [
+      { isValid: !0 }
+    ]);
+    const o = u({
+      get() {
+        var s, e, n;
+        return ((n = (e = (s = t.value.Additionals) == null ? void 0 : s["dct:spatial"]) == null ? void 0 : e.filter((a) => !(a.isValid && Object.keys(a).length === 1))) == null ? void 0 : n.map((a) => a["@id"])) || [];
+      },
+      set(s) {
+        t.value.Additionals || (t.value.Additionals = {}), t.value.Additionals["dct:spatial"] = [
+          ...s.map((e) => ({ "@id": e }))
+        ];
+      }
+    });
+    return (s, e) => (m(), c("div", h, [
+      e[3] || (e[3] = i("h4", null, " Legen Sie die räumliche Abdeckung Ihres Datensatzes fest (optional) ", -1)),
+      e[4] || (e[4] = i("div", { class: "copy-large-regular" }, " Bitte geben Sie an, auf welches geografische oder politische Gebiet sich Ihr Datensatz bezieht. Dies kann beispielsweise eine Stadt, eine Region, ein Land oder eine spezifische Verwaltungseinheit sein. Die Angabe des räumlichen Bezugs hilft anderen Nutzenden, Ihren Datensatz schnell im passenden Kontext zu finden und gezielt für ihre Zwecke einzusetzen. ", -1)),
+      i("div", z, [
+        r(v, {
+          modelValue: o.value,
+          "onUpdate:modelValue": e[0] || (e[0] = (n) => o.value = n)
+        }, null, 8, ["modelValue"]),
+        i("div", b, [
+          i("div", A, [
+            i("div", I, [
+              r(g(f), {
+                size: 32,
+                color: "#009fe3"
+              }),
+              e[1] || (e[1] = i("div", { class: "dpiV3_Info-Text dpiV3_activeStepName" }, " Beispiele ", -1))
+            ]),
+            e[2] || (e[2] = i("div", { class: "dpiV3_CT-Content" }, [
+              i("div", { class: "dpiV3_copy_large_regular link_text" }, " Würzburg: http://publications.europa.eu/resource/authority/place/DEU-WUE "),
+              i("div", { class: "dpiV3_copy_large_regular link_text" }, " Deutschland: http://sws.geonames.org/2921044/ ")
+            ], -1))
+          ])
+        ])
+      ])
+    ]));
+  }
+});
+export {
+  E as default
+};

package/dist/packages/dpi/src/data-provider-interface/components/StepActionsSection.vue.js

@@ -1,7 +1,7 @@
 import o from "./StepActionsSection.vue2.js";
 /* empty css                        */
 import t from "../../../../../_virtual/_plugin-vue_export-helper.js";
-const r = /* @__PURE__ */ t(o, [["__scopeId", "data-v-8b3e09cd"]]);
+const e = /* @__PURE__ */ t(o, [["__scopeId", "data-v-80612429"]]);
 export {
-  r as default
+  e as default
 };

package/dist/packages/dpi/src/data-provider-interface/components/StepActionsSection.vue2.js

@@ -1,11 +1,17 @@
-import { defineComponent as B, inject as P, ref as h, watch as z, toRef as E, computed as F, createElementBlock as u, openBlock as i, createElementVNode as c, createBlock as _, createCommentVNode as I, renderSlot as g, createVNode as d, normalizeStyle as M, withDirectives as p, vShow as y, withCtx as x, Fragment as A, renderList as D, toDisplayString as L, createTextVNode as R, nextTick as $ } from "vue";
-import { getNode as K, isNode as W } from "@formkit/core";
-import { getValidationMessages as j } from "@formkit/validation";
-import { useFormValues as J } from "../composables/useDpiFormValues.js";
-import f from "../HappyFlowComponents/ui/ButtonV3.vue.js";
-import O from "../HappyFlowComponents/ui/Card.vue.js";
-import { dpiStepperKey as Z } from "../utils/injectionKeys.js";
-const q = { class: "step-actions-container" }, G = { class: "step-actions" }, H = { class: "step-actions__prev-and-next" }, Q = { class: "validation-errors" }, ie = /* @__PURE__ */ B({
+import { defineComponent as G, inject as H, ref as h, watch as J, computed as y, createElementBlock as u, openBlock as n, normalizeClass as Q, createElementVNode as x, createBlock as C, createCommentVNode as E, createVNode as c, renderSlot as P, unref as z, normalizeStyle as X, withDirectives as S, vShow as b, Fragment as D, withCtx as k, renderList as Y, toDisplayString as L, nextTick as A } from "vue";
+import { getNode as _, isNode as ee } from "@formkit/core";
+import { getValidationMessages as te } from "@formkit/validation";
+import { PhExclamationMark as oe } from "@phosphor-icons/vue";
+import { useFormKitSummary as ae } from "../composables/useFormKitSummary.js";
+import d from "../HappyFlowComponents/ui/ButtonV3.vue.js";
+import ne from "../HappyFlowComponents/ui/Card.vue.js";
+import { dpiStepperKey as ie } from "../utils/injectionKeys.js";
+import se from "./TheCancelConfirmationDialog.vue.js";
+import { useEditModeInfo as re } from "../composables/useDpiEditMode.js";
+const le = { class: "step-actions" }, ue = { class: "step-actions__prev-and-next" }, ce = { style: { margin: "0" } }, de = {
+  key: 0,
+  class: "validation-errors"
+}, be = /* @__PURE__ */ G({
   __name: "StepActionsSection",
   props: {
     hideCancel: { type: Boolean, default: !1 },
@@ -15,119 +21,179 @@ const q = { class: "step-actions-container" }, G = { class: "step-actions" }, H
     cancelText: { default: "Abbrechen" },
     previousText: { default: "Zurück" },
     nextText: { default: "Weiter" },
-    nextVariant: { default: "primary" }
+    nextVariant: { default: "primary" },
+    classList: {},
+    loading: { type: Boolean, default: !1 },
+    compact: { type: Boolean, default: !1 },
+    showDetailedErrorSummary: { type: Boolean, default: !1 }
   },
-  setup(U) {
-    const { formValues: C } = J(), e = P(Z);
-    e || console.warn("dpiStepper is not provided. Please use StepActionsSection inside InputPage");
-    function S(t) {
-      return t !== void 0;
+  emits: ["submit", "closeWithSaving"],
+  setup(F, { emit: M }) {
+    const s = F, T = M, t = H(ie);
+    t || console.warn("dpiStepper is not provided. Please use StepActionsSection inside InputPage");
+    const { summaries: W, submit: j } = ae();
+    function N(e) {
+      return e !== void 0;
     }
-    const r = h(!1), a = h([]);
-    function V(t) {
-      if (!t)
-        return;
-      const n = j(t);
-      !n || n.size === 0 || (a.value = [...n.entries()].flatMap(([o, k]) => k.map((w) => String(w.value))));
+    const v = h(!1), f = h(!1), r = h([]);
+    function B() {
+      v.value = !0;
     }
-    e && z(e.activeStep, () => {
-      a.value.splice(0, a.value.length), r.value = !1;
-    });
-    const N = E(e == null ? void 0 : e.steps);
-    function v(t) {
-      var o;
-      const n = (o = N.value) == null ? void 0 : o[t];
-      return n ? n.valid : !1;
+    function p() {
+      t == null || t.goToPreviousStep();
     }
-    function T() {
-      v((e == null ? void 0 : e.activeStep.value) || "") && (e == null || e.goToNextStep());
+    function I(e) {
+      const o = (a) => {
+        for (const l in a.store) {
+          const i = a.store[l];
+          i.type === "error" || i.type === "ui" && l === "incomplete" ? a.store.remove(l) : i.type === "state" && a.store.set({ ...i, value: !1 });
+        }
+      };
+      o(e), e.walk(o);
     }
-    function m() {
-      window.alert("WIP");
+    async function g() {
+      var w, V;
+      if (!N(t))
+        return !1;
+      t.triggerValidationCurrentStep(), await A();
+      const e = t.activeStep.value;
+      if (!e)
+        return !1;
+      const o = _(e);
+      if (!ee(o))
+        return console.error("Current step node is not a FormKitNode", o), !1;
+      await j();
+      const a = te(o), l = !!((V = (w = t.steps) == null ? void 0 : w[e]) != null && V.valid), i = a && a.size > 0 || !l;
+      return i || (I(o), o.clearErrors(!0), f.value = !1, await A()), !i;
     }
-    function s() {
-      e == null || e.goToPreviousStep();
+    J(W, (e) => {
+      e && e.length > 0 ? (f.value = !0, r.value = (e == null ? void 0 : e.map((o) => o.message)) || []) : (f.value = !1, r.value.splice(0, r.value.length));
+    });
+    function K(e, o) {
+      g().then((a) => {
+        a ? e() : o && typeof o == "function" && o();
+      });
     }
-    const b = F(() => e != null && e.activeStep.value ? K(e == null ? void 0 : e.activeStep.value) : null);
-    async function l() {
-      if (!S(e))
-        return;
-      e.triggerValidationCurrentStep(), await $();
-      const t = b.value;
-      if (t ? !v((e == null ? void 0 : e.activeStep.value) || "") : !1) {
-        if (!W(t)) {
-          console.error("Current step node is not a FormKitNode", t);
-          return;
-        }
-        V(t), r.value = !0;
-      }
-      e != null && e.isLast.value ? window.alert(`Form submitted: ${JSON.stringify(C.value, null, 2)}`) : T();
+    function $() {
+      t == null || t.goToNextStep();
     }
-    return (t, n) => (i(), u("div", q, [
-      c("div", G, [
-        g(t.$slots, "default", {
-          handleCancel: m,
-          handlePrevious: s,
-          handleSubmit: l
+    async function m() {
+      !N(t) || !await g() || (t != null && t.isLast.value ? T("submit") : t == null || t.goToNextStep());
+    }
+    const { isEditMode: R } = re();
+    async function O() {
+      !t || !await g() || t == null || t.goToStep(Object.keys(t.steps).pop() || "");
+    }
+    const U = y(() => t ? t == null ? void 0 : t.isLast.value : !0), Z = y(() => [
+      { "step-actions-container--compact": s.compact },
+      s.classList
+    ]), q = y(() => s.showDetailedErrorSummary ? "Fehler" : "Bitte füllen Sie alle Pflichtfelder aus und geben Sie gültige Formate an, bevor Sie fortfahren.");
+    return (e, o) => (n(), u("div", {
+      class: Q([Z.value, "step-actions-container"])
+    }, [
+      x("div", le, [
+        z(R) ? (n(), u(D, { key: 1 }, [
+          U.value ? S((n(), C(d, {
+            key: 1,
+            class: "edit-save-button",
+            size: "large",
+            variant: e.nextVariant,
+            type: "button",
+            "button-text": e.nextText,
+            "icon-end": e.nextText === "Als Entwurf Speichern" ? null : "CaretRight",
+            loading: s.loading,
+            onClick: m
+          }, null, 8, ["variant", "button-text", "icon-end", "loading"])), [
+            [b, !e.hideNext]
+          ]) : (n(), C(d, {
+            key: 0,
+            class: "edit-save-button",
+            size: "large",
+            variant: "primary",
+            type: "button",
+            "button-text": "Speichern",
+            onClick: O
+          }))
+        ], 64)) : P(e.$slots, "default", {
+          key: 0,
+          handleCancel: B,
+          handlePrevious: p,
+          handleSubmit: m
         }, () => [
-          d(f, {
-            style: M({ opacity: t.hideCancel ? 0 : 1 }),
+          c(d, {
+            style: X({ opacity: e.hideCancel ? 0 : 1 }),
             variant: "tertiary",
             size: "large",
             type: "button",
-            "button-text": t.cancelText,
-            onClick: m
+            "button-text": e.cancelText,
+            onClick: B
           }, null, 8, ["style", "button-text"]),
-          c("div", H, [
-            g(t.$slots, "prev-and-next", {
-              hidePrevious: t.hidePrevious,
-              hideNext: t.hideNext,
-              previousText: t.previousText,
-              nextText: t.nextText,
-              handlePrevious: s,
-              handleSubmit: l
+          x("div", ue, [
+            P(e.$slots, "prev-and-next", {
+              hidePrevious: e.hidePrevious,
+              hideNext: e.hideNext,
+              previousText: e.previousText,
+              nextText: e.nextText,
+              handleNext: $,
+              handlePrevious: p,
+              handleSubmit: m,
+              loading: s.loading,
+              validate: K
             }, () => [
-              p(d(f, {
+              S(c(d, {
                 variant: "secondary",
                 size: "large",
                 type: "button",
-                "button-text": t.previousText,
+                "button-text": e.previousText,
                 "icon-start": "CaretLeft",
-                onClick: s
+                onClick: p
               }, null, 8, ["button-text"]), [
-                [y, !t.hidePrevious]
+                [b, !e.hidePrevious]
               ]),
-              p(d(f, {
+              S(c(d, {
                 size: "large",
-                variant: t.nextVariant,
+                variant: e.nextVariant,
                 type: "button",
-                "button-text": t.nextText,
-                "icon-end": "CaretRight",
-                onClick: l
-              }, null, 8, ["variant", "button-text"]), [
-                [y, !t.hideNext]
+                "button-text": e.nextText,
+                "icon-end": e.nextText === "Als Entwurf Speichern" || e.nextText === "Projektanlage starten" ? null : "CaretRight",
+                loading: s.loading,
+                onClick: m
+              }, null, 8, ["variant", "button-text", "icon-end", "loading"]), [
+                [b, !e.hideNext]
               ])
             ], !0)
           ])
         ], !0)
       ]),
-      r.value && a.value.length ? (i(), _(O, {
+      f.value && r.value.length ? (n(), C(ne, {
         key: 0,
-        variant: "error"
+        variant: "error",
+        "icon-top": ""
       }, {
-        title: x(() => n[0] || (n[0] = [
-          R(" Bitte korrigieren Sie die folgenden Fehler ", -1)
-        ])),
-        default: x(() => [
-          c("ul", Q, [
-            (i(!0), u(A, null, D(a.value, (o) => (i(), u("li", { key: o }, L(o), 1))), 128))
-          ])
+        icon: k(() => [
+          c(z(oe), {
+            size: 32,
+            color: "currentColor"
+          })
+        ]),
+        title: k(() => [
+          x("p", ce, L(q.value), 1)
+        ]),
+        default: k(() => [
+          e.showDetailedErrorSummary ? (n(), u("ul", de, [
+            (n(!0), u(D, null, Y(r.value, (a) => (n(), u("li", { key: a }, L(a), 1))), 128))
+          ])) : E("", !0)
         ]),
         _: 1
-      })) : I("", !0)
-    ]));
+      })) : E("", !0),
+      c(se, {
+        modelValue: v.value,
+        "onUpdate:modelValue": o[0] || (o[0] = (a) => v.value = a),
+        onCloseWithSaving: o[1] || (o[1] = (a) => T("closeWithSaving"))
+      }, null, 8, ["modelValue"])
+    ], 2));
   }
 });
 export {
-  ie as default
+  be as default
 };