@piveau/dpi 0.1.0-beta.5

package/dist/data-provider-interface/HappyFlowComponents/ui/DpiModalBase.vue2.js

@@ -0,0 +1,96 @@
+import { defineComponent as v, mergeModels as c, useModel as V, computed as f, createBlock as k, openBlock as _, unref as a, withCtx as i, createVNode as n, createElementVNode as o, renderSlot as d, createElementBlock as B, createCommentVNode as C } from "vue";
+import { TransitionRoot as b, Dialog as y, TransitionChild as m, DialogPanel as M } from "@headlessui/vue";
+import h from "./CrossOutButton.vue.js";
+const $ = { class: "dpiV3_RapModalContainer" }, g = { class: "dpiV3_RapModalInner" }, R = { class: "dpiV3_modalHead" }, w = {
+  key: 0,
+  class: "dpiV3_closeButtonContainer"
+}, D = { class: "dpiV3_modalBody" }, N = { class: "dpiV3_interactionWrap" }, P = /* @__PURE__ */ v({
+  __name: "DpiModalBase",
+  props: /* @__PURE__ */ c({
+    persistent: { type: Boolean }
+  }, {
+    modelValue: { type: Boolean },
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(s) {
+    const l = s, p = V(s, "modelValue"), r = f({
+      get() {
+        return p.value;
+      },
+      set(e) {
+        l.persistent && !e || (p.value = e);
+      }
+    });
+    return (e, t) => (_(), k(a(b), {
+      show: r.value,
+      as: "template"
+    }, {
+      default: i(() => [
+        n(a(y), {
+          onClose: t[1] || (t[1] = (u) => r.value = !1),
+          style: { position: "relative", "z-index": "10000" }
+        }, {
+          default: i(() => [
+            n(a(m), {
+              enter: "dpiV3__backdrop-transition--enter",
+              leave: "dpiV3__backdrop-transition--leave",
+              "enter-from": "dpiV3__backdrop-transition--enter-from",
+              "enter-to": "dpiV3__backdrop-transition--enter-to",
+              "leave-from": "dpiV3__backdrop-transition--leave-from",
+              "leave-to": "dpiV3__backdrop-transition--leave-to"
+            }, {
+              default: i(() => t[2] || (t[2] = [
+                o("div", { class: "dpiV3_backdrop" }, null, -1)
+              ])),
+              _: 1,
+              __: [2]
+            }),
+            o("div", $, [
+              n(a(m), {
+                enter: "dpiV3__modal-transition--enter",
+                leave: "dpiV3__modal-transition--leave",
+                "enter-from": "dpiV3__modal-transition--enter-from",
+                "enter-to": "dpiV3__modal-transition--enter-to",
+                "leave-from": "dpiV3__modal-transition--leave-from",
+                "leave-to": "dpiV3__modal-transition--leave-to"
+              }, {
+                default: i(() => [
+                  n(a(M), { class: "dpiV3_RapModalOuter" }, {
+                    default: i(() => [
+                      o("div", g, [
+                        o("div", R, [
+                          d(e.$slots, "header", {}, void 0, !0),
+                          l.persistent ? C("", !0) : (_(), B("div", w, [
+                            n(h, {
+                              onClick: t[0] || (t[0] = (u) => r.value = !1),
+                              class: "dpiV3_closeButton",
+                              type: "default"
+                            })
+                          ]))
+                        ]),
+                        o("div", D, [
+                          d(e.$slots, "default", {}, void 0, !0)
+                        ])
+                      ]),
+                      o("div", N, [
+                        d(e.$slots, "footer", {}, void 0, !0)
+                      ])
+                    ]),
+                    _: 3
+                  })
+                ]),
+                _: 3
+              })
+            ])
+          ]),
+          _: 3
+        })
+      ]),
+      _: 3
+    }, 8, ["show"]));
+  }
+});
+export {
+  P as default
+};

package/dist/data-provider-interface/HappyFlowComponents/ui/Dropdown.vue.js

@@ -0,0 +1,231 @@
+import { ref as p, computed as K, watch as C, createElementBlock as d, openBlock as r, createBlock as D, createCommentVNode as h, mergeProps as L, unref as B, withKeys as f, withModifiers as V, normalizeStyle as F, normalizeClass as T, createElementVNode as _, Fragment as x, renderList as E, toDisplayString as A, nextTick as N } from "vue";
+import { onClickOutside as $ } from "@vueuse/core";
+import J from "./TextButtonSmall.vue.js";
+import Q from "./MoreButton.vue.js";
+import X from "./InputField.vue.js";
+import { useI18n as Y } from "vue-i18n";
+/* empty css              */
+import Z from "../../../_virtual/_plugin-vue_export-helper.js";
+const ee = { class: "dpiV3_dropdownV3" }, te = {
+  key: 0,
+  class: "dpiV3_loading"
+}, le = {
+  key: 1,
+  class: "dpiV3_empty-state"
+}, ae = {
+  key: 2,
+  class: "dpiV3_dropdown dpiV3_dropdownMulti"
+}, oe = { class: "dpiV3_multiInnerWrap" }, ne = { class: "dpiV3_multiHeader" }, ue = { class: "dpiV3_btnWrap" }, re = ["onClick", "onKeydown", "onKeyup"], de = {
+  key: 0,
+  class: "dpiV3_multiSeperator"
+}, se = {
+  key: 3,
+  class: "dpiV3_dropdown"
+}, ie = ["onClick", "onKeydown", "onKeyup"], ce = {
+  __name: "Dropdown",
+  props: {
+    buttonText: {
+      type: String,
+      required: !0
+    },
+    text: {
+      type: String,
+      required: !0
+    },
+    type: {
+      type: String,
+      required: !0
+    },
+    data: {
+      type: Object,
+      required: !0
+    },
+    multi: {
+      type: Boolean
+    },
+    alignment: {
+      type: Boolean
+    },
+    inputFieldProps: {
+      type: Object,
+      default: () => ({})
+    },
+    dropdownWidth: {
+      type: String,
+      default: "medium",
+      validator: (k) => ["medium", "large"].includes(k)
+    },
+    isDisabled: {
+      type: Boolean,
+      default: !1
+    },
+    autocomplete: {
+      type: Boolean,
+      default: !1
+    },
+    modelValue: { type: String, default: "" },
+    loading: { type: Boolean, default: !1 }
+    // Loading prop from parent
+  },
+  emits: ["update:modelValue", "input", "deleteDropdownField", "valueSent", "chosenVocItem", "clickOutside"],
+  setup(k, { emit: I }) {
+    const { t: q } = Y(), w = p();
+    p("#0172AD");
+    let u = p(!1);
+    const v = p({});
+    p([]);
+    const n = p(0), b = p(!1), g = I, M = (t) => q("message.dataupload.datasets.dcatde:politicalGeocodingURI.titles." + t), a = k, S = K(() => {
+      if (a.multi) {
+        if (!a.data || !Array.isArray(a.data) || a.data.length === 0)
+          return !0;
+        for (const t of a.data)
+          if (t.list && t.list.length > 0)
+            return !1;
+        return !0;
+      } else
+        return !a.data || !Array.isArray(a.data) || a.data.length === 0;
+    });
+    C(() => a.loading, (t) => {
+      b.value = t;
+    });
+    const s = p(a.modelValue);
+    C(() => a.modelValue, (t) => {
+      s.value = t;
+    });
+    const U = () => {
+      y(), g("deleteDropdownField");
+    }, W = (t) => {
+      s.value = t.target.value, N(() => {
+        g("input", s.value);
+      }), a.autocomplete && s.value.length > 0 ? u.value = !0 : s.value.length === 0 && (u.value = !1);
+    }, O = K(() => {
+      if (!a.autocomplete)
+        return a.dropdownWidth === "large" ? "100%" : "161px";
+    }), y = (t) => {
+      a.autocomplete || a.isDisabled || (u.value = !u.value);
+    }, j = (t) => {
+      if (u.value && !b.value && !S.value) {
+        n.value--;
+        const e = Array.from(
+          document.querySelectorAll(".dpiV3_dropdown button")
+        );
+        e.length > 0 && (t.preventDefault(), n.value = (n.value + 1) % e.length, e[n.value].focus());
+      }
+    }, m = (t, e) => {
+      e.preventDefault(), (e.key === "Enter" || e.key === " " || e.key === "Spacebar") && (n.value = 0, v.value[t] || (v.value[t] = {}), v.value[t] = "var(--neutral-10, #fafafb)"), e.key === "Escape" && (n.value = 0, u.value = !u.value);
+      const l = Array.from(
+        document.querySelectorAll(".dpiV3_dropdownMulti .dpiV3_btnWrap button")
+      ), c = l.findIndex((o) => o === document.activeElement);
+      if (e.key === "ArrowDown") {
+        e.preventDefault();
+        const o = (c + 1) % l.length;
+        l[o].focus(), n.value = o;
+      } else if (e.key === "ArrowUp") {
+        e.preventDefault();
+        const o = (c - 1 + l.length) % l.length;
+        l[o].focus(), n.value = o;
+      }
+    }, P = (t, e) => {
+      e.preventDefault(), (e.key === "Enter" || e.key === " " || e.key === "Spacebar") && (a.data.forEach((l) => {
+        for (let c in l)
+          l[c].forEach((o) => {
+            o.selected = !1;
+          });
+      }), t.selected = !t.selected, s.value = t["@value"], u.value = !1);
+    }, R = (t, e) => {
+      e.preventDefault(), (e.key === "Enter" || e.key === " " || e.key === "Spacebar") && (v.value[t["@value"]] = "var(--neutral-10, #f1f1f3)", n.value = 0), e.key === "Escape" && (n.value = 0, u.value = !u.value);
+      const l = Array.from(document.querySelectorAll(".dpiV3_dropdown button"));
+      e.key === "ArrowDown" ? (e.preventDefault(), n.value = (n.value + 1) % l.length, l[n.value].focus()) : e.key === "ArrowUp" || e.key === "Tab" && e.shiftKey ? (e.preventDefault(), n.value = (n.value - 1 + l.length) % l.length, l[n.value].focus()) : e.key === "Tab" && (e.preventDefault(), n.value = (n.value + 1) % l.length, l[n.value].focus());
+    }, z = (t, e) => {
+      e.preventDefault(), (e.key === "Enter" || e.key === " " || e.key === "Spacebar") && (a.data.forEach((l) => {
+        l.selected = !1;
+      }), t.selected = !t.selected, v.value[t["@value"]] = "var(--neutral-5, #fafafb)", s.value = t["@value"], u.value = !1);
+    }, G = (t, e, l) => {
+      g("valueSent", t, l), s.value = t.alt_label.de + " (" + l + ")", u.value = !1;
+    }, H = (t, e) => {
+      e.type === "keydown" && e.preventDefault(), e.type === "click" && (a.multi ? (a.data.forEach((l) => {
+        for (let c in l)
+          l[c].forEach((o) => {
+            o.selected = !1;
+          });
+      }), s.value = t["@value"], t.selected = !t.selected) : (a.data.forEach((l) => {
+        l.selected = !1;
+      }), t.selected = !t.selected, s.value = t["@value"]), u.value = !1, t["@value"] === void 0 && (s.value = t.pref_label.de || t.pref_label.en, g("chosenVocItem", t)), g("update:modelValue", t["@value"], t));
+    };
+    return $(w, (t) => {
+      u.value = !1;
+    }), (t, e) => (r(), d("div", ee, [
+      a.type === "textButtonSmall" ? (r(), D(J, {
+        key: 0,
+        buttonText: a.buttonText,
+        onClick: y,
+        ref_key: "accActive",
+        ref: w
+      }, null, 8, ["buttonText"])) : h("", !0),
+      a.type === "moreButton" ? (r(), D(Q, {
+        key: 1,
+        onClick: y,
+        ref_key: "accActive",
+        ref: w
+      }, null, 512)) : h("", !0),
+      a.type === "inputField" ? (r(), D(X, L({ key: 2 }, a.inputFieldProps, {
+        onClick: y,
+        onKeydown: [
+          f(V(y, ["prevent"]), ["space"]),
+          f(y, ["enter"]),
+          f(V(j, ["prevent"]), ["arrow-down"])
+        ],
+        onInput: W,
+        onDeleteButtonClicked: U,
+        modelValue: s.value,
+        dropDownExpanded: B(u),
+        ref_key: "accActive",
+        ref: w
+      }), null, 16, ["onKeydown", "modelValue", "dropDownExpanded"])) : h("", !0),
+      B(u) ? (r(), d("div", {
+        key: 3,
+        class: T(["dpiV3_dropdownWrapper", {
+          alignRight: a.alignment === "right"
+        }]),
+        style: F({ width: O.value })
+      }, [
+        b.value ? (r(), d("div", te, e[0] || (e[0] = [
+          _("div", { class: "dpiV3_loading-spinner" }, null, -1),
+          _("span", null, "Daten werden geladen...", -1)
+        ]))) : S.value ? (r(), d("div", le, e[1] || (e[1] = [
+          _("span", null, "Keine Ergebnisse gefunden", -1)
+        ]))) : a.multi ? (r(), d("ul", ae, [
+          (r(!0), d(x, null, E(k.data, (l, c) => (r(), d("div", oe, [
+            _("div", ne, A(t.$t("message.dataupload.datasets.dcatde:politicalGeocodingURI.titles." + l.headers)), 1),
+            (r(!0), d(x, null, E(l.list, (o, pe) => (r(), d("div", ue, [
+              _("button", {
+                onClick: (i) => G(o, i, M(l.headers)),
+                onKeydown: [
+                  f((i) => m(o, i), ["enter"]),
+                  f(V((i) => m(o, i), ["prevent"]), ["space"]),
+                  f((i) => m(o, i), ["arrow-down"]),
+                  f((i) => m(o, i), ["arrow-up"])
+                ],
+                onKeyup: (i) => P(o, i)
+              }, A(o.alt_label.de), 41, re)
+            ]))), 256)),
+            c - 1 != Object.values(l).length ? (r(), d("div", de)) : h("", !0)
+          ]))), 256))
+        ])) : (r(), d("ul", se, [
+          (r(!0), d(x, null, E(k.data, (l, c) => (r(), d("button", {
+            onClick: (o) => H(l, o),
+            onKeydown: (o) => R(l, o),
+            onKeyup: (o) => z(l, o),
+            class: T({ dpiV3_selected: l.selected }),
+            style: F({
+              background: v.value[l["@value"]] || "initial"
+            })
+          }, A(l["@value"] || l.pref_label.de), 47, ie))), 256))
+        ]))
+      ], 6)) : h("", !0)
+    ]));
+  }
+}, me = /* @__PURE__ */ Z(ce, [["__scopeId", "data-v-ed0325fe"]]);
+export {
+  me as default
+};

package/dist/data-provider-interface/HappyFlowComponents/ui/Illustration.vue.js

@@ -0,0 +1,33 @@
+import { createElementBlock as t, openBlock as e, createCommentVNode as o } from "vue";
+import s from "../img/IllustrationCelebrate.svg.js";
+import a from "../img/IllustrationStart.svg.js";
+/* empty css                  */
+import i from "../../../_virtual/_plugin-vue_export-helper.js";
+const l = { class: "dpiV3_illustration-wrapper" }, c = {
+  key: 0,
+  class: "dpiV3_illustration-celebrate-svg",
+  src: s,
+  alt: "Celebrate Illustration"
+}, n = {
+  key: 1,
+  class: "dpiV3_illustration-start-svg",
+  src: a,
+  alt: "Start Illustration"
+}, m = {
+  __name: "Illustration",
+  props: {
+    illustrationName: {
+      type: String,
+      default: "celebrate"
+    }
+  },
+  setup(r) {
+    return (_, p) => (e(), t("div", l, [
+      r.illustrationName === "celebrate" ? (e(), t("img", c)) : o("", !0),
+      r.illustrationName === "start" ? (e(), t("img", n)) : o("", !0)
+    ]));
+  }
+}, I = /* @__PURE__ */ i(m, [["__scopeId", "data-v-e7bfe795"]]);
+export {
+  I as default
+};