@piveau/piveau-hub-ui-modules 3.18.0

package/dist/data-provider-interface/DataProviderInterface.vue.mjs

@@ -0,0 +1,138 @@
+import { mapGetters as a, mapActions as i } from "vuex";
+import r from "vue-step-progress/dist/vue-step-progress.min.js";
+import "vue-step-progress/dist/main.css";
+import o from "./components/Navigation.vue.mjs";
+import "./DataProviderInterface.vue2.mjs";
+import n from "../_virtual/_plugin-vue2_normalizer.mjs";
+console.log("stepprogress = ", r);
+const p = {
+  name: "DataProviderInterface",
+  dependencies: [],
+  components: {
+    StepProgress: r.default || r,
+    Navigation: o
+  },
+  props: ["name"],
+  metaInfo() {
+    return {
+      title: `${this.$t("message.metadata.upload")} | ${this.$t("message.header.navigation.data.datasets")}`,
+      meta: [
+        { name: "description", vmid: "description", content: `${this.$t("message.datasets.meta.description")}` },
+        { name: "keywords", vmid: "keywords", content: `${this.$env.metadata.keywords} ${this.$t("message.datasets.meta.description")}}` },
+        { name: "robots", content: "noindex, follow" }
+      ]
+    };
+  },
+  data() {
+    return {
+      property: this.$route.params.property,
+      page: this.$route.params.page,
+      id: this.$route.params.id
+    };
+  },
+  computed: {
+    ...a("auth", [
+      "getIsEditMode"
+    ]),
+    ...a("dpiStore", [
+      "getNavSteps"
+    ]),
+    steps() {
+      return this.getNavSteps;
+    },
+    mode() {
+      return this.property === "catalogues" ? this.getIsEditMode ? this.$t("message.dataupload.menu.editCatalogue") : this.$t("message.dataupload.createNewCatalogue") : this.property === "datasets" ? this.getIsEditMode ? this.$t("message.dataupload.menu.editDataset") : this.$t("message.dataupload.createNewDataset") : "Edit Distribution";
+    },
+    isOverviewPage() {
+      return this.$route.name === "DataProviderInterface-Overview";
+    },
+    isDistributionOverview() {
+      return this.page === "distoverview";
+    },
+    stepNames() {
+      return this.getTranslatedStepNamesByProperty(this.property);
+    },
+    getCurrentStep() {
+      return this.$route.path.includes("/overview") ? this.steps[this.property].indexOf("overview") : this.steps[this.property].indexOf(this.page);
+    },
+    datasetStepNames() {
+      return this.getTranslatedStepNamesByProperty("datasets");
+    },
+    showDatasetStepper() {
+      return this.property === "distributions";
+    }
+  },
+  methods: {
+    ...i("dpiStore", [
+      "saveLocalstorageValues"
+    ]),
+    ...i("auth", [
+      "populateDraftAndEdit"
+    ]),
+    getTranslatedStepNamesByProperty(e) {
+      const t = this.steps[e].map((s) => this.$t(`message.dataupload.${e}.stepper.${s}.name`));
+      if (e !== "distributions") {
+        const s = t.length - 1;
+        t[s] = this.$t(`message.dataupload.${e}.stepper.overview`);
+      }
+      return t;
+    },
+    clearStorageAndValues() {
+      this.$refs.view.clear(), this.getClearPath().startsWith(this.$route.path) ? this.$router.go() : this.jumpToFirstPage();
+    },
+    getClearPath() {
+      let e, t;
+      return this.property === "distributions" ? (e = this.getNavSteps.datasets[0], t = `${this.$env.content.dataProviderInterface.basePath}/datasets/${e}?locale=${this.$i18n.locale}&clear=true`) : (e = this.getNavSteps[this.property][0], t = `${this.$env.content.dataProviderInterface.basePath}/${this.property}/${e}?locale=${this.$i18n.locale}&clear=true`), t;
+    },
+    jumpToFirstPage() {
+      this.$router.push(this.getClearPath()).catch(() => {
+      });
+    },
+    addStepperLinks() {
+      document.querySelectorAll("#stepper .step-progress__step-label").forEach((e, t) => {
+        this.getNavSteps[this.property][t] === "overview" ? e.onclick = () => this.$router.push(`${this.$env.content.dataProviderInterface.basePath}/${this.property}/overview?locale=${this.$i18n.locale}`).catch(() => {
+        }) : this.getNavSteps[this.property][t] === "distoverview" ? this.property === "datasets" ? e.onclick = () => this.$router.push(`${this.$env.content.dataProviderInterface.basePath}/datasets/distoverview?locale=${this.$i18n.locale}`).catch(() => {
+        }) : this.property === "distributions" && (e.onclick = () => this.$router.push(`${this.$env.content.dataProviderInterface.basePath}/${this.property}/distoverview/${this.id}?locale=${this.$i18n.locale}`).catch(() => {
+        })) : this.property === "distributions" ? e.onclick = () => this.$router.push(`${this.$env.content.dataProviderInterface.basePath}/${this.property}/${this.getNavSteps[this.property][t]}/${this.id}?locale=${this.$i18n.locale}`).catch(() => {
+        }) : e.onclick = () => this.$router.push(`${this.$env.content.dataProviderInterface.basePath}/${this.property}/${this.getNavSteps[this.property][t]}?locale=${this.$i18n.locale}`).catch(() => {
+        });
+      }), document.querySelectorAll("#subStepper .step-progress__step-label").forEach((e, t) => {
+        e.onclick = () => this.$router.push(`${this.$env.content.dataProviderInterface.basePath}/datasets/${this.getNavSteps.datasets[t]}?locale=${this.$i18n.locale}`).catch(() => {
+        });
+      });
+    },
+    handleScroll() {
+      try {
+        document.getElementById("stepperAnchor").offsetTop >= 35 ? document.getElementById("stepperAnchor").classList.add("border-bottom-lightgray") : document.getElementById("stepperAnchor").classList.remove("border-bottom-lightgray");
+      } catch {
+      }
+    }
+  },
+  created() {
+    window.addEventListener("scroll", this.handleScroll), this.populateDraftAndEdit();
+  },
+  mounted() {
+    this.addStepperLinks(), this.saveLocalstorageValues(this.property);
+  },
+  unmounted() {
+    window.removeEventListener("scroll", this.handleScroll);
+  }
+};
+var d = function() {
+  var t = this, s = t._self._c;
+  return s("div", { key: t.property, staticClass: "d-flex flex-column bg-transparent container-fluid justify-content-between dpi position-relative" }, [s("div", { staticClass: "stickyStepper", attrs: { id: "stepperAnchor" } }, [s("div", { staticClass: "SSfirstRow" }, [s("h1", { staticClass: "small-headline ml-1 my-0" }, [t._v(t._s(t.mode))]), t._v(" "), s("Navigation", { staticClass: "w-100 stickyNav", on: { clearStorage: t.clearStorageAndValues } })], 1), t._v(" "), t.property !== "distributions" ? s("StepProgress", { attrs: { id: "stepper", "line-thickness": 1, steps: t.stepNames, "current-step": t.getCurrentStep, "active-color": "#001d85", "active-thickness": 20, "passive-thickness": 20 } }) : t._e(), t._v(" "), t.property === "distributions" ? s("StepProgress", { attrs: { id: "subStepper", "line-thickness": 1, steps: t.datasetStepNames, "current-step": 3, "active-color": "#001d85", "active-thickness": 20, "passive-thickness": 20 } }) : t._e(), t._v(" "), t.property === "distributions" ? s("div", { attrs: { id: "subStepperBox" } }, [t.showDatasetStepper ? s("StepProgress", { attrs: { id: "stepper", steps: t.stepNames, "current-step": t.getCurrentStep, "active-color": "#343434", "line-thickness": 1, "active-thickness": 20, "passive-thickness": 20 } }) : t._e()], 1) : t._e()], 1), t._v(" "), s("router-view", { key: t.$route.query.edit, ref: "view", attrs: { isDistributionOverview: t.isDistributionOverview } })], 1);
+}, c = [], h = /* @__PURE__ */ n(
+  p,
+  d,
+  c,
+  !1,
+  null,
+  null,
+  null,
+  null
+);
+const f = h.exports;
+export {
+  f as default
+};
+//# sourceMappingURL=DataProviderInterface.vue.mjs.map

package/dist/data-provider-interface/DataProviderInterface.vue.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataProviderInterface.vue.mjs","sources":["../../lib/data-provider-interface/DataProviderInterface.vue"],"sourcesContent":["<template>\n  <div class=\"d-flex flex-column bg-transparent container-fluid justify-content-between dpi position-relative\" :key=\"property\">\n    <!-- TOP -->\n    <div id=\"stepperAnchor\" class=\"stickyStepper\">\n      <div class=\"SSfirstRow\">\n        <h1 class=\"small-headline ml-1 my-0\">{{ mode }}</h1>\n        <Navigation @clearStorage=\"clearStorageAndValues\" class=\"w-100 stickyNav\"></Navigation>\n\n      </div>\n\n      <!-- if current form is distribution form the main stepper for datasets should be shown also-->\n      <StepProgress id=\"stepper\" v-if=\"property !== 'distributions'\" :line-thickness=\"1\" :steps=\"stepNames\"\n        :current-step=\"getCurrentStep\" active-color=\"#001d85\" :active-thickness=\"20\" :passive-thickness=\"20\">\n      </StepProgress>\n\n      <StepProgress id=\"subStepper\" v-if=\"property === 'distributions'\" :line-thickness=\"1\" :steps=\"datasetStepNames\"\n        :current-step=\"3\" active-color=\"#001d85\" :active-thickness=\"20\" :passive-thickness=\"20\">\n      </StepProgress>\n      \n      <div id=\"subStepperBox\" v-if=\"property === 'distributions'\">\n        \n        <StepProgress id=\"stepper\" v-if=\"showDatasetStepper\" :steps=\"stepNames\" :current-step=\"getCurrentStep\"\n          active-color=\"#343434\" :line-thickness=\"1\" :active-thickness=\"20\" :passive-thickness=\"20\">\n        </StepProgress>\n      </div>\n    </div>\n    <!-- CONTENT -->\n    <router-view :isDistributionOverview=\"isDistributionOverview\" ref=\"view\" :key=\"$route.query.edit\">\n      \n    </router-view>\n    <!-- BOTTOM -->\n    <!-- <div>\n      <Navigation @clearStorage=\"clearStorageAndValues\"></Navigation>\n    </div> -->\n  </div>\n</template>\n\n<script>\n/* eslint-disable no-nested-ternary, no-lonely-if, no-param-reassign */\nimport { mapActions, mapGetters } from 'vuex';\nimport StepProgress from 'vue-step-progress/dist/vue-step-progress.min.js';\nimport 'vue-step-progress/dist/main.css';\nimport Navigation from './components/Navigation';\n\nconsole.log('stepprogress = ', StepProgress);\n\nexport default {\n  name: 'DataProviderInterface',\n  dependencies: [],\n  components: {\n    StepProgress: StepProgress.default || StepProgress,\n    Navigation,\n  },\n  props: ['name'],\n  metaInfo() {\n    return {\n      title: `${this.$t('message.metadata.upload')} | ${this.$t('message.header.navigation.data.datasets')}`,\n      meta: [\n        { name: 'description', vmid: 'description', content: `${this.$t('message.datasets.meta.description')}` },\n        { name: 'keywords', vmid: 'keywords', content: `${this.$env.metadata.keywords} ${this.$t('message.datasets.meta.description')}}` },\n        { name: 'robots', content: 'noindex, follow' },\n      ],\n    };\n  },\n  data() {\n    return {\n      property: this.$route.params.property,\n      page: this.$route.params.page,\n      id: this.$route.params.id,\n    };\n  },\n  computed: {\n    ...mapGetters('auth', [\n      'getIsEditMode',\n    ]),\n    ...mapGetters('dpiStore', [\n      'getNavSteps',\n    ]),\n    steps() {\n      return this.getNavSteps;\n    },\n    mode() {\n      return this.property === 'catalogues'\n        ? this.getIsEditMode\n          ? this.$t('message.dataupload.menu.editCatalogue')\n          : this.$t('message.dataupload.createNewCatalogue')\n        : this.property === 'datasets'\n          ? this.getIsEditMode\n            ? this.$t('message.dataupload.menu.editDataset')\n            : this.$t('message.dataupload.createNewDataset')\n          : 'Edit Distribution';\n    },\n    isOverviewPage() {\n      return this.$route.name === 'DataProviderInterface-Overview';\n    },\n    isDistributionOverview() {\n      return this.page === 'distoverview';\n    },\n    stepNames() {\n      return this.getTranslatedStepNamesByProperty(this.property);\n    },\n    getCurrentStep() {\n      // for some reason overview is not set as page property so must be read from path\n      if (this.$route.path.includes('/overview')) {\n        return this.steps[this.property].indexOf('overview');\n      } else {\n        return this.steps[this.property].indexOf(this.page);\n      }\n    },\n    datasetStepNames() {\n      return this.getTranslatedStepNamesByProperty('datasets');\n    },\n    showDatasetStepper() {\n      return this.property === 'distributions';\n    },\n  },\n  methods: {\n    ...mapActions('dpiStore', [\n      'saveLocalstorageValues',\n    ]),\n    ...mapActions('auth', [\n      'populateDraftAndEdit',\n    ]),\n    getTranslatedStepNamesByProperty(property) {\n      const names = this.steps[property].map(s => this.$t(`message.dataupload.${property}.stepper.${s}.name`));\n      if (property !== 'distributions') {\n        // use correct translation for overview page\n        const overviewIndex = names.length - 1;\n        names[overviewIndex] = this.$t(`message.dataupload.${property}.stepper.overview`);\n      }\n      return names;\n    },\n    clearStorageAndValues() {\n      // Clear storage\n      // 1. Clear form values\n      // 2. Clear store values\n      // 3, Clear local storage\n      this.$refs.view.clear();\n\n      // Jump to first page and compare path start because of possible query params\n      if (!this.getClearPath().startsWith(this.$route.path)) {\n        this.jumpToFirstPage();\n      } else {\n        // Hacky solution which accepts a reload to solve the datasetID and preselected languages bug\n        // --> Should be replaced if built-in functionality works\n        // this.$formulate.resetValidation('form');\n        this.$router.go();\n      }\n    },\n    getClearPath() {\n      // Create path to first page with clear query param\n      let firstStep;\n      let path;\n\n      if (this.property === 'distributions') {\n        firstStep = this.getNavSteps.datasets[0];\n        path = `${this.$env.content.dataProviderInterface.basePath}/datasets/${firstStep}?locale=${this.$i18n.locale}&clear=true`;\n      } else {\n        firstStep = this.getNavSteps[this.property][0];\n        path = `${this.$env.content.dataProviderInterface.basePath}/${this.property}/${firstStep}?locale=${this.$i18n.locale}&clear=true`;\n      }\n      return path;\n    },\n    jumpToFirstPage() {\n      this.$router.push(this.getClearPath()).catch(() => { });\n    },\n    addStepperLinks() {\n      // Direct stepper access - hacky solution\n      document.querySelectorAll('#stepper .step-progress__step-label').forEach((s, i) => {\n\n        if (this.getNavSteps[this.property][i] === 'overview') {\n          // only datasets and catalogues have an overview page\n          s.onclick = () => this.$router.push(`${this.$env.content.dataProviderInterface.basePath}/${this.property}/overview?locale=${this.$i18n.locale}`).catch(() => { });\n        } else if (this.getNavSteps[this.property][i] === 'distoverview') {\n          // only datasets and distributions have a distoverview page\n          if (this.property === 'datasets') {\n            s.onclick = () => this.$router.push(`${this.$env.content.dataProviderInterface.basePath}/datasets/distoverview?locale=${this.$i18n.locale}`).catch(() => { });\n          } else if (this.property === 'distributions') {\n            // distribution overview page should have distribution index for back navigation to distirbutions\n            s.onclick = () => this.$router.push(`${this.$env.content.dataProviderInterface.basePath}/${this.property}/distoverview/${this.id}?locale=${this.$i18n.locale}`).catch(() => { });\n          }\n        } else {\n          if (this.property === 'distributions') {\n            // id of distribution needed within navigation\n            s.onclick = () => this.$router.push(`${this.$env.content.dataProviderInterface.basePath}/${this.property}/${this.getNavSteps[this.property][i]}/${this.id}?locale=${this.$i18n.locale}`).catch(() => { });\n          } else {\n            s.onclick = () => this.$router.push(`${this.$env.content.dataProviderInterface.basePath}/${this.property}/${this.getNavSteps[this.property][i]}?locale=${this.$i18n.locale}`).catch(() => { });\n          }\n        }\n      });\n      // stepper links for dataset stepper when distribution form is currently on display\n      document.querySelectorAll('#subStepper .step-progress__step-label').forEach((s, i) => {\n        s.onclick = () => this.$router.push(`${this.$env.content.dataProviderInterface.basePath}/datasets/${this.getNavSteps['datasets'][i]}?locale=${this.$i18n.locale}`).catch(() => { });\n      });\n    },\n    handleScroll() {\n      try {\n        if (document.getElementById(\"stepperAnchor\").offsetTop >= 35) {\n          document.getElementById(\"stepperAnchor\").classList.add(\"border-bottom-lightgray\");\n        }\n        else {\n          document.getElementById(\"stepperAnchor\").classList.remove(\"border-bottom-lightgray\");\n        }\n      } catch (error) {\n      }\n    }\n\n  },\n  created() {\n    window.addEventListener('scroll', this.handleScroll);\n    this.populateDraftAndEdit();\n  },\n  mounted() {\n    this.addStepperLinks();\n    this.saveLocalstorageValues(this.property);\n  },\n  unmounted() {\n    window.removeEventListener('scroll', this.handleScroll);\n  },\n};\n</script>\n\n<style lang=\"scss\">\n.border-bottom-lightgray {\n  border-bottom: 1px solid lightgray;\n}\n.stickyStepper {\n  position: sticky;\n  top: 0;\n  background: #ffffff;\n  z-index: 10;\n}\n\n.stickyStepper .SSfirstRow {\n  margin: 1vh 0;\n  display: flex;\n  align-items: center;\n}\n\n.stickyStepper .stickyNav {\n  border-left: 1px solid black;\n  margin-left: 1vh;\n  padding-left: 1vh;\n}\n\n#stepper {\n  width: 100% !important;\n}\n\n#input {\n  padding: 10px;\n}\n\n.small-headline {\n  font-size: 1.5rem;\n  min-width: max-content;\n}\n\n.property {\n  margin: 20px;\n  background-color: #ffffff;\n  border: solid 0.5px rgb(225, 225, 225);\n  margin-top: 30px;\n}\n\n.infoBox .material-icons {\n  font-size: 20px;\n  vertical-align: text-bottom;\n  margin-right: 5px;\n  margin-bottom: 1px;\n}\n\n.infoBox {\n  width: 100%;\n  height: 30%;\n  background-color: #f7f7f7;\n  padding: 5%;\n  border-radius: 0.25rem;\n  margin-top: 20px;\n\n  .input_subpage_nav {\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n    padding: 15px;\n  }\n}\n\n.besides {\n  .formulate-input-group-repeatable {\n    display: flex;\n    flex-direction: row;\n    background-color: transparent;\n    padding: 0px;\n  }\n}\n\n.main {\n  width: 75%;\n  margin: 0 5px 0 5px;\n}\n\n.sub {\n  width: 20%;\n  margin: 0 5px 0 5px;\n}\n\n#subStepperBox {\n  position: sticky;\n  top: 154px;\n  z-index: 10;\n  width: 100%;\n  padding: 0 10%;\n\n  .step-progress__bar {\n    border-top: none !important;\n  }\n\n  .step-progress__step--active {\n    .step-progress__step-label {\n      background-color: lightsteelblue !important;\n    }\n\n  }\n}\n\n.step-progress__step span{\n  \n    color:white !important;\n  \n}\n// Stepper Customizing -------------\n\n// #stepper,\n// #subStepper {\n//   .step-progress__step {\n//     display: flex;\n//     align-items: center;\n//     justify-content: center;\n//     height: 70%;\n//     width: 20%;\n//     display: flex;\n//     align-items: center;\n//     z-index: 1;\n\n\n//     span {\n//       color: grey;\n//       font-size: 18px;\n//       display: none;\n//     }\n\n//     div {\n//       padding: 1rem;\n//       height: 100%;\n//       display: flex;\n//       align-items: center;\n//       color: white;\n//       font-weight: 300;\n\n//     }\n\n//     .step-progress__step-label {\n\n//       background: lightgrey;\n//       background-size: 400% 400%;\n//       background-position: 100% 0%;\n//       transition: all 300ms ease-in-out;\n//       border-right: 1px white solid;\n//       font-size: 14px;\n//       display: flex;\n//       align-items: center;\n//       justify-content: center;\n\n\n//     }\n\n\n//     .step-progress__step-label:hover {\n//       background-position: 65% 0%;\n//       color: black;\n\n//     }\n\n//   }\n\n//   .step-progress__step--active {\n\n//     z-index: 7 !important;\n\n\n//     span {\n//       color: black;\n//     }\n\n//     div {\n//       background: white;\n//     }\n\n//     .step-progress__step-label {\n//       background: rgb(236, 236, 236);\n//       background-position: 50% 0%;\n//       box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12) !important;\n//       transform: scale(1.1);\n//       z-index: 8;\n//       font-size: 16px;\n//     }\n\n//   }\n\n//   .step-progress__step--valid {\n//     div {\n//       color: white;\n\n//     }\n\n//     .step-progress__step-label {\n//       background: rgba(0, 235, 0, 0.2);\n//       color: lightslategrey;\n\n\n//     }\n\n//     .step-progress__step-label:hover {\n//       color: black;\n//     }\n//   }\n\n//   .step-progress__step--active .step-progress__step-label {\n//     color: rgb(31, 31, 31);\n//   }\n\n//   .step-progress__wrapper-after {\n//     display: none;\n//   }\n\n//   .step-progress__step-icon {\n//     display: none !important;\n//   }\n\n//   .step-progress__bar {\n//     margin: 0;\n//     height: 5rem;\n//     border-top: 1px solid lightslategray;\n\n//   }\n\n//   .step-progress__step-label {\n//     position: unset;\n//     transform: unset;\n//     flex-grow: 1;\n//   }\n\n//   .step-progress__step {}\n\n//   .step-progress__wrapper-before {\n//     display: none !important;\n//   }\n\n//   #stepper .step-progress__step::after {\n//     display: none !important;\n//   }\n// }\n#stepper .step-progress__step{\n  border: solid white 20px;\n}\n#stepper .step-progress__step-icon, #subStepper .step-progress__step-icon {\n    font-size: 25px;\n}\n.step-progress__step-label{\n  cursor: pointer;\n}\n// Input Form Margins & Borders ----\n\n.formulate-input[data-classification=group] [data-is-repeatable] {\n  border: none;\n  padding: 1em 1em 1em 0em;\n}\n\n.formulate-input[data-classification=group] [data-is-repeatable] .formulate-input-group-repeatable {\n  border-bottom: none;\n}\n\n.formulate-input-element--checkbox {\n  margin-right: 5px;\n}\n\n.formulate-input-wrapper {\n  font-family: \"Ubuntu\";\n}\n\n.formulate-input[data-classification=button] button[data-ghost] {\n  font-weight: 400;\n}\n\n.formulate-input-error {\n  color: #e13737 !important;\n  font-weight: 400 !important;\n}\n\n// General Formulate Styling ----\n\n.formulate {\n  &-input {\n    .formulate {\n      &-input {\n        &-element {\n          max-width: 100%;\n        }\n\n        &-error {\n          font-weight: bold;\n        }\n      }\n    }\n  }\n\n  .formulate-input-group-add-more {\n    display: flex;\n    justify-content: flex-end;\n\n    button {\n      border: black;\n    }\n  }\n\n  .formulate-input {\n    &[data-classification=\"text\"] .formulate-input-wrapper {\n      display: flex;\n      flex-direction: column;\n    }\n\n    &[data-classification=\"select\"] .formulate-input-wrapper {\n      display: flex;\n      flex-direction: column;\n    }\n  }\n\n  .formulate-input[data-classification=\"button\"] {\n    button {\n      &[data-ghost] {\n        color: white;\n        background-color: #001d85;\n        border-color: #001d85;\n        border-radius: 1.875rem;\n\n        &:hover {\n          background-color: #196fd2;\n          border-color: #196fd2;\n        }\n      }\n    }\n  }\n}\n\n.formulate-input.besides {\n  border-bottom: 1px solid lightgrey !important;\n}\n\n.formulate-input-label {\n  font-weight: 500 !important;\n}\n\n.formulate-input-element {\n\n  &--textarea {\n    width: 100%;\n  }\n}\n\n.formulate-input-element--group {\n  display: block !important;\n}\n\n.formulate-input.besides>.formulate-input-wrapper>.formulate-input-label {\n\n\n  text-decoration: underline !important;\n}\n\n// #stepper,\n// #subStepper {\n\n\n//   .step-progress__step::after {\n//     display: none;\n//   }\n\n//   .step-progress__step-label {\n//     cursor: pointer;\n//   }\n// }\n</style>\n"],"names":["StepProgress","_sfc_main","Navigation","mapGetters","mapActions","property","names","overviewIndex","firstStep","path","s","i"],"mappings":";;;;;;AA4CA,QAAA,IAAA,mBAAAA,CAAA;AAEA,MAAAC,IAAA;AAAA,EACA,MAAA;AAAA,EACA,cAAA,CAAA;AAAA,EACA,YAAA;AAAA,IACA,cAAAD,EAAA,WAAAA;AAAA,IACA,YAAAE;AAAA,EACA;AAAA,EACA,OAAA,CAAA,MAAA;AAAA,EACA,WAAA;AACA,WAAA;AAAA,MACA,OAAA,GAAA,KAAA,GAAA,yBAAA,CAAA,MAAA,KAAA,GAAA,yCAAA,CAAA;AAAA,MACA,MAAA;AAAA,QACA,EAAA,MAAA,eAAA,MAAA,eAAA,SAAA,GAAA,KAAA,GAAA,mCAAA,CAAA,GAAA;AAAA,QACA,EAAA,MAAA,YAAA,MAAA,YAAA,SAAA,GAAA,KAAA,KAAA,SAAA,QAAA,IAAA,KAAA,GAAA,mCAAA,CAAA,IAAA;AAAA,QACA,EAAA,MAAA,UAAA,SAAA,kBAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EACA,OAAA;AACA,WAAA;AAAA,MACA,UAAA,KAAA,OAAA,OAAA;AAAA,MACA,MAAA,KAAA,OAAA,OAAA;AAAA,MACA,IAAA,KAAA,OAAA,OAAA;AAAA,IACA;AAAA,EACA;AAAA,EACA,UAAA;AAAA,IACA,GAAAC,EAAA,QAAA;AAAA,MACA;AAAA,IACA,CAAA;AAAA,IACA,GAAAA,EAAA,YAAA;AAAA,MACA;AAAA,IACA,CAAA;AAAA,IACA,QAAA;AACA,aAAA,KAAA;AAAA,IACA;AAAA,IACA,OAAA;AACA,aAAA,KAAA,aAAA,eACA,KAAA,gBACA,KAAA,GAAA,uCAAA,IACA,KAAA,GAAA,uCAAA,IACA,KAAA,aAAA,aACA,KAAA,gBACA,KAAA,GAAA,qCAAA,IACA,KAAA,GAAA,qCAAA,IACA;AAAA,IACA;AAAA,IACA,iBAAA;AACA,aAAA,KAAA,OAAA,SAAA;AAAA,IACA;AAAA,IACA,yBAAA;AACA,aAAA,KAAA,SAAA;AAAA,IACA;AAAA,IACA,YAAA;AACA,aAAA,KAAA,iCAAA,KAAA,QAAA;AAAA,IACA;AAAA,IACA,iBAAA;AAEA,aAAA,KAAA,OAAA,KAAA,SAAA,WAAA,IACA,KAAA,MAAA,KAAA,QAAA,EAAA,QAAA,UAAA,IAEA,KAAA,MAAA,KAAA,QAAA,EAAA,QAAA,KAAA,IAAA;AAAA,IAEA;AAAA,IACA,mBAAA;AACA,aAAA,KAAA,iCAAA,UAAA;AAAA,IACA;AAAA,IACA,qBAAA;AACA,aAAA,KAAA,aAAA;AAAA,IACA;AAAA,EACA;AAAA,EACA,SAAA;AAAA,IACA,GAAAC,EAAA,YAAA;AAAA,MACA;AAAA,IACA,CAAA;AAAA,IACA,GAAAA,EAAA,QAAA;AAAA,MACA;AAAA,IACA,CAAA;AAAA,IACA,iCAAAC,GAAA;AACA,YAAAC,IAAA,KAAA,MAAAD,CAAA,EAAA,IAAA,OAAA,KAAA,GAAA,sBAAAA,CAAA,YAAA,CAAA,OAAA,CAAA;AACA,UAAAA,MAAA,iBAAA;AAEA,cAAAE,IAAAD,EAAA,SAAA;AACA,QAAAA,EAAAC,CAAA,IAAA,KAAA,GAAA,sBAAAF,CAAA,mBAAA;AAAA,MACA;AACA,aAAAC;AAAA,IACA;AAAA,IACA,wBAAA;AAKA,WAAA,MAAA,KAAA,SAGA,KAAA,aAAA,EAAA,WAAA,KAAA,OAAA,IAAA,IAMA,KAAA,QAAA,OALA,KAAA,gBAAA;AAAA,IAOA;AAAA,IACA,eAAA;AAEA,UAAAE,GACAC;AAEA,aAAA,KAAA,aAAA,mBACAD,IAAA,KAAA,YAAA,SAAA,CAAA,GACAC,IAAA,GAAA,KAAA,KAAA,QAAA,sBAAA,QAAA,aAAAD,CAAA,WAAA,KAAA,MAAA,MAAA,kBAEAA,IAAA,KAAA,YAAA,KAAA,QAAA,EAAA,CAAA,GACAC,IAAA,GAAA,KAAA,KAAA,QAAA,sBAAA,QAAA,IAAA,KAAA,QAAA,IAAAD,CAAA,WAAA,KAAA,MAAA,MAAA,gBAEAC;AAAA,IACA;AAAA,IACA,kBAAA;AACA,WAAA,QAAA,KAAA,KAAA,aAAA,CAAA,EAAA,MAAA,MAAA;AAAA,MAAA,CAAA;AAAA,IACA;AAAA,IACA,kBAAA;AAEA,eAAA,iBAAA,qCAAA,EAAA,QAAA,CAAAC,GAAAC,MAAA;AAEA,QAAA,KAAA,YAAA,KAAA,QAAA,EAAAA,CAAA,MAAA,aAEAD,EAAA,UAAA,MAAA,KAAA,QAAA,KAAA,GAAA,KAAA,KAAA,QAAA,sBAAA,QAAA,IAAA,KAAA,QAAA,oBAAA,KAAA,MAAA,MAAA,EAAA,EAAA,MAAA,MAAA;AAAA,QAAA,CAAA,IACA,KAAA,YAAA,KAAA,QAAA,EAAAC,CAAA,MAAA,iBAEA,KAAA,aAAA,aACAD,EAAA,UAAA,MAAA,KAAA,QAAA,KAAA,GAAA,KAAA,KAAA,QAAA,sBAAA,QAAA,iCAAA,KAAA,MAAA,MAAA,EAAA,EAAA,MAAA,MAAA;AAAA,QAAA,CAAA,IACA,KAAA,aAAA,oBAEAA,EAAA,UAAA,MAAA,KAAA,QAAA,KAAA,GAAA,KAAA,KAAA,QAAA,sBAAA,QAAA,IAAA,KAAA,QAAA,iBAAA,KAAA,EAAA,WAAA,KAAA,MAAA,MAAA,EAAA,EAAA,MAAA,MAAA;AAAA,QAAA,CAAA,KAGA,KAAA,aAAA,kBAEAA,EAAA,UAAA,MAAA,KAAA,QAAA,KAAA,GAAA,KAAA,KAAA,QAAA,sBAAA,QAAA,IAAA,KAAA,QAAA,IAAA,KAAA,YAAA,KAAA,QAAA,EAAAC,CAAA,CAAA,IAAA,KAAA,EAAA,WAAA,KAAA,MAAA,MAAA,EAAA,EAAA,MAAA,MAAA;AAAA,QAAA,CAAA,IAEAD,EAAA,UAAA,MAAA,KAAA,QAAA,KAAA,GAAA,KAAA,KAAA,QAAA,sBAAA,QAAA,IAAA,KAAA,QAAA,IAAA,KAAA,YAAA,KAAA,QAAA,EAAAC,CAAA,CAAA,WAAA,KAAA,MAAA,MAAA,EAAA,EAAA,MAAA,MAAA;AAAA,QAAA,CAAA;AAAA,MAGA,CAAA,GAEA,SAAA,iBAAA,wCAAA,EAAA,QAAA,CAAAD,GAAAC,MAAA;AACA,QAAAD,EAAA,UAAA,MAAA,KAAA,QAAA,KAAA,GAAA,KAAA,KAAA,QAAA,sBAAA,QAAA,aAAA,KAAA,YAAA,SAAAC,CAAA,CAAA,WAAA,KAAA,MAAA,MAAA,EAAA,EAAA,MAAA,MAAA;AAAA,QAAA,CAAA;AAAA,MACA,CAAA;AAAA,IACA;AAAA,IACA,eAAA;AACA,UAAA;AACA,QAAA,SAAA,eAAA,eAAA,EAAA,aAAA,KACA,SAAA,eAAA,eAAA,EAAA,UAAA,IAAA,yBAAA,IAGA,SAAA,eAAA,eAAA,EAAA,UAAA,OAAA,yBAAA;AAAA,MAEA,QAAA;AAAA,MACA;AAAA,IACA;AAAA,EAEA;AAAA,EACA,UAAA;AACA,WAAA,iBAAA,UAAA,KAAA,YAAA,GACA,KAAA,qBAAA;AAAA,EACA;AAAA,EACA,UAAA;AACA,SAAA,gBAAA,GACA,KAAA,uBAAA,KAAA,QAAA;AAAA,EACA;AAAA,EACA,YAAA;AACA,WAAA,oBAAA,UAAA,KAAA,YAAA;AAAA,EACA;AACA;;;;;;;;;;;;;;;"}

package/dist/data-provider-interface/DataProviderInterface.vue2.mjs

@@ -0,0 +1,5 @@
+const e = "";
+export {
+  e as default
+};
+//# sourceMappingURL=DataProviderInterface.vue2.mjs.map

package/dist/data-provider-interface/DataProviderInterface.vue2.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataProviderInterface.vue2.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/data-provider-interface/components/AutocompleteInput.vue.d.ts

@@ -0,0 +1,101 @@
+import { getTranslationFor } from '../../utils/helpers';
+declare const _default: import('../../../vue/dist/vue.esm.js').DefineComponent<{
+    context: {
+        type: ObjectConstructor;
+        required: true;
+    };
+    voc: {
+        type: StringConstructor;
+        required: true;
+    };
+    subject: {
+        type: BooleanConstructor;
+        required: false;
+    };
+    annifTheme: {
+        type: BooleanConstructor;
+        required: false;
+    };
+    multiple: {
+        type: BooleanConstructor;
+        required: false;
+    };
+}, {}, {
+    autocomplete: {
+        text: string;
+        selected: boolean;
+        suggestions: never[];
+        clicked: boolean;
+    };
+    choice: boolean;
+    themeSuggestionList: {};
+    manSearch: boolean;
+    values: never[];
+    annifEnv: boolean;
+    annifThemeEnv: {
+        useService: boolean;
+        basePath: string;
+        specification: "dcatap" | "dcatapde";
+        annifIntegration: boolean;
+        buttons: {
+            Dataset: boolean;
+            Catalogue: boolean;
+        };
+        doiRegistrationService: {
+            persistentIdentifierType: string;
+        };
+    };
+    valueListOfThemes: never[];
+    thSwitch: boolean;
+    annifChoicebtnClicked: boolean;
+}, {
+    filteredAutocompleteSuggestions(): never[];
+}, {
+    truncateWords(word: any, lettersToDisplay: any): any;
+    sortAlpabetically(arr: any): any[];
+    getTranslationFor: typeof getTranslationFor;
+    deleteValue(value: any): void;
+    focusAutocomplete(): void;
+    clearAutocompleteSuggestions(): void;
+    hideSuggestions(): void;
+    getAutocompleteSuggestions(): void;
+    animateFadeInOut(): void;
+    handleAnnifClick(e: any): void;
+    setTooltip(): void;
+    handleAnnifDuplicates(): any[];
+    handleAnnifSuggestions(e: any, input: any): void;
+    annifHandlerTheme(input: any): Promise<void>;
+    handleAutocompleteSuggestions(suggestion: any): void;
+    getResourceName(resource: any): Promise<{
+        name: string;
+        resource: string;
+    }>;
+    handleValues(): Promise<void>;
+    clearAutocomplete(): void;
+}, import('../../../vue/dist/vue.esm.js').ComponentOptionsMixin, import('../../../vue/dist/vue.esm.js').ComponentOptionsMixin, {}, string, Readonly<import('../../../vue/dist/vue.esm.js').ExtractPropTypes<{
+    context: {
+        type: ObjectConstructor;
+        required: true;
+    };
+    voc: {
+        type: StringConstructor;
+        required: true;
+    };
+    subject: {
+        type: BooleanConstructor;
+        required: false;
+    };
+    annifTheme: {
+        type: BooleanConstructor;
+        required: false;
+    };
+    multiple: {
+        type: BooleanConstructor;
+        required: false;
+    };
+}>>, {
+    subject: boolean;
+    annifTheme: boolean;
+    multiple: boolean;
+}>;
+export default _default;

package/dist/data-provider-interface/components/AutocompleteInput.vue.mjs

@@ -0,0 +1,305 @@
+import { mapActions as h } from "vuex";
+import { truncate as m, getTranslationFor as c } from "../../utils/helpers.mjs";
+import u from "jquery";
+import d from "axios";
+import f from "qs";
+import "./AutocompleteInput.vue2.mjs";
+import p from "../../_virtual/_plugin-vue2_normalizer.mjs";
+const v = {
+  props: {
+    context: {
+      type: Object,
+      required: !0
+    },
+    voc: {
+      type: String,
+      required: !0
+    },
+    subject: {
+      type: Boolean,
+      required: !1
+    },
+    annifTheme: {
+      type: Boolean,
+      required: !1
+    },
+    multiple: {
+      type: Boolean,
+      required: !1
+    }
+  },
+  data() {
+    return {
+      autocomplete: {
+        text: "",
+        selected: !1,
+        suggestions: [],
+        clicked: !1
+      },
+      choice: !1,
+      themeSuggestionList: {},
+      manSearch: !1,
+      values: [],
+      annifEnv: this.$env.content.dataProviderInterface.annifIntegration,
+      annifThemeEnv: this.$env.content.dataProviderInterface,
+      valueListOfThemes: [],
+      thSwitch: !1,
+      annifChoicebtnClicked: !1
+    };
+  },
+  computed: {
+    filteredAutocompleteSuggestions() {
+      return this.autocomplete.selected ? [] : (this.autocomplete.suggestions = this.sortAlpabetically(this.autocomplete.suggestions), this.autocomplete.suggestions.slice(0, 10));
+    }
+  },
+  mounted() {
+    this.annifEnv || (this.manSearch = !this.manSearch), setTimeout(() => {
+      for (var t = 0; t < Object.keys(this.values).length; t++)
+        this.valueListOfThemes.push(this.values[t]);
+    }, 2e3);
+  },
+  methods: {
+    ...h("dpiStore", [
+      "requestFirstEntrySuggestions",
+      "requestAutocompleteSuggestions",
+      "requestResourceName"
+    ]),
+    truncateWords(t, e) {
+      return t.split("").length <= e ? t : m(t, e, !0) + " ...";
+    },
+    // small function to sort alphabetically
+    sortAlpabetically(t) {
+      let e = [...t];
+      return e.sort((i, s) => {
+        let a = 0;
+        return i.name < s.name ? a = -1 : i.name > s.name && (a = 1), a;
+      }), e;
+    },
+    getTranslationFor: c,
+    deleteValue(t) {
+      this.values = this.values.filter((e) => e.resource !== t), this.context.model = this.values.filter((e) => e.resource !== t).map((e) => e.resource), this.autocomplete.text = "", this.context.rootEmit("change"), this.values.length === 0 && (this.choice = !1);
+    },
+    focusAutocomplete() {
+      this.autocomplete.selected = !1, this.autocomplete.text = "", this.getAutocompleteSuggestions();
+    },
+    clearAutocompleteSuggestions() {
+      this.autocomplete.suggestions = [];
+    },
+    hideSuggestions() {
+      this.autocomplete.selected = !0;
+    },
+    getAutocompleteSuggestions() {
+      this.choice = !0;
+      let t = this.voc, e = this.autocomplete.text;
+      this.clearAutocompleteSuggestions(), t == "political-geocoding-municipality-key" || t == "political-geocoding-regional-key" || t == "political-geocoding-municipal-association-key" || t == "political-geocoding-district-key" || t == "political-geocoding-government-district-key" || t == "political-geocoding-state-key" ? this.autocomplete.text.length <= 1 && this.requestFirstEntrySuggestions(t).then((i) => {
+        const s = i.data.result.results.map((a) => ({
+          name: c(a.alt_label, this.$i18n.locale, []),
+          resource: a.resource
+        }));
+        this.autocomplete.suggestions = s;
+      }) : this.autocomplete.text.length <= 1 ? this.requestFirstEntrySuggestions(t).then((i) => {
+        const s = i.data.result.results.map((a) => ({
+          name: c(a.pref_label, this.$i18n.locale, []),
+          resource: a.resource
+        }));
+        this.autocomplete.suggestions = s, this.autocomplete.suggestions.splice(0, 0, { name: "--- Choose from the suggested entries or search the vocabulary ---", resource: "None" });
+      }) : this.requestAutocompleteSuggestions({ voc: t, text: e }).then((i) => {
+        const s = i.data.result.results.map((a) => ({
+          name: c(a.pref_label, this.$i18n.locale, []) + " (" + a.id + ")",
+          resource: a.resource
+        }));
+        s.length === 0 ? this.autocomplete.suggestions = [{ name: "--- No results found! ---", resource: "None" }] : this.autocomplete.suggestions = s;
+      });
+    },
+    animateFadeInOut() {
+      var t = 100;
+      u("#suggestedAnnifItemsTheme").children().each(function() {
+        setTimeout(() => {
+          u(this).addClass("fadeIn");
+        }, t), t += 100;
+      });
+    },
+    handleAnnifClick(t) {
+      if (t.target.classList.contains("annifItems")) {
+        t.target.classList.toggle("greenBG");
+        for (var e = 0; e < Object.keys(this.valueListOfThemes).length; e++) {
+          if (t.target.dataset.originalTitle == this.valueListOfThemes[e].name && this.valueListOfThemes[e].activeValue == !1) {
+            this.valueListOfThemes[e].activeValue = !0, this.handleAutocompleteSuggestions(this.valueListOfThemes[e]);
+            break;
+          }
+          if (t.target.dataset.originalTitle == this.valueListOfThemes[e].name && this.valueListOfThemes[e].activeValue == !0) {
+            this.deleteValue(this.valueListOfThemes[e].resource);
+            break;
+          }
+          if (t.target.title == this.valueListOfThemes[e].name && this.valueListOfThemes[e].activeValue == !0) {
+            this.deleteValue(this.valueListOfThemes[e].resource);
+            break;
+          }
+          if (t.target.title == this.valueListOfThemes[e].name && this.valueListOfThemes[e].activeValue == !1) {
+            this.valueListOfThemes[e].activeValue = !0, this.handleAutocompleteSuggestions(this.valueListOfThemes[e]);
+            break;
+          }
+        }
+      }
+    },
+    setTooltip() {
+      setTimeout(() => {
+        u('[data-toggle="tooltip"]').tooltip();
+      });
+    },
+    handleAnnifDuplicates() {
+      let t = [];
+      for (var e in this.valueListOfThemes)
+        this.valueListOfThemes[e].activeValue == !0 && t.push(this.valueListOfThemes[e]);
+      return t;
+    },
+    handleAnnifSuggestions(t, e) {
+      this.annifHandlerTheme(JSON.parse(localStorage.getItem("dpi_datasets")).step1["dct:description"][0]["@value"]);
+    },
+    async annifHandlerTheme(t) {
+      this.valueListOfThemes = this.handleAnnifDuplicates();
+      let e = f.stringify({
+        text: t,
+        limit: 10
+      });
+      var i;
+      this.voc == "eurovoc" ? i = {
+        method: "post",
+        url: this.$env.content.dataProviderInterface.annifLinkSubject,
+        headers: {
+          "Content-Type": "application/x-www-form-urlencoded",
+          Accept: "application/json"
+        },
+        data: e
+      } : i = {
+        method: "post",
+        url: this.$env.content.dataProviderInterface.annifLinkTheme,
+        headers: {
+          "Content-Type": "application/x-www-form-urlencoded",
+          Accept: "application/json"
+        },
+        data: e
+      };
+      let s = [];
+      d(i).then(async (a) => {
+        for (let n = 0; n < a.data.results.length; n++) {
+          let l = await this.getResourceName(a.data.results[n].uri);
+          s[n] = { name: l.name, resource: l.resource, activeValue: !1 };
+        }
+        let o = s.filter(((n) => (l) => n.has(l.resource))(new Set(this.values.map((n) => n.resource))));
+        o = s.filter(((n) => (l) => !n.has(l.resource))(new Set(this.values.map((n) => n.resource))));
+        for (var r = 0; r < o.length; r++)
+          this.valueListOfThemes.push(o[r]);
+        this.animateFadeInOut(), this.setTooltip();
+      }).catch(function(a) {
+        console.log(a);
+      });
+    },
+    handleAutocompleteSuggestions(t) {
+      this.autocomplete.selected = !0, t.resource != "None" && (this.multiple ? (this.values.map((e) => e.resource).includes(t.resource) || this.values.push(t), this.autocomplete.text = this.values.map((e) => e.name)[this.values.length - 1], this.context.model = this.values.map((e) => e.resource)) : (this.autocomplete.text = t.name, this.context.model = t.resource, this.context.altLabel = t.name), this.context.rootEmit("change"), this.annifTheme && t.activeValue == null && (t.activeValue = !0, this.valueListOfThemes.push(t), this.animateFadeInOut()));
+    },
+    async getResourceName(t) {
+      let e = { name: "", resource: "" }, i = this.voc === "iana-media-types" || this.voc === "spdx-checksum-algorithm";
+      return await this.requestResourceName({ voc: this.voc, resource: t }).then(
+        (s) => {
+          let a = i ? s.data.result.results.filter((o) => o.resource === t).map((o) => o.pref_label)[0].en : c(s.data.result.pref_label, this.$i18n.locale, []);
+          e.name = a, e.resource = t;
+        }
+      ), e;
+    },
+    async handleValues() {
+      if (this.context.model !== "")
+        if (Array.isArray(this.context.model)) {
+          const e = [];
+          for (let i = 0; i < this.context.model.length; i += 1) {
+            const s = await this.getResourceName(
+              this.context.model[i]
+            );
+            e.push(s), this.autocomplete.text = s.name;
+          }
+          if (this.values = e, this.annifTheme) {
+            for (var t = 0; t < Object.keys(this.values).length; t++)
+              this.values[t].activeValue = !0;
+            this.animateFadeInOut(), this.setTooltip();
+          }
+          this.values.length > 0 && (this.choice = !0);
+        } else {
+          const e = await this.getResourceName(this.context.model);
+          this.autocomplete.text = e.name, this.choice = !0;
+        }
+    },
+    clearAutocomplete() {
+      this.choice = !1, this.multiple && (this.values = []), this.context.model = "", this.autocomplete.text = "", this.context.rootEmit("change");
+    }
+  },
+  directives: {
+    "click-outside": {
+      bind(t, e, i) {
+        t.clickOutsideEvent = (s) => {
+          t === s.target || t.contains(s.target) || i.context[e.expression](s);
+        }, document.body.addEventListener("click", t.clickOutsideEvent);
+      },
+      unbind(t) {
+        document.body.removeEventListener("click", t.clickOutsideEvent);
+      }
+    }
+  },
+  watch: {
+    // context contains predefined values from parent form which need to be filled in for edit purpose
+    context: {
+      async handler() {
+        await this.handleValues(), this.annifChoicebtnClicked = !0;
+      }
+    }
+  }
+};
+var g = function() {
+  var e = this, i = e._self._c;
+  return i("div", e._g({ class: `formulate-input-element formulate-input-element--${e.context.type}`, attrs: { "data-type": e.context.type } }, e.$listeners), [i("div", { directives: [{ name: "click-outside", rawName: "v-click-outside", value: e.hideSuggestions, expression: "hideSuggestions" }], staticClass: "input-group suggestion-input-group mb-3" }, [i("input", { directives: [{ name: "model", rawName: "v-model", value: e.context.model, expression: "context.model" }], attrs: { hidden: "" }, domProps: { value: e.context.model }, on: { blur: e.context.blurHandler, input: function(s) {
+    s.target.composing || e.$set(e.context, "model", s.target.value);
+  } } }), e._v(" "), e.annifTheme && e.annifEnv ? i("div", { staticClass: "annifButtonWrap" }, [i("a", { staticClass: "annifItems annifHandleBtn" }, [i("a", { staticClass: "annifHandleBtn", on: { click: function(s) {
+    return e.handleAnnifSuggestions(s, "theme");
+  } } }, [e._v(`Generate description based
+          suggestions`)])]), e._v(" "), i("a", { staticClass: "annifItems annifHandleBtn", on: { click: function(s) {
+    e.manSearch = !e.manSearch;
+  } } }, [e._v("Manually search the vocabulary")])]) : e._e(), e._v(" "), i("div", { staticClass: "position-relative d-flex align-items-center justify-content-center w-100" }, [!e.annifTheme || e.manSearch ? i("input", { directives: [{ name: "model", rawName: "v-model", value: e.autocomplete.text, expression: "autocomplete.text" }], staticClass: "form-control", attrs: { type: "text", placeholder: e.$t("message.dataupload.searchVocabulary") }, domProps: { value: e.autocomplete.text }, on: { focus: function(s) {
+    return e.focusAutocomplete();
+  }, input: [function(s) {
+    s.target.composing || e.$set(e.autocomplete, "text", s.target.value);
+  }, function(s) {
+    return e.getAutocompleteSuggestions();
+  }] } }) : e._e(), e._v(" "), i("div", { staticClass: "position-relative h-100", on: { click: e.clearAutocomplete } }, [e.annifTheme ? e._e() : i("a", { staticClass: "custom-remove", class: { remBG: e.choice } })])]), e._v(" "), i("div", { staticClass: "suggestion-list-group" }, [i("ul", { staticClass: "list-group suggestion-list" }, e._l(e.filteredAutocompleteSuggestions, function(s, a) {
+    return i("button", { key: a, staticClass: "list-group-item list-group-item-action", on: { click: function(o) {
+      return e.handleAutocompleteSuggestions(s);
+    } } }, [i("p", { staticClass: "m-0 p-0" }, [e._v(e._s(s.name))])]);
+  }), 0)]), e._v(" "), e.annifTheme && e.multiple && e.annifEnv ? i("div", { attrs: { id: "suggestedAnnifItemsTheme" } }, [e._l(e.valueListOfThemes, function(s, a) {
+    return i("div", { key: a, staticClass: "annifItems", class: { fadeIn: e.annifChoicebtnClicked, greenBG: s.activeValue }, attrs: { "data-toggle": "tooltip", "data-placement": "top", title: s.name }, on: { click: function(o) {
+      return e.handleAnnifClick(o);
+    } } }, [e._v(`
+        ` + e._s(e.truncateWords(s.name, 35, !0)) + `
+
+
+      `)]);
+  }), e._v(" "), i("p", { staticClass: "ml-2 mb-0", staticStyle: { "font-size": "12px" } }, [e._v(`This field can be auto generated. If you click the generate button,
+        it will suggest the most fitting properties based on the dataset-description you provided.`)])], 2) : e._e(), e._v(" "), e.multiple && e.values.length > 0 && !e.annifEnv ? i("div", { staticClass: "selected-values-div" }, e._l(e.values, function(s, a) {
+    return i("span", { key: a, staticClass: "selected-value" }, [e._v(`
+        ` + e._s(s.name) + `
+        `), i("span", { staticClass: "delete-selected-value", attrs: { "aria-hidden": "true" }, on: { click: function(o) {
+      return e.deleteValue(s.resource);
+    } } }, [e._v("×")])]);
+  }), 0) : e._e()])]);
+}, x = [], y = /* @__PURE__ */ p(
+  v,
+  g,
+  x,
+  !1,
+  null,
+  "607f2c84",
+  null,
+  null
+);
+const L = y.exports;
+export {
+  L as default
+};
+//# sourceMappingURL=AutocompleteInput.vue.mjs.map